首页 > 其他分享> 文章详细

js基础之call、apply

2022-08-21 16:01:05 阅读：202 来源： 互联网

标签：function ... context js call key apply

call与apply的异同

相同点：1、都可以用来修改函数内部的this指向

　　　　2、都会立即执行函数

不同点：

1、传参方式不同

　　第一个参数都是传递需要指向的obj，之后的传递参数的方式不相同，apply是把剩下的参数通过数组的形式传递，call剩下的参数传递个数不固定，一个一个的传递。

应用场景:

　　call可以用来判断数据类型，如：Object.prototype.toString.call([]) // 返回值[object Array]

　　apply可以用来求数组的最值，如：const arr = [3,4,6,1,4,50]; Math.max.apply(this, arr);同样用call也可以实现，只不过传参不一样。

手动实现call和apply：

Function.prototype.myCall = function (context) {
  if (typeof this !== 'function') {
    throw new Error('Not a function')
  }
  //
  context = Object(context)
  const key = Symbol(); // 这里为了方便就使用Symbol保证唯一性，当然也可以使用其他的方式，如自己再写个生成uuid的方式获取唯一值。
  const args = [...arguments].slice(1); // [...arguments]这一步是把类数组arguments变为真正的数组，使其具有slice方法，从而获取参数。
  context[key] = this; // 这里的this就是代表要执行的方法。
  context[key](...args);

  delete context[key]; 
}

Function.prototype.myApply = function (context, rest) {
  if (typeof this !== 'function') {
    throw new Error('Not a function')
  }
  //
  context = Object(context)
  const key = Symbol();
  context[key] = this;
  context[key](...rest);

  delete context[key];
}

　　解析：

　　　　上面执行执行 context[key](...args)和 context[key](...rest)之所以能改变this的指向是因为把对应的执行方法先挂载在context上，然后通过context来执行，因为普通函数内部this的指向的是其直接调用者。明白这个道理就自己实现起来就简单了。

标签：function,...,context,js,call,key,apply
来源： https://www.cnblogs.com/brucefq/p/16610132.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

js基础之call、apply