JavaScript implementation classes and inheritance

1. Introduction

Some people think that JavaScript is a process-oriented language. Because the basic usage is basically to write a function and then call it. ==> This idea is wrong.

The founder of JS is: Brendan Eich. When JS was founded, Java and object-oriented design were already very popular.

In May 1995, Netscape made a decision that future web scripting languages ​​must "look similar enough to Java", but be simpler than Java so that non-professional web page authors can get started quickly.

Based on this, the design ideas are:

　　 (1) Learn from the basic syntax of C language;

　 (2) Learn from the data types and memory management of Java language;

　 (3) Learn from Scheme language to improve functions To the status of "first class citizen";

　 (4) Learn from the Self language and use the inheritance mechanism based on prototype.

Because the author himself is not interested in the java language. So the Javascript language is actually a mixture of two language styles - (simplified) functional programming + (simplified) object-oriented programming.

What’s more interesting is that the author himself is not very familiar with this language. Satisfied ==》

"It is better to say that I hate Javascript than I love it. It is the product of a one-night stand between C language and Self language"

2. Class Library

JS does not have the concept of Class and uses prototype to implement the inheritance mechanism. .

For programmers who are accustomed to the class usage mechanism of Java and C# languages, it is not very easy to use.

John Resig, the author of JQuery, also provides a library. Class and extend can be used in JS.

Class.js

[javascript]

/*

* Simple JavaScript Inheritance

* By John Resig http://ejohn.org/

* MIT Licensed.

*

***** *************************************************

* Example Usage

************************************************ **********

var Person = Class.extend({

init: function(isDancing){

this.dancing = isDancing;

},

dance: function(){

Return this.dancing;

}

});

dance ) ;

var p = new Person(true);

p.dance(); // => true

var n = new Ninja();

n.dance(); // => false

n.swingSword(); // => true

// Should all be true

p instanceof Person && p instanceof Class &&

n instanceof Ninja && n instanceof Person && n instanceof Class

************************************************ *********

*/

// Inspired by base2 and Prototype

(function(){

var fnTest = /xyz/.test(function(){xyz;}) ? /b_superb/ : /.*/;

// The base Class implementation (does nothing)

this.Class = function(){};

// Create a new Class that inherits from this class

Class.extend = function(prop) {

var _super = this.prototype;

// Instantiate a base class (but only create the instance,

// don't run the init constructor)

initializing = true;

var prototype = new this();

initializing = false;

// Copy the properties over onto the new prototype

for (var name in prop) {

// Check if we're overwriting an existing function

prototype[name] = typeof prop[name] == "function" &&

typeof _super[name] == "function" && fnTest.test(prop[name]) ?

                                                                                                               ,,,,,,,,,,,,,,,,,,,,,,,, // Add a new ._super() method that is the same method

            // but on the super-class  

            this._super = _super[name];  

             

            // The method only need to be bound temporarily, so we  

            // remove it when we're done executing  

            var ret = fn.apply(this, arguments);         

            this._super = tmp;  

             

            return ret;  

          };  

        })(name, prop[name]) :  

        prop[name];  

    }  

     

    // The dummy class constructor  

    function Class() {  

      // All construction is actually done in the init method  

      if ( !initializing && this.init )  

        this.init.apply(this, arguments);  

    }  

     

    // Populate our constructed prototype object  

    Class.prototype = prototype;  

     

    // Enforce the constructor to be what we expect  

    Class.prototype.constructor = Class;  

  

    // And make this class extendable  

    Class.extend = arguments.callee;  

     

    return Class;  

  };  

})();  

 

 

 

 

3. 分析

以上的Class.js 实现机制其实很简单。 使用JS 的Prototype 和argumnet、apply、 callee 这些来实现的