开发者

Javascript inherit from array and make it global

开发者 https://www.devze.com 2023-04-02 09:26 出处:网络
The small demo below illustrates my problem: // 1 - Define a global reference to classA (function() { window.classA = new ClassA();

The small demo below illustrates my problem:

// 1 - Define a global reference to classA
(function() {
    window.classA = new ClassA();
})();

// 2 - ClassA object definition
function ClassA() {
    this.test1 = function() {
        document.write('test1');
    };
}

// 3 - ClassA inherits Array and has a test function
ClassA.prototype = new Array;
ClassA.prototype.test2 = function() {
    document.write(this[0]);
}

// 4 - Test our ClassA
var c = new ClassA();
c.test1();
c.push('test2');
c.test2();

// 5 - Test our global ClassA
classA.test1();
cla开发者_StackOverflow社区ssA.push('test2'); // doesn't work
classA.test2(); // doesn't work

Try it here: http://jsfiddle.net/SPSW4/

What is the proper way to define a global variable classA (ClassA instance)?


The correct approach would be to create the pseudo-sub-classed Array constructor within an immediately invoked function expression and then expose the result to an explicit global object.

(function( global ) {
    // Declare the ArrayLike constructor
    function ArrayLike() {
        var args = [].slice.call( arguments ), 
            length = args.length, i = 0;

        this.length = length;

        for ( ; i < length; i++ ) {
            this[ i ] = args[ i ];
        }
        return this;
    }
    // Define ArrayLike's prototype by creating a new Array instance
    ArrayLike.prototype = new Array();

    // Define your own proto method
    ArrayLike.prototype.firstChar = function() {
        var ret = [], 
            length = this.length, i = 0;

        for ( ; i < length; i++ ) {
            ret[ i ] = this[ i ][ 0 ];
        }
        return ret;
    };
    // Expose the ArrayLike constructor.
    global.ArrayLike = ArrayLike;
})( this );

var a = new ArrayLike( "alpha", "beta", "gamma" );

console.log( a.push("delta") ) // 4
console.log( a ); // ["alpha", "beta", "gamma", "delta"]
console.log( a.firstChar() ); // ["a", "b", "g", "d"]

See it live: http://jsfiddle.net/rwaldron/gLdkb/


Your code appears to be binding the global classA variable before ClassA is fully defined. I believe you will have more luck if you do it like:

// 1 - define ClassA 
window.ClassA = function() {
    this.test1 = function() {
        document.write('test1');
    };
};
ClassA.prototype = new Array;
ClassA.prototype.test2 = function() {
    document.write(this[0]);
}

// 2 - Define a global reference to classA
window.classA = new ClassA();

// 3 - Test our ClassA
var c = new ClassA();
c.test1();
c.push('test2');
c.test2();

// 4 - Test our global ClassA
classA.test1();
classA.push('test2'); // doesn't work
classA.test2(); // doesn't work

Here's an example: http://jsfiddle.net/SPSW4/2/


swap

// 2 - ClassA object definition
function ClassA() {
    this.test1 = function() {
        document.write('test1');
    };
}

// 1 - Define a global reference to classA
(function() {
    window.classA = new ClassA();
})();

declaration before calling functions in JavaScript, it is a scripting language.


Try this:

// 2 - ClassA object definition
function ClassA() {
    this.test1 = function() {
        document.write('test1');
    };
}


// 3 - ClassA inherits Array and has a test function
ClassA.prototype = new Array;
ClassA.prototype.test2 = function() {
    document.write(this[0]);
}

// 4 - Test our ClassA
var c = new ClassA();
c.test1();
c.push('test2');
c.test2();

// 1 - Define a global reference to classA
window.classA = new ClassA();

// 5 - Test our global ClassA
classA.test1();
classA.push('test2');
classA.test2();

Actually there were two problems: 1. Creating object before declaring class 2. Creating object before extending class


Define your class

ClassA = function()
{
    this.test1 = function()
    {
        document.write('test1');
    };
};

Then apply array prototype

ClassA.prototype = Array.prototype;

Then you can extend your class

ClassA.prototype.test2 = function()
{
    document.write(this[0]);
};

About the “global reference” part. In the first part of your code your are not making a reference, you are instancing a class which has not been defined yet at that point. There is no need to do that also. What is your point with that part?



  1. Move the class definition before the call.

    Note: The only thing that really needs to come first is the prototyping, since your code first assigns the class, but never sees the effect of the prototyping, which occurs later. Your class assignment should come after the prototypes.

  2. You're missing a ; after the test2() definition.


// Class Definition
function ClassA() {
   this.test1 = function() { document.write('foo'); };
}
   ClassA.prototype       = new Array();
   ClassA.prototype.test2 = function() { document.write(this[0]); };


// Init
(function() { 
   window.classA = new ClassA(); 
})();

// Method Calls
var c = new ClassA();
    c.test1();
    c.push('bar');
    c.test2();

classA.test1();
classA.push('bar');
classA.test2();
0

精彩评论

暂无评论...
验证码 换一张
取 消