javascript - Javascript-“let”关键字 VS “var”关键字

  显示原文与译文双语对照的内容

在 javascript 1.7中,添加了 let 关键字。 我听说它被描述为一个"本地"变量,但我仍然不确定它的行为与 var 关键字有什么不同。

两者之间的区别是什么? let 什么时候应用于 var

时间:

不同的是作用域。var 为范围为与其最接近的function block (or global if outside a function block) 和 let 作用范围是到最近的封闭 ( 或者全局如果在任何块外) 块,可以是小于函数块中。

另外,就好象用 letvar,声明的变量是可见之前声明它们 在他们封闭块,如下在图中显示。

演示:jsFiddle ( 仅 Firefox )

全局:

在函数块外使用时它们是相同的。


let me = 'go';//globally scoped
var i = 'able';//globally scoped

函数:

它们在函数块中使用时完全相同。


function ingWithinEstablishedParameters() {
 let terOfRecommendation = 'awesome worker!';//function block scoped
 var sityCheerleading = 'go!';//function block scoped
};

块:

这里有区别。let 只在 for() 循环中可见,var 对整个函数可见。


function allyIlliterate() {
//tuce is *not* visible out here

 for( let tuce = 0; tuce <5; tuce++ ) {
//tuce is only visible in here (and in the for() parentheses)
 };

//tuce is *not* visible out here
};

function byE40() {
//nish *is* visible out here

 for( var nish = 0; nish <5; nish++ ) {
//nish is visible to the whole function
 };

//nish *is* visible out here
};

另外( 已经废弃):

let 也可以用来创建它自己的封闭块。


function conjunctionJunctionWhatsYour() {
//sNotGetCrazy is *not* visible out here

 let( sNotGetCrazy = 'now' ) {
//sNotGetCrazy is only visible in here
 };

//sNotGetCrazy is *not* visible out here
};

一些examples,这里有个 . let 关键字的解释

让我们非常像 var 。 主要区别是变量变量的作用域是整个封闭函数

这里表格在维基百科上显示哪些浏览器支持 Javascript 1.7.

请注意,只有Mozilla浏览器支持它。 IE,Safari,Chrome,等等。

有一些微妙的差异 -- let 范围更像是在任何其他语言中的变量作用域。

e.g 。它作用于封闭块,它们在声明之前不存在,等等。

但是值得注意的是,let 也是一个Mozilla扩展,而不是任何标准( ECMAScript是标准,JavaScript是Mozilla实现,历史有点复杂,但它是如何运行的)的一部分,所以 let 只能在 Firefox 和其他基于的应用程序中使用。

现在你几乎不应该使用 let,因为你通常不能指望它完全支持它。

我知道这不是你想要的答案,但它可能是最重要的考虑因素。 如果你有一个有限的部署,你知道每个人都得到 1.7,那么你就是一个幸运的人。

下面是一个有趣的例子,可以添加到其他人已经编写的内容上。 假设你想创建一个函数数组 adderFunctions,其中每个函数都接受一个数字参数,并返回数组中参数和函数的索引。 通过使用 var 关键字会导致problems,试图生成 adderFunctions 带有 loop:


var size = 1000;
var adderFunctions = new Array(size);
var result;

for (var i = 0; i <size; i++) {
 var value = i;
 adderFunctions[i] = function(x) {
 return x + value;
 };
}

result = adderFunctions[12](8);

console.log(result === 20);//=> false
console.log(result === 1007);//=> true
console.log(value);//=> 999

上面的过程不生成所需的函数数组,因为 value 范围超出了 for 块。 现在,使用 Harmony ( ECMAScript 6 ) 规范和 let 关键字来尝试:


const size = 1000;
let adderFunctions = new Array(size);
let result;

for (let i = 0; i <size; i++) {
 let value = i;
 adderFunctions[i] = x => x + value;
}

result = adderFunctions[12](8);

console.log(result === 20);//=> true
console.log(value);//=> ReferenceError: value is not defined

这次,value 范围被限制在 for 块中,adderFunctions 在每个索引处包含所需的函数。

下面是两个( Chrome的支持刚开始) 之间的兼容性示例: enter image description here

就像你看到的var j 变量仍然在循环范围之外有一个值,但是 let i 变量在循环范围之外未定义。

...