javascript中的setTimeout和angularjs中的$timeout服务之间的区别答案

【问题标题】：difference between setTimeout in javascript and $timeout service in angularjsjavascript中的setTimeout和angularjs中的$timeout服务之间的区别
【发布时间】：2017-01-11 16:01:07
【问题描述】：

我是角度框架的新手。这是我的场景，我想在一段时间后更改我的 $scope.variable，所以我使用了 javascript setTimeout 方法。

$scope.variable = 'Previous';

setTimeout(function(){
  $scope.variable='NEXT';
},3000);

此代码对我不起作用。我使用$apply() 使这段代码工作。

后来我才知道 Angular 本身有一个 $timeout 服务，它可以做同样的工作。

$scope.variable = 'Previous';

$timeout(function () {
  $scope.variable = 'NEXT';
}, 2000);

如何比较 $timeout 服务与 javascript setTimeout 的性能？？

为什么我们应该使用$timeout 而不是setTimeout??

请给我一些例子和使用它的理由，它显示了性能。

谢谢:)

【问题讨论】：

性能完全取决于当前应用程序内摘要循环的性能。 $timeout 将导致摘要。对于具有大量观察者的应用程序，$rootScope.$digest() 使应用程序冻结，它将再次冻结。就这么简单。

标签： javascript angularjs settimeout angular-services

【解决方案1】：

在某些情况下需要执行某种超时操作，我们经常使用 JavaScript 的 setTimeout() 函数来实现这一点。

但是，如果我们在 AngularJS 应用程序中使用 setTimeout()，我们还需要使用 $scope.$apply() 以确保对 scope 的任何更改都将反映在其他地方（即数据绑定在 view 中）。

AngularJS 为此提供了一个方便的包装器：$timeout() - 它执行$apply()，我们不必为$apply 进行更改。

关于性能。

如果您使用$timeout 创建本质上是一个间隔，那么不要使用它。如果您的应用程序很大，那么$apply 也会触发一个$digest 循环，您可能并不希望它发生，它肯定会降低性能。

【讨论】：

【解决方案2】：

任何从外部（包括 ajax）处理的 AngularJS 范围变量都需要一个 $apply()。

$timeout() 负责当前作用域，并在所有更改检测完成后以相同的摘要周期运行。

我最近发现的 $timeout() 的一个优点是，如果你不传递 time 参数，它会等待 DOM 完成。

所以，

$timeout(function(){
  console.log("show after directive partial loaded")
}); //note, no time parameter

在指令中运行此代码，一旦指令加载了部分，就会触发超时回调函数

希望这会有所帮助。

【讨论】：

此外，您可以将 false 作为第二个参数传递给 $timeout，它不会调用 $apply。当你想手动控制 $digest 时很有用
答案在细节上含糊不清，可能包含不正确的信息。关于指令用法的声明牵强附会，并没有真正解释它与 setTimeout+$scope.$apply 有何不同。 $timeout(() => {... }, ...) 与setTimeout(() => $scope.$apply(..), ...) 基本相同，只是前者可以与$timeout.flush() 同步测试（另外，它可以选择跳过摘要）。