apply 与 call 介绍

function f1(x, y) {    console.log("结果是：" + (x + y) + this);}f1(10, 20); //函数的调用// 结果是：30[object Window]// 此时的 f1 实际上是当作对象来使用的，对象可以调用方法f1.apply();  // 结果是：NaN[object Window]f1.call();   // 结果是：NaN[object Window]f1.apply(null);  // 结果是：NaN[object Window]f1.call(null);  // 结果是：NaN[object Window]
  • apply 和 call 方法中如果没有传入参数，或者传入的是null，那么调用该方法的函数对象中的 this 就是默认的 window
  • apply 和 call 都可以让函数或者方法来调用，传入参数和函数自己调用的写法不一样，但是效果是一样的。
f1.call(null,10,20);  // 结果是：30[object Window]f1.apply(null,[10,20]);  // 结果是：30[object Window]
  • 基本使用
function f2(x, y ){    console.log("结果："+(x+y)+"  "+ this.age );}window.f2(10, 20);  //结果：30  undefined// obj是一个对象var obj = {    age: 10,    sex: "男"};window.f2.apply(obj,[10, 20]);  //结果：30  10window.f2.call(obj,10,20);  //结果：30  10console.dir(obj);  // age: 10 sex: "男"

apply与call的作用：改变this的指向

apply 和 call可以改变 this 的指向

例子1：用于方法

function Person(age, sex){    this.age = age;    this.sex = sex;}//通过原型添加方法Person.prototype.sayHi=function(){    console.log("您好呀："+this.sex);}var per = new Person(10,"男");per.sayHi(); // 您好呀：男function Student(name, sex){    this.name = name;    this.sex = sex;}var stu=new Student("小明", "女");per.sayHi.apply(stu); // 您好呀：女per.sayHi.call(stu);  // 您好呀：女// stu 没有 sayHi()，但是通过apply或call可以让它调用per的sayHi().

例子2：用于函数

function f(x, y){    console.log("结果是："+(x+y)+"  "+this);    return "此时的this是"+this;}// apply和call调用var r1=f.apply(null,[1,2]); // 此时f中的this是windowconsole.log(r1);//结果是：3  [object Window]// 此时的this是[object Window]var r2=f.call(null,1,2); // 此时f中的this是windowconsole.log(r2); //结果是：3  [object Window]// 此时的this是[object Window]// 改变this的指向var obj={    sex: "男"}// 本来f函数是window对象的，但是传入obj之后，f函数就是obj对象的var r3=f.apply(obj,[1,2]); // 此时f中的this是objconsole.log(r3);// 结果是：3  [object Object]// 此时的this是[object Object]var r4=f.call(obj,1,2); // 此时f中的this是objconsole.log(r4);// 结果是：3  [object Object]// 此时的this是[object Object]

apply和call的使用方法总结

apply的使用方法：

函数名字.apply(对象，[参数1，参数2，...]);方法名字.apply(对象，[参数1，参数2，...]);

call的使用方法：

函数名字.call(对象，参数1，参数2，...);方法名字.call(对象，参数1，参数2，...);

apply与call的不同：

  • 参数传递的方式是不一样的

使用场景

只要是想使用别的对象的方法，并且希望这个方法是当前对象的，那么就可以使用apply或者是call的方法改变this的指向。
  • apply和call方法实际上并不在函数这个实例对象中，而是在Function的prototye中。