未加星标

Let Love Rule: Using let in JavaScript

字体大小 | |
[前端(javascript) 所属分类 前端(javascript) | 发布者 店小二05 | 时间 2016 | 作者 红领巾 ] 0人收藏点击收藏

For a long time, var filled a lot of roles injavascript: at the start of many older scripts, most everything appeared to be a variable. ES2015 introduced a true constant in the form of const , but also added a replacement for var called let . So what is let , and why should you use it instead of var ?

A Problem of Scope

I’ve previously written aboutscope, and how variables are either global, or limited to the scope of the function they are written inside. let is more granular: it is scoped to the nearest enclosing block .

What does block scope mean for variables? If a variable declared inside a block of code that is surrounded by curly braces , it is valid only within that block , and the variable if referred to as having block scope . This is not the case in JavaScript outside offunctions; for example, a variable set inside a for loop can “leak”. outside of its context.

for (var i = 0; i < 9; i++) { // do something } console.log(i);

In the above code, i will still be a registered variable after the for loop is complete: theconsole will report a value for the variable. While this might be useful in some cases, it’s more likely to pollute the global namespace, causing problems as your code becomes more complex.

Using let

In contrast, let is only understood inside it’s particular context :

for (let i = 0; i < 9; i++) { // do something } console.log(i);

i will be reported as undefined in the console, although it works perfectly well when it is used in the context of the for loop.

The same scope restrictions are in place for let within any set of curly code braces in JavaScript:

if (condition == true) { let x = 3; … }

In the case above, x will be understood only between the opening and closing curly braces.

It should be noted that const is also block-scoped. And, of course, let defined outside a block scope can be referenced within the inner scope, so long as that scope is contained inside the block:

let orbit = 4; if (resonance = 3) { orbit++; }

Similarly, let defined at the very start of a script will be global.

Conclusion and Browser Support

let is valid in any context that var is, and functions as a replacement in ES6 (or, at least, is a close cousin). While var still has some uses, let should be used in its place in manyu cases in modern JavaScript development: it’s safer and more direct way of using variables, saying “use this variable here, and only here ”..

The one issue is browser support: as a recent addition to the JavaScript spec, let only supported in recent browsers: IE 11 (and Edge, of course) in desktop and mobile, Firefox 44+, Chrome 41+, Android 52, and (most recently) in Safari 10 (desktop and mobile). For that reasons, JavaScript code that uses let is often compiled back to ES5 compatibility (and thus broader browser support) for production using an application like Babel , at least in current development practices.

Photograph by Trey Ratcliff , used under a Creative Commons license

Enjoy this piece? I invite you to follow me at twitter.com/dudleystorey to learn more.

本文前端(javascript)相关术语:javascript是什么意思 javascript下载 javascript权威指南 javascript基础教程 javascript 正则表达式 javascript设计模式 javascript高级程序设计 精通javascript javascript教程

主题: JavaScriptJavaAndroidChromeFirefox
分页:12
转载请注明
本文标题:Let Love Rule: Using let in JavaScript
本站链接:http://www.codesec.net/view/481277.html
分享请点击:


1.凡CodeSecTeam转载的文章,均出自其它媒体或其他官网介绍,目的在于传递更多的信息,并不代表本站赞同其观点和其真实性负责;
2.转载的文章仅代表原创作者观点,与本站无关。其原创性以及文中陈述文字和内容未经本站证实,本站对该文以及其中全部或者部分内容、文字的真实性、完整性、及时性,不作出任何保证或承若;
3.如本站转载稿涉及版权等问题,请作者及时联系本站,我们会及时处理。
登录后可拥有收藏文章、关注作者等权限...
技术大类 技术大类 | 前端(javascript) | 评论(0) | 阅读(29)