[英]Can anyone explain the difference between closure and anonymous functions?
I am relatively new to Javascript. 我是Javascript的新手。 I understand the concept of anonymous functions - but closures seem less clear. 我理解匿名函数的概念 - 但是闭包似乎不太清楚。 The similarity between the two (in my mind atleast), is confusing. 两者之间的相似性(至少在我看来)是令人困惑的。
Could someone explain the difference? 有人可以解释这个区别吗? (preferrably, with some code snippet, to illustrate the points clearer). (最好是使用一些代码片段来说明要点更清楚)。
The important difference is that a closure captures the scope it was defined in. 重要的区别是闭包捕获了它定义的范围。
In other words, a closure may access variables and their state even though they belong to the closure's parent scope (eg the function the closure was created in). 换句话说,闭包可以访问变量及其状态,即使它们属于闭包的父作用域(例如,闭包创建的函数)。 This allows closures to capture and "transport" application state around your program. 这允许闭包捕获并“传输”程序周围的应用程序状态。
An anonymous function cannot do that; 匿名函数不能这样做; its reach is limited to variables defined inside its body and signature (ie, its parameters). 它的范围仅限于在其体内和特征(即其参数)内定义的变量。
EDIT: Just to clarify: In JavaScript it is especially unclear since there is no language construct called closure. 编辑:只是为了澄清:在JavaScript中,特别不清楚,因为没有语言结构称为闭包。 You'd still use an anonymous function for that. 你仍然会使用匿名函数。 I was only referring to the conceptual difference. 我只是指概念上的差异。
Have you seen this article? 你看过这篇文章吗? http://www.jibbering.com/faq/faq_notes/closures.html http://www.jibbering.com/faq/faq_notes/closures.html
This could also be good as a starting point: http://www.javascriptkit.com/javatutors/closures.shtml 这也可以作为一个起点: http : //www.javascriptkit.com/javatutors/closures.shtml
I explained this here: The Zen of Closures . 我在这里解释了这一点: 闭包之禅 。
Basically, without going into technical details: 基本上,没有进入技术细节:
An anonymous function is one which does not have any name to it, rest is same as the normal functions in Javascript. 匿名函数是一个没有任何名称的函数,rest与Javascript中的普通函数相同。 Here is an ex. 这是一个前。 Case 1: This is just some normal/regular javascript function 案例1:这只是一些普通/常规的javascript函数
var sayHello = function iWillSayHello(name){
var fullName = "Hello, " + name;
console.log(fullName);
}
sayHello("ABC"); // prints---> Hello, ABC
Case 2: This is Annonymous function, It is the same function with the same behavior as above, 情况2:这是Annonymous函数,它具有与上述相同的行为,
var sayHello = function(name){
var fullName = "Hello, " + name;
console.log(fullName);
}
sayHello("ABC"); // prints---> Hello, ABC
Case 3: If(I think) by "anonymous function" you mean IIFE(Immediately Invoked Function Execution), that is this, 案例3:如果(我认为)通过“匿名函数”表示IIFE(立即调用函数执行),就是这样,
(function(name){
var fullName = "Hello, " + name;
console.log(fullName);
})(); // prints---> Hello, ABC
The difference here is, In "Case 1" and "Case 2" you have to call the function explicitly, BUT in "Case 3" it is invoked automatically (ie with "()" at the end you are calling it as it is declared). 这里的区别是,在“案例1”和“案例2”中你必须明确地调用函数,但是在“案例3”中它会被自动调用(即在你调用它时最后用“()”调用它,因为它是声明)。 It will be called as compiler reaches that line. 它将在编译器到达该行时调用。
Clouser, on the other hand, is a function inside a function . 另一方面,Clouser 是函数内部的函数 。 What makes a Clouser a special in js, is it still can access the values of the variable from the "local scope" of the outer function even if the outer function has returned. 什么使得Clouser在js中是一个特殊的,它仍然可以从外部函数的“局部范围”访问变量的值,即使外部函数已经返回。
Clouser = function + outer context Clouser =函数+外部上下文
here is a simple example, 这是一个简单的例子,
function outerSayHello(firstName){
var fullName = firstName;
function innerSayHello(lastName){
console.log("Hello, ", fullName + " " + lastName);
}
return innerSayHello;
}
console.log("1-------------------------");
var sayHello = outerSayHello("A");
sayHello("B");
//Hello, A B
console.log("2-------------------------");
var sayHello1 = outerSayHello("A1");
sayHello1("B1");
//Hello, A1 B1
console.log("3-------------------------");
sayHello("b");
//Hello, A b
console.log("4-------------------------");
sayHello1("b1");
//Hello, A1 b1
console.log("5-------------------------");
outerSayHello("ABC")("XYZ");
//Hello, ABC XYZ
to better understand these let's console the sayHello variable
console.log("6-------------------------",sayHello);
/*
innerSayHello(lastName){
console.log("Hello, ", fullName + " " + lastName);
}
*/
What it means is sayHello variable has pointer/reference to the innerSayHello function. 这意味着sayHello变量具有指向innerSayHello函数的指针/引用。 And because innerSayHello is relying on fullName variable, it will still be maintained on the heap, and fullName and innerSayHello still be on the stack even after outerSayHello returns. 因为innerSayHello依赖于fullName变量,它仍然会在堆上维护,即使在outerSayHello返回后,fullName和innerSayHello仍然在堆栈中。 So in the heap, it will create multiple references for fullname and innerSayHello. 所以在堆中,它将为fullname和innerSayHello创建多个引用。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.