如何向某人解释JavaScript关闭,知道它们所构成的概念(例如功能、变量等),但不了解关闭本身?
我已经在维基百科上看到了图表的例子,但不幸的是,它没有帮助。
如何向某人解释JavaScript关闭,知道它们所构成的概念(例如功能、变量等),但不了解关闭本身?
我已经在维基百科上看到了图表的例子,但不幸的是,它没有帮助。
当前回答
我相信更短的解释,所以看下面的图像。
此分類上一篇
函数 f1()..> 光红盒
函数 f2()..> 红小盒子
在这里,我们有两个功能,f1()和f2()。f2()是内部到f1()。f1()有一个变量, var x = 10.
在引用函数f1(),f2()可以访问 var x = 10 的值。
这里是代码:
function f1() {
var x=10;
function f2() {
console.log(x)
}
return f2
}
f1()
f1 ) 请求:
此分類上一篇
其他回答
這是一個試圖清除一些(可能的)關於關閉的誤解,在其他答案中出現。
关闭不只是在您返回内部函数时创建。 事实上,关闭函数不需要完全返回,以便其关闭创建。 您可以将内部函数归咎于外部范围中的变量,或者将其作为一个论点转移到另一个函数,在那里它可以立即或随后被召回。
最好的方法是不断地解释这些概念:
console.log(x);
// undefined
var x = 42;
console.log(x);
// 42
现在,JavaScript知道X是什么意思。
x = 43;
console.log(x);
// 43
现在,X意味着别的东西。
范围
当您创建一个函数时,该函数为变量具有自己的“盒子”。
function A() {
var x = 42;
}
console.log(x);
// undefined
var x = 42;
function A() {
console.log(x);
}
// 42
在函数 A 中,您有“范围访问”到 x。
function A() {
var x = 42;
}
function B() {
console.log(x);
}
// undefined
function A() {
var x = 42;
function B() {
console.log(x);
}
}
// 42
功能
在JavaScript中,您通过称之为:
function A() {
console.log(42);
}
A();
// 42
var a = function() {
console.log(42);
};
变量现在意味着一个功能,你可以运行它。
a();
// 42
setTimeout(a, 1000);
在一秒钟(1000毫秒),函数一个点被称为:
// 42
现在,当你定义函数时,这些函数可以访问它们的外部目标。
var a = function() {
var text = 'Hello!'
var b = function() {
console.log(text);
// inside function `b`, you have access to `text`
};
// but you want to run `b` later, rather than right away
setTimeout(b, 1000);
}
现在发生了什么?
// 'Hello!'
var c;
var a = function() {
var text = 'Hello!'
var b = function() {
console.log(text);
// inside function `b`, you have access to `text`
};
c = b;
}
// now we are out side of function `a`
// call `a` so the code inside `a` runs
a();
// now `c` has a value that is a function
// because what happened when `a` ran
// when you run `c`
c();
// 'Hello!'
您仍然可以在关闭范围内访问变量。
即使一个已经完成了运行,现在你正在运行C的外部。
在这里发生的事情被称为JavaScript中的“关闭”。
JavaScript 的关闭与 scopes 的概念有关。
在 es6 之前,没有区块级范围,只有 JS 的功能级范围。
也就是说,每当需要区块级范围时,我们都需要将其插入一个函数中。
看看这个简单而有趣的例子,关闭如何解决这个问题在ES5
// 让我们说我们只能使用一个传统的路径,而不是forEach为(var i = 0; i < 10; i++) { setTimeout(函数() { console.log('没有关闭访问指数 - '+ i) }) ) } // 这将打印10次“访问指数 - 10”,这是不正确的 /** 预计输出是访问指数 - 0 访问指数 - 1.. 访问指数 - 9 **/ // 我们可以通过使用 cl 解决它
注:这可以轻松地通过使用 es6 取代 var 来解决,因为它创造了语法范围。
简而言之,在 JS 中关闭仅仅是访问功能范围。
JavaScript 功能可以访问:
论点本地(即其本地变量和本地功能) 环境,其中包括:全球性,包括DOM在外部功能中的任何东西
请注意,外部功能不需要,尽管它们提供的好处我不在这里讨论。 通过访问其环境中的数据,一个关闭保持数据的生存. 在外部/内部功能的底部,外部功能可以创建本地数据,最终输出,但是,如果任何内部功能(s)在外部功能输出后生存,那么内部功能(s)保持外部功能的位置。
使用全球环境的封闭例子:
当用户点击 VoteUp 按钮时, voteUp_click 函数检查是否是VotedDown == 真实,以确定是否投票或仅仅取消投票。
var isVotedUp = false;
var isVotedDown = false;
function voteUp_click() {
if (isVotedUp)
return;
else if (isVotedDown)
SetDownVote(false);
else
SetUpVote(true);
}
function voteDown_click() {
if (isVotedDown)
return;
else if (isVotedUp)
SetUpVote(false);
else
SetDownVote(true);
}
function SetUpVote(status) {
isVotedUp = status;
// Do some CSS stuff to Vote-Up button
}
function SetDownVote(status) {
isVotedDown = status;
// Do some CSS stuff to Vote-Down button
}
对于一个六岁的...
你知道什么是物体吗?
物品是具有属性和物品的物品。
關閉的最重要的事情之一是,它們讓你在JavaScript中創建對象. 在JavaScript中的對象只是功能和關閉,讓JavaScript在創建後儲存對象的屬性價值。
物品非常有用,并保持一切顺利和有组织,不同物品可以做不同的工作,工作物品可以做复杂的事情。
幸运的是,JavaScript有创建对象的关闭,否则一切都会变成一个可怕的噩梦。