MDN Function.prototype.apply()的一个例子

时间:2017-10-14 07:50:00

标签: javascript

以下示例请参阅MDN:



Function.prototype.construct = function(aArgs) {
  console.warn('Function construct')
  var oNew = Object.create(this.prototype);
  this.apply(oNew, aArgs);
  return oNew;
};

function MyConstructor() {
  console.warn('MyConstructor')
  for (var nProp = 0; nProp < arguments.length; nProp++) {
    this["property" + nProp] = arguments[nProp];
  }
}

var myArray = [4, "Hello world!", false];
var myInstance = MyConstructor.construct(myArray);
&#13;
&#13;
&#13;

结果是:

Function construct  
MyConstructor

为什么this.apply(oNew, aArgs);调用MyConstructor ()

感谢您的回答

3 个答案:

答案 0 :(得分:1)

  

为什么this.apply(oNew, aArgs);调用MyConstructor ()

MyConstructor.construct()调用this.apply(oNew, aArgs);的函数体内的.construct调用,该Function.prototype被设置为MyConstructor的属性

  

为什么MyConstructor输出而不调用.construct

Function.prototype定义在MyConstructor.construct是一个函数,它继承MyConstructor.construct()定义的.constructFunction.prototype调用MyConstructor函数,其中.prototype具有相同的Function.prototype.construct = function (aArgs) { console.warn('Function construct') var oNew = Object.create(this.prototype); this.apply(oNew, aArgs); return oNew; }; function MyConstructor () { console.warn('MyConstructor') for (var nProp = 0; nProp < arguments.length; nProp++) { this["property" + nProp] = arguments[nProp]; } } console.log(MyConstructor.construct === Function.prototype.construct); // var myArray = [4, "Hello world!", false]; // var myInstance = MyConstructor.construct(myArray);

&#13;
&#13;
{{1}}
&#13;
&#13;
&#13;

答案 1 :(得分:1)

  

为什么this.apply(oNew, aArgs);调用MyConstructor ()

让我们一步一步走:

  • 当解释器到达MyConstructor.construct(myArray);时,它会尝试在对象construct上找到属性MyConstructor。口译员找不到它。然后它通过其原型链(内部[[Prototype]]属性),即对象Function.prototype向前迈出一步。它有它!查找过程停止并开始解释construct函数。这种查找属性的方式称为prototype inheritance

  • 在这种情况下(并非总是如此),this函数内的construct引用MyConstructor对象(请记住所有函数都是对象)。因此this.prototype是对象Function.prototype

  • Object.create()获取一个对象并使用给定对象作为其直接父原型对象创建一个新对象。因此oNew是一个普通对象,其原型与this相同。

  • this.apply(oNew, aArgs);这里记得this MyConstructor。因此,此语句调用MyConstructor函数并将oNew作为其thisaArgs作为其参数。

  • 调用MyConstructor时,this引用oNew,其arguments是包含aArgs的数组。

第二个例子:

[].push.apply(args, arguments);是什么?我们走了:))

  • []创建一个空数组文字(也是一个对象)。
  • 由于[]本身没有任何属性,[].push通过其原型链在其父级上引用push对象(记住函数是对象)。 / LI>
  • [].push.apply调用该函数并将args作为其thisarguments作为其参数。

您可以代替[].push.apply()使用Array.prototype.push.apply()。那些push个对象引用同一个对象。

答案 2 :(得分:0)

在方法上调用apply会更改其执行上下文。因此,this关键字将引用oNew而不是构造函数。有关详情,请参阅此帖子:https://www.bennadel.com/blog/2265-changing-the-execution-context-of-javascript-functions-using-call-and-apply.htm