Javascript Intellisense Improvements in VS 2010

This is the twentieth article in the series that I dedicated to VS 2010 and .NET 4.

Today’s post covers some of the great improvements coming in Intellisense with VS 2010 and the free Visual Web Developer 2010 Express for JavaScript. It began to load faster with large script files and supports the completion of expressions for even more scripts, compared to previous versions of Visual Studio.

JavaScript Intellisense Improvements

It is much more difficult to provide Intellisense support for a dynamic language like JavaScript than for strongly typed languages ​​like C # and VB. It is impossible to properly assess the form and structure of variables, methods, etc. without the pseudo-launch of the code itself, since JavaScript is very flexible and can dynamically change these objects.
')
The JavaScript editor in VS 2010 is now endowed with an “intellect” that allows you to execute pseudo-code as you type, so intellisense remains accurate with auto-completion. Below is a simplified overview of how rich and flexible the new functionality is in the final version.

Scenario number 1: Basic type assessment

When declaring a variable in JavaScript, you do not need to set the data type. The type is determined by the bound value. Since VS 2010 performs pseudo-running code in the editor, it dynamically determines the type of the variable and provides intrinsic intellisense based on the assigned value of the variable.

For example, notice how VS 2010 provides a list of add-ons for a string (we after all assigned the string value “foo” to a variable)



If we later give it a numeric value, the list of assumptions will automatically change and, accordingly, will give out objects for working with numbers:

Scenario number 2: Intellisense during the manipulation of browser objects

A fairly common action in JavaScript is working with the DOM page, as well as working with browser objects available on the client.

In previous versions of Visual Studio, there was also support for intellisense with standard browser objects, but it did not provide help with more clever scripts (creating dynamic variables and methods). Pseudo-running code in VS 2010 allows us to get rich intellisense for a wider set of scenarios.

For example, below we use the window browser object to create a global variable called “bar”. Notice what we get from intellisense when we want to use a variable after it is declared:



When we assign the variable “bar” a numeric value instead of a string, the intellisense engine in VS 2010 correctly determines its type and changes the list of sentences for working with a number:

Scenario number 3: Show must go on

As a result of the pseudo-launch of the code in VS 2010 editor, you have the ability to handle various scenarios and intellisense will always work everywhere.

For example, below we use the for loop and the window browser object to dynamically create and set a name for several dynamic variables (bar1, bar2, bar3 ... bar9). Please note that the intellisense engine of the editor defines and provides a list of assumptions for them:



Since variables are added to the window's browser object, they are also global, they are displayed in the list of global intellisense variables:



Did not you forget? Type definition is still supported. So, if we assign a dynamic variable to a string, then we get a list for working with the string, if it is a number, the type will also change to a numeric one.

And now for fun, let's make the for loop assign the string to variables if the counter is even (bar2, bar4, bar6) and numbers, if the counter is odd (bar1, bar3, bar5):



And here intellisense did not disappoint and correctly output everything for the string variable “bar2” and “bar1” further:



Although this example is contrived, creating variables, methods, and event handlers on the fly is common in many JavaScript libraries. Many popular libraries use packaging techniques that make script size as small as possible. VS 2010 supports parsing and pseudo-starting libraries that use this script packaging approach, giving you improved Intellisense support right out of the box.

Results

Now Visual Studio 2010, including free Visual Web Developer 2010 Express, provides richer JavaScript intellisense support. All this works with most popular JavaScript libraries and should help facilitate the development of client-side JavaScript code and AJAX scripts in your ASP.NET applications.