call和apply

最新推荐文章于 2025-07-01 10:42:28 发布

原创最新推荐文章于 2025-07-01 10:42:28 发布 · 3.3k 阅读

14 ·

本内容遵循CC 4.0 BY-SA版权协议

标签

#javascript

本文详细介绍了JavaScript中call和apply方法的区别与用法。call方法和apply方法主要区别在于传递参数的方式，call方法允许逐个传递参数，而apply方法则通过数组传递参数。它们都能改变函数内部this的指向，常用于函数绑定和参数灵活传递的场景。在处理数组参数时，apply更方便。示例代码展示了如何使用call和apply调用函数并改变this上下文。

1、call方法和apply方法非常像，它们的区别只有唯一的一点；

2、call方法下面有几个参数：

· 第一个参数是改变函数里面的this的指向：因为例子中直接调用getName的话，this指向的是person，所以返回的是person的name；

而通过call方法间接调用的时候，就可以指定this的值，如果将this指向了window，返回的是window.name，结果是‘xm’;

	var name='xm';
    var person={};
    person.name='xh';
    person.getName=function(){
      return this.name;
    };
    console.log(person.getName());  //直接调用
    console.log(person.getName.call(window));

在这里插入图片描述
3、如果用apply，在第一个参数上，apply和call是完全一样的；也就是只传第一个参数，不传后面的参数的话，它们两的作用是完全一样的；

	var name='xm';
    var person={};
    person.name='xh';
    person.getName=function(){
      return this.name;
    };
    console.log(person.getName());  //直接调用
    console.log(person.getName.call(window));
    console.log(person.getName.apply(window));

在这里插入图片描述 4、call和apply的区别只在后面的参数：

· call的第一个参数是改变this的值；因为例子中没有用到this，所以改不改都行，比如写个window；

· 接下来的参数是：传递在函数中的参数；call传参数的方式是一个一个的传，比如1,2,3；

· 而apply接下来传的参数是是和call不同的，这也是它们唯一的不同；apply不是一个一个的传递参数，它是通过一个数组来传的；

· 也就是apply一般来说只有两个参数，第一个this的指向，第二个数组；

	function add(num1,num2){
      return num1+num2;
    }
   
    console.log(add(1,2));
    console.log(add.call(window,1,2));
    console.log(add.apply(window,[1,2]));

在这里插入图片描述
5、call和apply的用法：

· 比如，例子中的add如果想调用，就必须得一个一个的传参，可如果从别的地方得到了参数，它不是一个字符串形式的，而是一个数组形式的，比如var datas=[1,2];

· 这个时候，apply就发挥用处了，直接将datas传进去就行，它就会自动的对应到函数里；

    function add(num1,num2){
      return num1+num2;
    }
   
    console.log(add(1,2));
    var datas=[1,2];
    console.log(add.apply(window,datas));

在这里插入图片描述