views:

373

answers:

3

Brainstorming needed. I have a problem with Javascript libraries (jQuery, ExtJS etc.) that don't seem to play well along with Javascript Intellisense built in Visual Studio 2008. They provide certain utility helper functions that intellisense fails to understand.

ie. ExtJS code

// convenience function to create namespace object placeholders
Ext.namespace("Root.Sub.Subsub");

or jQuery

// doing the same thing in jQuery
$.extend(window, {
   Root: {
      Sub: {
         Subsub: {}
      } 
   },
});

or even (I pitty thou that shalt maintain this code)

$.extend(window, { Root: {}});
$.extend(Root, { Sub: {}});
$.extend(Root.Sub, { Subsub: {}});

The end result of these calls is basically the same. None of them would make Root namespace visible to Javascript Intellisense in Visual Studio 2008. If we would know how intellisense works under the hood we could probably be able to overcome this situation.

Is it possible to convince Intellisense to display/recognise these namespaces, without writing objects directly like:

Root = {
   Sub: {
      Subsub: {}
   }
};

I admit that the first jQuery call is quite similar to this one, but it's better to use extend functionality to prevent removing/overwriting existing functionality/namespaces.

Question

How should we use these utility functions to make Intellisense work?
Any brainstorming answer that would shed some light on this is welcome?

Edit

I've found out that namespaces created with utility functions are shown if they are defined outside (ie. in a different script file) and you make a reference to that file like:

/// <reference path="different.script.file.js" />

In this case everything's fine. But if you call utility functions within the same file, they're not listed in intellisense drop down list.

+1  A: 

As far as jQuery goes: Take a look at this blog post. This post is a good read as well.

I've tried a bunch of stuff to make Visual Studio recognize JavaScript objects and namespaces--the only solution I've found that works reliably is what you've mentioned yourself:

var RootNamespace = {
   SubNamespace: {
      SubSubNamespace: {}
   }
};


Update:

Developer 1 writes:

var RootNamespace = {
   SubNamespace: {
      SubSubNamespace: {}
   }
};

Developer 2 extends:

RootNamespace.SubNamespace.AnotherSubNamespace = {
    alertHelloWorld: function ()
    {
        alert("Hello World!");
    }
};
roosteronacid
What happens if your fellow developer writes something along the same lines? Like: name.spacing.recognition = {}; name.spacing.recognition.helloHell = function() { ... }? Your first code automagically disappears, doesn't it?
Robert Koritnik
if you override a variable, you override a variable. But you can extend the object literal.
roosteronacid
Updated my answer to show how you can extend namespaces.
roosteronacid
But. I used to work on a large scale project and you couldn't expect developers to know all namespaces within various files. So what if your Dev2 didn't know SubNamespace exists in the first place? YOur extension works of course, because you're adding something new to something else that already existed...
Robert Koritnik
I guess this is not really the best way to extend existing classes or creating namespaces... But it plays well with intellisense though...
Robert Koritnik
Aye. If you bend over backwards to make Visual Studio able to intellisensify your namespaces, you're gonna risk that. But what I've done is create a folder-structure reflecting the namespaces and subnamespaces. This helps a lot.
roosteronacid
Fair enough, but in my case this wouldn't work, because my files are structured in folders related to controls and not namespaces.
Robert Koritnik
A: 

Workaround

These utility methods actually work if you use them in a different script file and reference it in the one you would like to use those namespaces.

File1.js (assumes we have a custom jquery extension $.ns() that registeres new namespaces)

$.ns("Project.Controls", "Project.Pages", "Project.General.Utilities");
...

File2.js

/// <reference path="File1.js" />

// use custom namespaces
Project.Controls.InfoWindow = function(){
    ...
};

in File2.js we would have complete intellisense support for custom namespaces.

Drawback

We have to create namespaces elsewhere because I can't seem to make it work within the same script file.

Robert Koritnik
A: 

VS2008 looeses intelisense even if you declare the object as standard js and then try to extend it:

var opt = {
    SomeProperty: 1,
    SomeFunction: function(name,age) {}
};

opt = jQuery.extend(true, module.options, jQuery.extend(true, {}, opt, module.options));
op.SomeFunction("John", 20) // doesn't intelisense anymore

In order to get around this we need to move the extending operation on a function:

var opt = {
    SomeProperty: 1,
    SomeFunction: function(name,age) {}
};

function extendOptions() {
    opt = jQuery.extend(true, module.options, jQuery.extend(true, {}, opt, module.options));
}

extendOptions();
op.SomeFunction("John", 20) // now the intelisense works as expected
DotNetWise
Nice workaround. Thanks for the hint.
Robert Koritnik