jquery - 为什么有些代码会执行而有些则不会？

Question

我有以下功能：

   scroll: function()
 { 
 console.log( "scrolling..." ); 
 this.blockPlacementEnabled = false
 setTimeout(function() 
  {
   console.log("hello");
   this.blockPlacementEnabled = true 
  }, 200);

 },

该函数运行完美且没有错误，但是一旦它到达

this.blockPlacementEnabled = true

该行拒绝运行，而是代码继续，好像我没有调用该行为什么某些函数运行而其他函数不会延迟？

Answer 1

在setTimeout回调内部，this指的是window，而不是它在 中引用的对象scroll。这意味着blockPlacementEnabled永远不会true在您的对象中设置为。

保留对对象的引用：

scroll: function() { 
  console.log( "scrolling..." ); 
  this.blockPlacementEnabled = false;

  var self = this; // reference to the current object
  setTimeout(function() {
    console.log("hello");
    self.blockPlacementEnabled = true; // referencing the current object
  }, 200);
},

或使用.bind ^[MDN]。

了解更多关于this.

Answer 2

您已将该行放在 a 中setTimeout，这是异步的。代码将继续以正常的控制流程（从上到下）执行，并在 200 毫秒后this.blockPlacementEnabled = true执行。

同样正如一些评论者指出的那样，this指的是 中的窗口setTimeout，因此您需要保留对此的引用并在设置的超时函数中使用它：

scroll: function()
{ 
     var that = this;
     console.log( "scrolling..." ); 
     that.blockPlacementEnabled = false; //<HERE

     setTimeout(function() 
     {
       console.log("hello");
       that.blockPlacementEnabled = true; //<HERE
     }, 200);
},