Oo javascript code completion in any IDE

问题:

Do you know any IDE which can autocomplete this kind of code?

I have a javascript class generator here:

(function() {
    var core = {
        bind : function(method, scope) {
            if (!( method instanceof Function))
                throw new TypeError("Function needed as method.");
            if ( typeof (scope) != "object")
                throw new TypeError("Object needed as scope.");
            return function() {
                return method.apply(scope, arguments);
            };
        },
        require : function(source) {
            if ( typeof (source) != "object" || !source)
                throw new TypeError("Object needed as source.");
            for (var property in source)
                if (source.hasOwnProperty(property) && !this.prototype.hasOwnProperty(property))
                    this.prototype[property] = source[property];
        },
        override : function(source) {
            if ( typeof (source) != "object" || !source)
                throw new TypeError("Object needed as source.");
            for (var property in source)
                if (source.hasOwnProperty(property))
                    this.prototype[property] = source[property];
        },
        extend : function(source) {
            var superClass = this;
            var newClass = source.hasOwnProperty("constructor") ? source.constructor : function() {
                superClass.apply(this, arguments);
            };
            newClass.superClass = superClass;

            var superClone = function() {
            };
            superClone.prototype = superClass.prototype;
            newClass.prototype = new superClone();
            newClass.prototype.constructor = newClass;

            if (source)
                newClass.override(source);
            return newClass;
        }
    };

    core.require.call(Function, core);

    Function.create = function (source){
        var newClass = source.hasOwnProperty("constructor") ? source.constructor : function() {};
        newClass.override(source);
        return newClass;
    };
})(); 

I need code completion (wrote in the comments) for these example classes:

//Function.prototype: bind, require, override, extend
//Function.create

var A = Function.create({ //offer Function.[create]
    test: function (){
        console.log("a");
    }
});

//A is a Function instance
//A.prototype: test

var B = A.extend({ //offer A.[extend]
    test: function (){
        console.log("b");
    },
    test2: function (){
        console.log("b2");
    }
});

//B is a Function instance
//B.prototype inherits from A.prototype
//B.prototype.test overrides A.prototype.test

var F = Function.create({ //offer Function.[create]
    getA: function (){
        return new A();
    },
    getB: function (){
        return new B();
    }
});
//F is a Function instance
//F.prototype getA, getB returns A and B instances

var f = new F(); //offer [F]
//f inherits from F.prototype
var a = f.getA(); //offer f.[getA]
//a inherits from A.prototype
var b = f.getB(); //offer f.[getB]
//b inhertis from B.prototype

a.test(); //offer a.[test]
b.test(); //offer b.[test]
b.test2(); //offer b.[test2]

So I must let the IDE somehow know, that these functions are existing in the Function.prototype, and these functions are creating Function instances and they are writing into the prototype of those instances. This is possible only with manual indexing of my code, like jsdoc, but that's not enough to describe for example inheritance. So I need an IDE which can handle at least js inheritance, and for which I can write a plugin that creates this indexing automatically. (Maybe the plugin could handle the inheritance too, I don't know how that indexing works exactly...)

Which IDE is capable of that (and how)?

回答1:

solution 1:

I found that in Eclipse the javascript indexer is a part of Web Tools Platform / Javascript Development Tools. The source code is here. The developers wrote that the InferEngine is easy extendable, so you can write an eclipse plugin. In that case this blog is really-really-really useful. It has great articles how to extend JSDT, and the JSDT developers can help too. Unfortunately I don't have much time to create such a thing if there is another solution.

solution 2:

Was looking around and found that the real problem is, that JSDOC 3 is not supported completely neither in Netbeans, nor in Eclipse JSDT and Aptana. The only IDE I found with JSDOC 3 support is Jetbrains WebStorm, so I'll use that. (Did not test the Resharper for Visual Studio, but it's JetBrains product either, so it possibly works too.)

The original example with jsdoc 3 in webstorm:

/** @class*/
var A = Function.create(//offer Function.[create] -> OK!
/** @lends A.prototype*/
{ 
    test: function (){
        console.log("a");
    },
    testA: function (){
        console.log("a2");
    }
});

/** @class*/
/** @extends A*/
var B = A.extend(//offer A.[extend] -> OK!
/** @lends B.prototype*/
{ 
    test: function (){
        console.log("b");
    },
    testB: function (){
        console.log("b2");
    }
});

/** @class*/
var F = Function.create(//offer Function.[create]  -> OK!
/** @lends F.prototype*/
{ 
    /** @returns A*/
    getA: function (){
        return new A();
    },
    /** @returns B*/
    getB: function (){
        return new B();
    }
});

var f = new F();
f.getA().test(); //offer f.[getA], offer f.getA().[test] -> OK
f.getA().testA(); //offer f.[getA], offer f.getA().[testA] -> OK
f.getB().test(); //offer f.[getB], offer f.getB().[test] -> OK
f.getB().testA(); //offer f.[getB], offer f.getB().[testA] -> OK
f.getB().testB(); //offer f.[getB], offer f.getB().[testB] -> OK

回答2:

You can use something like WebStorm or VisualStudio with Resharper 6 installed and it builds a list of all prototypes of all objects and you can use that.. its not particularly useful nor would I recommend it.. But somethings better than nothing..