How JavaScript implements Inheritance

This is the current object that refers to the current Page Object window if you use this in a global scope, and if this is used in a function, this refers to what is invoked on the object based on this function at run time.

We can also use apply and call two global methods to change the specific point of this in the function.  First look at an example of using this in a global scope: <script type= "Text/javascript" > console.log (this = = window);  True Console.log (Window.alert = = = This.alert);  True Console.log (This.parseint ("021", 10));
            This in the </script> function is determined at run time, not when the function is defined, as follows://define a global function foo () {
        Console.log (This.fruit);
        //define a global variable, equivalent to Window.fruit = "Apple";
        var fruit = "Apple";  This point in the function Foo to the Window object, this invocation mode and Window.foo () is exactly equivalent to foo (); 
        "Apple"/Customize an object and point the object's property foo to the global function foo var pack = {fruit: "orange", Foo:foo
        }; This point in the function Foo points to the Window.pack object Pack.foo ();
    The "Orange" global function apply and call can be used to change the point of this in the function, as follows://define a global function, Foo () {        Console.log (This.fruit);
        //define a global variable var fruit = "Apple";
        
        Customize an object var pack = {fruit: "orange"};
        Equivalent to Window.foo ();  foo.apply (window);    "Apple"/This time in Foo's this = = Pack foo.apply (pack);
 

"Orange" Note: Apply and call two functions are the same, the only difference is that the parameters of the two functions are defined differently.
                Because functions are also objects in JavaScript, we can see the following interesting example://Defining a global function (s) () {if (this = = window) {
            Console.log ("This is window."); }//function foo is also an object, so you can define Foo's property boo to a function Foo.boo = functions () {if (this = = = Foo
            ) {Console.log ("This is foo.");
            else if (this = = window) {Console.log ("This is window.");
        }
        };
        Equivalent to Window.foo ();  Foo ();
        
        This is window.  You can see the object Foo.boo () in the function that points to the calling function.
        
    This is foo.    Use apply to change the point foo.boo.apply (window) of this in the function;
        
 

This is window. Prototype we've used prototype to simulate classes and inheritance in the first chapter. Prototype is essentially a JavaScript object. 
And each function has a default prototype property. If this function is used in a scene that creates a custom object, we call this function a constructor.
        For example, here's a simple scenario://constructor function person (name) {this.name = name; //define person's prototype, the attribute in the prototype can be referenced by the custom object Person.prototype = {getname:function () {R
            Eturn this.name;
        The var Zhang = new person ("Zhangsan");   Console.log (Zhang.getname ()); "Zhangsan" as an analogy, we consider data types in JavaScript-strings, numbers, arrays (array), objects (object), dates (date), and so on.
            We have reason to believe that these types are implemented as constructors within JavaScript, such as://defining the constructor of an array, a predefined type function array () for JavaScript as a function of
        
        // ...
        }
        Initializes an instance of the array var arr1 = new Array (1, 56, 34, 12);
        
However, we prefer the following syntax definition: var arr2 = [1, 56, 34, 12]; Many of the methods used to manipulate arrays (such as concat, join, push) should alsois defined in the prototype property.
        In fact, all of the intrinsic data types of JavaScript have read-only prototype attributes (this is understandable: because if these types of prototype properties are modified, which predefined methods disappear), we can add our own extension methods to them.
            Extend a method to get the minimum value to the JavaScript intrinsic type Array Array.prototype.min = function () {var min = this[0];
                for (var i = 1; i < this.length i++) {if (This[i] < min) {min = this[i];
        } return min;
        
        };  Call the Min method on an instance of any array ([1, Console.log, 12].min ()); 
1 Note: Here is a trap to add an extension method to the array's prototype, and the extension method is also recycled when the for-in loop array is used.
        The following code illustrates this (assuming that the Min method has been extended to the array's prototype): var arr = [1, 56, 34, 12];
        var total = 0;
        for (var i in arr) {total = parseint (Arr[i], 10);   Console.log (total);
        NaN solution is also very simple: var arr = [1, 56, 34, 12];
        var total = 0; for (var i in arr) {if (Arr.hasownproperty (i)) {total = PARseint (Arr[i], 10);   } console.log (total); The constructor constructor always points to the constructor that creates the current object.
        For example, the following example://equivalent to var foo = new Array (1, 56, 34, 12);
        var arr = [1, 56, 34, 12]; Console.log (Arr.constructor = = Array);
        True//equivalent to var foo = new Function ();
        var Foo = function () {}; Console.log (Foo.constructor = = Function);
        True//The constructor instantiates an obj object var obj = new Foo (); Console.log (Obj.constructor = = = Foo); True//Combining the above two pieces of code, you get the following conclusion console.log (Obj.constructor.constructor = = Function); 
True but when constructor encounters prototype, interesting things happen. We know that each function has a default attribute prototype, and this prototype constructor the default point to this function.
        As shown in the following example: function person (name) {this.name = name;
        };
        Person.prototype.getName = function () {return this.name;
        };
        
        var p = new Person ("Zhangsan"); Console.log (P.constructor = = person); True Console.log (Person.prototype.constructor = = person); True//Merge the two lines of code to get the following result Console.log (P.constructor.prototype.constructor = = person);
            True when we redefine the prototype of a function (note: The difference between this and the previous example is not a modification but a overwrite), constructor's behavior is a bit odd, as follows: function person (name) {
        THIS.name = name;
        };
            Person.prototype = {Getname:function () {return this.name;
        }
        };
        var p = new Person ("Zhangsan");  Console.log (P.constructor = = person); False Console.log (Person.prototype.constructor = = person); False Console.log (P.constructor.prototype.constructor = = person); 
False for what.
                It turns out that overwriting person.prototype is equivalent to doing the following: Person.prototype = new Object ({getname:function () {
            return this.name;
        
}
        });
        and constructor always point to the constructor that created itself, so Person.prototype.constructor = = = Object At this point, that is:function person (name) {this.name = name;
        };
            Person.prototype = {Getname:function () {return this.name;
        }
        };
        var p = new Person ("Zhangsan");  Console.log (P.constructor = = = Object); True Console.log (Person.prototype.constructor = = = Object); True Console.log (P.constructor.prototype.constructor = = = Object); True how to fix this problem.
        The method is also simple, overwriting Person.prototype.constructor: function person (name) {this.name = name;
        };
            Person.prototype = new Object ({getname:function () {return this.name;
        }
        });
        Person.prototype.constructor = person;
        var p = new Person ("Zhangsan");  Console.log (P.constructor = = person); True Console.log (Person.prototype.constructor = = person); True Console.log (P.constructor.prototype.constructor = = person);
         True

JavaScript inheritance detailed JavaScript inheritance details (ii) JavaScript inheritance detailed (iii) JavaScript inheritance detailed (iv) JavaScript inheritance detailed (v) JavaScript inheritance explanation (vi)