Question

来自this example的以下代码：

<!DOCTYPE html>
<html>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<body>

<div ng-app="myApp" ng-controller="personCtrl">

First Name: <input type="text" ng-model="firstName"><br>
Last Name: <input type="text" ng-model="lastName"><br>
<br>
Full Name: {{fullName()}}

</div>

<script>
var app = angular.module('myApp', []);
app.controller('personCtrl', function($scope) {
    $scope.firstName = "John";
    $scope.lastName = "Doe";
    $scope.fullName = function() {
        return $scope.firstName + " " + $scope.lastName;
    };
});
</script>

</body>
</html>

如何将$scope.fullName设置为使用$scope但尚未明确传递的函数？

即。原因如下：

$scope.fullName = function() {

而不是

$scope.fullName = function($scope) {

Answer 1

简答： 因为 fullName（）函数关闭了它的父级作用域，即控制器函数。

答案很长： JavaScript具有函数级范围，这意味着每个函数都创建自己的范围。范围基本上是函数可以访问的变量和函数。当你在父函数中有子函数时，子函数有它自己的作用域，但也可以访问它的父函数的作用域。这称为闭包 - 子函数在父作用域上有闭包。函数不仅可以访问它的父级范围，而且它是祖父母的范围，并且一直向上移动范围链。子函数在其父级范围内具有闭包，但不是相反。

重要的是要注意，注入角度控制器的$ scope变量与JavaScript中的范围不同。我知道这会让很多通过Angular学习JavaScript的人感到困惑。由于$ scope变量存在于控制器函数的作用域中，因此任何子函数都可以访问它。变量名称为$ scope的事实不会改变实际情况。

我真的很喜欢这个，我建议你阅读JavaScript中的范围和闭包。

$ scope对象在方法中使用而不传递

1 个答案: