Implementation of inheritance in JavaScript, Call,apply,prototype, constructors

JavaScript inheritance can be implemented by call, apply, Protoperty 1.call Meaning of call:Foo.call (Thisobject, args ...) When the function foo is called, the context switches to thisobject, meaning that the Foo method is called with Thisobject, and if no thisobject is specified, the external global object is used as the default Thisobject

functionfoo () {if(! This. s_name) {//avoid being re-assigned by this property         This. S_name = "Inside foo"; } console.info ( This. s_name);}functionBar () {if(! This. S_name) {         This. S_name = "Inside Bar"; }}varp =Newbar (); Foo.call (p);//The foo function is called, because call is used, its context switches to the this in the P,foo function to point to Poutput:inside Foo

use call to implement inheritance:

/** * Created by Administrator on 2016/12/4 0004.*/functionPerson () { This. s_name = "Person" This. S_age =undefined;  This. S_gender =undefined;  This. F_say =function(TXT) {console.info ("%s say:%s", This. S_name, TXT)}}//Person Testvarp =NewPerson ();p. F_say (' Hello ');//Normal invocation of the person object//Man inherits all the attributes and methods in personfunctionMan () {Person.call ( This, This. arguments);//It is understood here that the This execution man,this.f_say=function () {} in the person () function call process is actually performed for man, and can be thought to have added several properties and methods to man     This. S_name = "man";//Note that if this sentence is placed in the first line, it will be re-assigned by This.s_name = "person" in the person's constructor     This. F_playgame =function() {Console.info ("Man like Play Game"); }}//Mans TestvarP_man =NewMan ();p _man.f_say ("Hello");//Man inherits the F_say member method in person

  2.apply, In addition to the parameters, exactly like call, here's the introduction meaning of apply: foo.apply (bar, Tuple_arg)When calling the Foo function, the internal refers to the bar, This example is better than the previous call example .；

//Applyfunctionfoo (arg1, arg2) { This. s_name = "Foo";  This. F_func =function(Arg1, arg2) {Console.info ( This. S_name + "+ arg1 +" "+ arg2);//the ARG here will be based on the scope chain and the prototype chain synthesis lookup    }}functionBar () { This. S_name = "Bar";}varf =NewFoo ("Foo_arg1", "FOO_ARG2");varb =Newbar (); f.f_func.apply (b, ["Apply_arg1", "apply_arg2"]);//call the F_func method in object F of type Foo, but the this.s_name is actually the bar type Object B.Output:bar apply_arg1 apply_arg2

The example of inheritance does not write, as with call, the person.apply (this, []) is called in The Man () method, so that this.* = * in person () is executed once, this is actually a man () 3. JS Prototype (prototype) implementation of inheritance, the specific principle is a little bit more complex, you can query other information

function Person () {    this. s_name = ' person ';       This function () {        console.info (this. s_name)    }}function man () {     this. s_name = ' man 'new person ()varNew Man ();p. F_say (); Output:man

4. ConstructorsThis method and call and apply in fact a meaning, but through a different way to ensure that the parent function execution, the inside of this is its own  

functionPerson () { This. s_name = "Person";  This. F_say =function() {Console.info ( This. S_name); }}functionMan () { This. Parent_method =Person ;  This. Parent_method ( This. arguments);//execute when the person function, inside this is actually a man     This. S_name = "man";//if placed on the first line, it is overwritten by the execution of person ()}varp =NewMan (); P.f_say (); Output:man

   

Implementation of inheritance in JavaScript, Call,apply,prototype, constructors