javascript - 尝试理解js中的Function.prototype.call

Question

<script>
var animals = [
  {species: 'Lion', name: 'King'},
  {species: 'Whale', name: 'Fail'}
];

for (var i = 0; i < animals.length; i++) {
  (function (i) { 
    this.print = function () { 
      console.log('#' + i  + ' ' + this.species + ': ' + this.name); 
    } 
    this.print();
  }).call(animals[i], i);
}

</script>

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/call?redirectlocale=en-US&redirectslug=JavaScript%2FReference%2FGlobal_Objects%2FFunction%2Fcall

问题:

1.为什么要这样写:this.print、this.species、this.name？我尝试删除“this”，并在控制台日志中显示“未定义”

2.call(animals[i], i)它和call(this, i)有什么区别？

Answer 1

以相反的顺序回答您的问题...

(function()).call(...) 设置函数执行的上下文。即它将 this 对象设置为第一个参数。在您的示例中，第一个版本将 this 设置为 Animals[] 数组中的元素。第二个将把上下文设置为 this 的内容 - 这里它将是全局上下文。

设置上下文后，您的代码可以使用 this 关键字引用它。在你的第一个问题中，this指的是当前的animals[]元素，因此它可以提取每个动物的物种、名称等。省略 this 关键字指的是全局范围内 undefined variable 。