Question

有人可以解释一下为什么JS输出是“1 2 1 3”而不是“1 2 3”？

我使用过JS模块。

我只是想知道调用模块的原因是两次，并且代码恰好在哪里？

代码：

(function() {
  var foo = function(arg) { // core constructor
    // ensure to use the `new` operator

    console.log("1");
    if (!(this instanceof foo))
    {
      console.log("2");
      return new foo(arg);
    }

    // store an argument for this example
    console.log("3");
    this.myArg = arg;
    //..
  };

  // create `fn` alias to `prototype` property
  foo.fn = foo.prototype = {

    init: function () {/*...*/
    }
    //...
  };

  // expose the library
  console.log("4");
  window.foo = foo;
  console.log("5");
})();

// Extension:

foo.fn.myPlugin = function () {
  console.log(this.myArg);
  return this; // return `this` for chainability
};
console.log("7");
foo("bar").myPlugin(); // alerts "bar"

Answer 1

有人可以解释一下为什么JS输出是“1 2 1 3”而不是“1 2 3”？

因为这次致电foo：

foo("bar").myPlugin();

...在不使用foo的情况下调用new，因此this instanceof foo之前的console.log("2")为假（因为this是全局对象或{ {1}}，取决于您使用的是松散模式还是严格模式），因此该函数通过undefined调用自身并返回结果而不是直接运行其余代码。（这是一种模式，用于使用和不使用new的函数，并获得结果，就像使用new一样;在这种情况下，new确保其余代码[在第二个调用中]正在使用foo引用由this支持的对象[已被别名为foo.prototype]。）

......代码究竟在哪里发生？

第一个电话是我上面引用的电话，它非常靠近问题代码的底部。第二个位于靠近顶部的foo.fn内：

foo

return new foo(arg);这样做：

创建一个新对象。
将新对象的原型设置为new foo引用的对象。
使用foo.prototype引用新对象来致电foo。

Javascript输出模块说明

1 个答案: