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]。

Learn more about this

Answer 2

你已将该行放在setTimeout中，这是异步的。代码将继续在正常控制流程中执行（从上到下），在200 ms后，将执行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);
},

为什么有些代码会执行而其他代码却不会被执行？

2 个答案: