js中的call和apply函数解析:

本文详细解析了JavaScript中this指向的原理及如何使用call和apply函数改变其指向。通过具体实例,展示了构造函数与普通函数中this的指向区别,以及如何利用call和apply实现this指向的动态调整。

call和apply函数可以改变对象调用函数中this的指向。
call函数: 第一个参数值指向改变的那个对象,从第二个参数起,是调用函数中的实际参数,顺序和个数是一一对应的。
apply函数: 第一个参数值指向改变的那个对象,从第二个是数组,是调用函数中的实际参数,顺序和个数是一一对应的。
function Person(name, age) {
      this.name = name;
      this.age = age;
      this.sing = function() {
            console.log(this);
      }
}
var obj = new Person(‘小红’, 6);
var obj1 = new Person(‘小明’, 8);
obj.sing(); //Person {name: “小红”, age: 6, sing: ƒ}
在构造函数中,this指向的是当前实例对象,调用obj.sing();this指向的就是obj
obj.sing.call(obj1); //Person {name: “小明”, age: 8, sing: ƒ}
call()函数可以改变对象调用函数中this的指向,call()中传的参数是obj1,此时call()函数已经将obj的指向改变成了obj1。

function add(a, b) {
      console.log(this);
      console.log(a + b);
}
add(1, 2); //Window 3
在普通函数中,this指向的是window,所以调用add(),在控制台打印this输出的是window。
add.call(obj, 1, 2);//Person {name: “小红”, age: 6, sing: ƒ} 3
call()函数改变了this的指向,使this由原来的window变成了指向obj,后面的两个参数1和2是传到add()中的实参,最后计算的结果是3。
add.apply(obj,[1,2]);//Person {name: “小红”, age: 6, sing: ƒ} 3
apply()函数改变了this的指向,使this由原来的window变成了指向obj,后面的两个参数1和2是传到add()中的实参,最后计算的结果是3。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值