call-apply 实现继承

2019-03-01  本文已影响0人  Christoles

改变调用对象的两种方式:

JS可以通过 call 和 apply 方法来实现继承

  • call()
     ------ 语法: obj1.skill.call(obj2,arg1,arg2,...)
    * obj2:表示你要将this重新指向到的新对象;
    * arg1,arg2,...:表示当做skill的参数传入。
  • apply()
     ------ 语法: obj1.skill.apply(obj2,arr);将obj1的this指向obj2这个对象。
    * obj2:表示你要将this重新指向到的新对象
    * arr:表示数组或者类数组,数组里面的元素当做是skill的参数传入。

*** \color{red}{call 和 apply 的区别:第二个参数不一样!一个是数 一个是数组} ***


1. call()改变Math.this的指向

var arr=[3,8,1,18];
console.log(Math.max(arr));//NaN  --- 不能直接弹出数组中最大的数
var res = Math.max.apply(null,arr);//参数不能跳过传入,没有对象也要设置null才不会报错***
console.log(res);//18

2. apply()改变this的指向

var obj1={
    name:"bgg",
    skill:function(age,num){//传参
        console.log("你的名字:"+this.name+"\n年龄是:"+age);
    }
}
var obj2={
    name:"帅哥"
}
//调用:
obj1.skill.apply(obj1);//你的名字:bgg
obj1.skill.apply(obj2);//你的名字:帅哥  --- 改变this指向obj2!

obj1.skill.apply(obj2,[18]);//你的名字:帅哥  年龄是:18  --- 改变指向并传参
//注意:实参18必须加上中括号[],否则会报错 ***            
            /**
             * JS可以通过 call 和  apply 方法来实现继承

3.用call 测试对函数适用性

//测试对函数适用性
//顺便实现了一个继承
function Animal(name){
    console.log(this);
    this.name = name;//第一个this.name是属性,第二个name是值
    this.skill = function(){
    console.log(this.name);//打印出这个属性的值
    }
}
function Cat(name){
    // --- 构造函数里面的this是在实例化对象的时候才决定指向谁***
    Animal.call(this,name);//坑点 只能是this***  不能是Cat   意思是将对象指向 Cat
}

var test = new Cat("小猫");//实例化对象
var test = new Cat("小狗");//实例化对象
var test = new Cat("小熊");//实例化对象
test.skill();//小熊
上一篇下一篇

猜你喜欢

热点阅读