为什么在此示例中放弃 'this' 是有益的

Question

我试图通过在线视频课程来掌握 Javascript 的概念，我在下面看到了这个例子。 https://www.youtube.com/watch?v=9oi0NY8Pen8

老师先用了这个例子

var carlike = function(obj, loc) {
  obj.loc = loc;
  obj.move = function() {
    this.loc++;
  };
  return obj;
};

var amy = carlike({}, 1);
amy.move();

然后把carlike函数改成

var carlike = function(obj, loc) {
  obj.loc = loc;
  obj.move = function() {
    obj.loc++;
  };
  return obj;
};

说 Instead of referring to the parameter this which gets bound to a new value each time move is invoked we can use obj

this 如何绑定到新值。使用 obj 如何防止这种情况。

Answer 1

当您调用 amy.move() 时，在 move 中，"variable" this 获取 amy 的值，这是一个对象。如果 move 包含代码 this.loc++，则属性 amy.loc 的值将递增。

但是，您可以通过其他方式调用该函数。例如：

var func = amy.move; // copies reference to function into variable func
func();              // "this" is unspecified

上面的例子，因为this没有指定，所以默认为window（非严格模式）或者undefined（严格模式）。

或者：

var bill = { loc: 4 };
amy.move.call(bill); // "this" is bill, not amy

另一方面，如果 move 函数包含代码 obj.loc++，那么它将始终递增同一对象的 loc：即传递给carlike move 实例创建时间：

var amy = carlike({}, 1);
var bill = { loc: 4 };
amy.move.call(bill); // "this" is bill, not amy
console.log(amy.loc); // prints 2
console.log(bill.loc); // prints 4

move 函数在创建时成为 carlike.

中局部变量 obj 的 closure

在这个小例子中，这样做并没有什么特别的好处，但闭包通常是一种强大的技术。

Answer 2

因为 javascript 中的 this 是在函数调用时决定的。在方法内部使用它会导致不需要的错误。如果您使用 amy.move().

自己调用该函数，您可能不会意识到这一点

例如：

var carlike = function(obj, loc) {
  obj.loc = loc;
  obj.move = function() {
    console.log(this);
    this.loc++;
  };
  return obj;
};

var amy = carlike({}, 1);
amy.move(); => this will corresponds to object which are returned from constructor.

setTimeout(amy.move, 1000) => this will corresponds to window

由于构造函数正在返回对象，因此在函数内部使用 obj 是安全的 amy。

参考：this in javascript

Answer 3

当您调用 move 函数时：

amy.move();

然后您将 move 中的 this 的值设置为 amy。如果你这样做：

var b = amy.move;
b();

你现在调用的函数没有设置this，所以它在非严格模式下默认为global/window对象，在严格模式下是未定义的。通过使用：

  obj.loc = loc;
  obj.move = function() {
    obj.loc++;
  };

然后函数通过闭包保持对 obj 的引用，所以无论函数如何调用，obj 总是引用对象最初传递给 carlike.

为什么在此示例中放弃 'this' 是有益的

Why is it beneficial to ditch 'this' in this example

javascript

this