js继承

js继承有5种实现方式：

• 继承第一种方式：对象冒充

 1 function Parent(username){ 

 2    this.username = username; 

 3    this.hello = function(){ 

 4        document.write(this.username);

 5    } 

 6 } 

 7 function Child(username,password){ 

 8    //通过以下3行实现将Parent的属性和方法追加到Child中，从而实现继承 

 9    //第一步：this.method是作为一个临时的属性，并且指向Parent所指向的对象， 

10    //第二步：执行this.method方法，即执行Parent所指向的对象函数 

11    //第三步：销毁this.method属性，即此时Child就已经拥有了Parent的所有属性和方法 

12    this.method = Parent; 

13    this.method(username);//最关键的一行 

14    delete this.method; 

15 

16    this.password = password; 

17    this.world = function(){ 

18        document.write(this.password);

19    } 

20 } 

21 var parent = new Parent("zhangsan"); 

22 var child = new Child("lisi","123456"); 

23 parent.hello(); 

24 child.hello(); 

25 child.world(); 

• 继承第二种方式：call()方法方式      

        call方法是Function类中的方法
        call方法的第一个参数的值赋值给类(即方法)中出现的this
        call方法的第二个参数开始依次赋值给类(即方法)所接受的参数

 1 function test(str){ 

 2    document.write(this.name + " " + str);

 3 } 

 4 var object = new Object(); 

 5 object.name = "zhangsan"; 

 6 test.call(object,"langsin");//此时，第一个参数值object传递给了test类(即方法)中出现的this，而第二个参数"langsin"则赋值给了test类(即方法)的str 

 7 

 8 function Parent(username){ 

 9    this.username = username; 

10       this.hello = function(){ 

11          document.write(this.username);

12       } 

13    } 

14 function Child(username,password){ 

15    Parent.call(this,username);    

16       this.password = password; 

17          this.world = function(){ 

18             document.write(this.password);

19          } 

20       } 

21     var parent = new Parent("zhangsan"); 

22     var child = new Child("lisi","123456"); 

23     parent.hello(); 

24     child.hello(); 

25     child.world(); 

• 继承的第三种方式：apply()方法方式 

        apply方法接受2个参数:
            A、第一个参数与call方法的第一个参数一样，即赋值给类(即方法)中出现的this
            B、第二个参数为数组类型，这个数组中的每个元素依次赋值给类(即方法)所接受的参数

 1 function Parent(username){ 

 2    this.username = username; 

 3    this.hello = function(){ 

 4       document.write(this.username);

 5    } 

 6 } 

 7 function Child(username,password){ 

 8    Parent.apply(this,new Array(username));   

 9    this.password = password; 

10    this.world = function(){ 

11       document.write(this.password);

12    } 

13 } 

14 var parent = new Parent("zhangsan"); 

15 var child = new Child("lisi","123456"); 

16 parent.hello(); 

17 child.hello(); 

18 child.world(); 

• 继承的第四种方式：原型链方式，即子类通过prototype将所有在父类中通过prototype追加的属性和方法都追加到Child，从而实现了继承

 1 function Person(){ 

 2 } 

 3 Person.prototype.hello = "hello"; 

 4 Person.prototype.sayHello = function(){ 

 5    document.write(this.hello);

 6 } 

 7   

 8 function Child(){ 

 9    } 

10 //这行的作用是：将Parent中将所有通过prototype追加的属性和方法都追加到Child，从而实现了继承 

11 Child.prototype = new Person();

12 Child.prototype.world = "world"; 

13 Child.prototype.sayWorld = function(){ 

14    document.write(this.world);

15 }   

16 var c = new Child(); 

17 c.sayHello(); 

18 c.sayWorld(); 

• 继承的第五种方式：混合方式 ，混合了call方式、原型链方式 

 1 function Parent(hello){ 

 2    this.hello = hello; 

 3 } 

 4 Parent.prototype.sayHello = function(){ 

 5    document.write(this.world);

 6 } 

 7 function Child(hello,world){ 

 8    Parent.call(this,hello);//将父类的属性继承过来 

 9    this.world = world;//新增一些属性 

10 } 

11 //将父类的方法继承过来

12 Child.prototype = new Parent(); 

13 //新增一些方法 

14 Child.prototype.sayWorld = function(){

15    document.write(this.world);

16 } 

17 var c = new Child("zhangsan","lisi"); 

18 c.sayHello(); 

19 c.sayWorld();