如何在JavaScript中查看函数返回值

在浏览器中，对于对象，属性有其getter和setter。我们可以覆盖它们以查看属性。函数的返回值是多少？ 在AngularJS中，使用“ng show”控制组件的可见性。它可以这样写：

<ANY ng-show="aFunction()"> ... </ANY>

---

如果在运行时，“tmp”更改为true，则将显示。AngularJS如何知道返回值已更改？是否有超时功能来定期检查更改？

没有超时功能。有一个特定于AngularJS的概念，称为“消化循环”。
您可以从文档中了解有关的更多信息。
我还发现对于介绍这种机制非常有用。
最后，我相信这里有很多相关的答案

---

通常，您应该尝试准确地了解函数

$apply（）

，

$digest（）

，

$watch（）

的作用

没有魔法或超时，Angular理解某些内容（包括函数返回值）发生更改的方式是在每次运行摘要循环时执行脏检查。为了理解它是如何工作的，让我们看一下您的示例，看看Angular为您所做的步骤，以及如何告诉Angular某些东西发生了变化

步骤1：创建手表

如果我们查看

ngShowDirective

的源代码，我们将看到以下内容

var ngShowDirective = ['$animate', function($animate) {
  return function(scope, element, attr) {
    scope.$watch(attr.ngShow, function ngShowWatchAction(value){ // <= create watch
      $animate[toBoolean(value) ? 'removeClass' : 'addClass'](element, 'ng-hide');
    });
  };
}];

步骤3：运行所有监视，并在监视发生变化时呼叫回调

Scope.prototype = {
  ...
  $digest: function() {
    ...
    if ((value = watch.get(current)) !== (last = watch.last) &&
                    !(watch.eq
                        ? equals(value, last)
                        : (typeof value == 'number' && typeof last == 'number'
                           && isNaN(value) && isNaN(last)))) {
      ...
      watch.fn(value, ((last === initWatchVal) ? value : last), current); // <= run watch callback function in case watch value has been changed
      ...
    }
    ...
  }
}

除了调用

$apply（）

调用

$digest（）

，建议将

$apply（）

与回调函数一起使用。这样，Angular将知道在范围更改过程中是否出现错误，并在出现任何错误时处理错误

希望这有助于理解Angular对范围变化的了解程度

观察角度以外的函数返回值

如果要利用Angular的功能在Angular的应用程序代码之外观察函数返回值，可以执行以下操作：

获取应用程序的顶级元素

获取Angular的

$rootScope

使用

$Watch（）

示例：

var valueToBeChanged = 0,
    rootElement = document.querySelector('[ng-app]'),
    rootScope = angular.element(rootElement).scope();

function myFunc() {
  return valueToBeChanged;
}

function myCallback() {
  console.log('Value have been changed!');
}

rootScope.$watch(myFunc, myCallback);

angular.element(document.querySelector('body')).on('click', function() {
  rootScope.$apply(function() {
    valueToBeChanged++;
  });
});

---

普朗克：

谢谢你，这很有帮助~:D

Scope.prototype = {
  ...
  $digest: function() {
    ...
    if ((value = watch.get(current)) !== (last = watch.last) &&
                    !(watch.eq
                        ? equals(value, last)
                        : (typeof value == 'number' && typeof last == 'number'
                           && isNaN(value) && isNaN(last)))) {
      ...
      watch.fn(value, ((last === initWatchVal) ? value : last), current); // <= run watch callback function in case watch value has been changed
      ...
    }
    ...
  }
}

angular.module('demo').directive('clickable', function() {
  return {
    link: function(scope, element) {
      element.bind('click', function() {
        scope.$apply(function() { // <= call scope.$apply() in order to tell Angular that something is changed in the scope
          scope.foo++;
        });
      });
    }
  }
});

var valueToBeChanged = 0,
    rootElement = document.querySelector('[ng-app]'),
    rootScope = angular.element(rootElement).scope();

function myFunc() {
  return valueToBeChanged;
}

function myCallback() {
  console.log('Value have been changed!');
}

rootScope.$watch(myFunc, myCallback);

angular.element(document.querySelector('body')).on('click', function() {
  rootScope.$apply(function() {
    valueToBeChanged++;
  });
});