call为什么能改变作用域?2018-05-19

由于最近都在面试,所以没时间看webpack源码,但是加入了强迫自己优秀的组织,所以文章还是要写的,就讲最近一次面试把我问懵逼的内容吧。


面试官:“call函数的作用是什么?”
我:(窃喜,这不是送分题吗?)“改变函数调用时的作用域。”
面试官:“好的,那call是怎么改变作用域的呢?或者说,call是通过什么办法改变函数的作用域?”
我:(???)“。。。。”


现在我们来看看如何实现一个call。
首先来看看老生常谈的问题,call的作用是什么?

var cat = {
  name: 'cat scope'
}
var dog = {
  name: 'dog scope',
  showScope: function() {
     console.log(this.name)
  }
}
dog.call(cat);
// cat scope

就是改变作用域呗,好的这段话没有什么营养,所以我们来看看重点,call能改变作用域的奇技淫巧是什么?

Function.prototype.calls = function() {
  var tar = arguments[0] || window;
  tar.fn = this;
  tar.fn();
  delete tar.fn;
}

是的,就是这么粗暴,将原来要执行的函数,在你想要运行的对象里头进行复制,再执行就ok了。
其实call如何改变作用域到这里就完了,剩下的就是对传入的参数进行处理,这里简单的写一波。

Function.prototype.calls = function() {
  var tar = arguments[0] || window;
  var params = [];
  tar.fn = this;
  for(var i = 1, len = arguments.length; i < len; i++) {
    params.push('arguments[' + i + ']');
  }
  var ret = eval('tar.fn(' + params + ')');
  delete tar.fn;
  return ret;
}

这里的核心就是利用了数组转字符串的特性,将params数组与tar.fn拼接成了参数并执行。


希望你有所收获,杀青!

你可能感兴趣的:(call为什么能改变作用域?2018-05-19)