考虑以下代码
<body ng-app="myApp">
<h1>Hello {{name}}</h1>
<h2>reverse of your name is {{ name | reverse }}</h2>
<input type="text" ng-model="name">
<script src='https://ajax.googleapis.com/ajax/libs/angularjs/1.2.3/angular.js'></script>
<script>
angular.module('myApp', [])
.filter('reverse', function(){
return function(str){
return str.split('').reverse().join('');
}
});
</script>
</body>
这里感兴趣的是 reverse 过滤器。这是我认为它正在做的事情:
- 用两个参数调用
angular.filter()。arg1: string &arg2: function(准确地说是匿名或无名函数) - arg2 函数不接受参数，而是在其中嵌套了另一个匿名函数。
- 这个嵌套的匿名函数确实接受单个参数——这个过滤器将应用的文本或字符串。
- 这个嵌套的匿名函数获取字符串，将其反转。
Q1。我的理解正确吗？
Q2。有什么区别: 普通版:
angular.filter('reverse', function(str){
return str.split('').reverse().join('');
});
嵌套版本:
angular.filter('reverse', function(str){
return function(str){
return str.split('').reverse().join('');
}
});
Q3。为什么多一层函数嵌套有用，什么情况下会直接返回值。或者返回一个函数，然后返回实际结果？
Q4。这如何影响范围？闭包在这里有什么作用吗？
JSFiddle:http://jsfiddle.net/C7EDv/
最佳答案
(Q1.1) 右 - 两个参数，一个带有过滤器名称的字符串和...
(Q2/3) filter (arg2) 的第二个参数是构造函数(或“工厂”)函数。它仅在创建过滤器时执行一次。
构造函数必须返回一个函数。当使用与其关联的过滤器时，将执行返回的函数。换句话说，返回的函数是注入(inject)(使用 $injector)到过滤器(http://docs.angularjs.org/api/ng.$filterProvider)中的函数
我在下面添加了详细说明的评论:
angular.filter('reverse', function(service){
// This is run only once- upon creation
return function(str){
// This is run every time the filter is called
return str.split('').reverse().join('');
}
});
(Q3) 您将始终使用这种形式(“嵌套形式”)，否则您会得到一个错误(Object ... has no method 'apply')，因为 Angular 需要返回一个函数，只要使用过滤器，它就可以调用(使用 apply())。这与 Angular 中的所有提供者(包括服务)完全一样。
(Q2) 如果可以执行您所谓的“正常版本”，那么过滤器在创建时将只运行一次。它得到的任何返回值都将用于过滤器的每次调用。由于拥有一个始终返回相同值的过滤器通常不会很有用，因此 Angular 改为使用此 javascript 构造函数模式(您将在 JS 的其他地方看到它)，以便每次使用过滤器都会导致对关联的新调用功能。
(Q1.4)是的，返回的函数确实反转了字符串。这是关于此过滤器的 2 分钟精彩视频:http://www.thinkster.io/pick/EnA7rkqH82/angularjs-filters
(Q1.2/3) 如果您的过滤器使用任何服务，您将在我上面使用 service 的地方传递它们(上面的链接有一个例子)。如您所述，参数 str 是过滤器的输入。
(Q4)“运行一次”区域确实创建了一个闭包 - 因此您可以像使用任何其他闭包一样使用它。
关于javascript - AngularJs 和 Javascript 嵌套函数及其调用，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/20254146/