Channels ▼

Christopher Diggins

Dr. Dobb's Bloggers

Why is there a "let" statement in JavaScript 1.7?

July 26, 2008

I was looking at the JavaScript 1.7 specification recently and it wasn't immediately obvious to me what the purpose of the new let statement was for. I'll give you a hint: it's related to closures.  

I am not by any means a JavaScript expert. I've only done some small JavaScript hacking over the years (including a little Cat interpreter online). I almost like the language. Recently though I was wondering though what special purpose the "let" statement in JavaScript 1.7 served.

The documentation at wasn't immediately obvious to me on a superficial reading. Here is what the documentation said:

let statements, expressions and definitions sometimes make the code cleaner when inner functions are used.

var list = document.getElementById("list"); <br />for (var i = 1; i <= 5; i++) {   <br />  var item = document.createElement("LI");   <br />  item.appendChild(document.createTextNode("Item " + i));   <br />  let j = i;   <br />  item.onclick = function (ev) {     <br />    alert("Item " + j + " is clicked.");   <br />  };   <br />  list.appendChild(item); <br />} 

The example above works as intended because the five instances of the (anonymous) inner function refer to five different instances of variable j. Note that it does not work as intended if you replace let by var or if you remove the variable j and simply use the variable i in the inner function.

Once you do the suggested mental exercise it should become obvious that when you replace "j" with "i" in the onclick function, every element in the list will trigger an alert with the text "Item 5 is clicked" when clicked. This is because each function would be bound to the same "i" variable, which eventually gets assigned the value 5.

It shouldn't take too much for an intermediate to advanced programmer to understand the problem that the introduction of the "let" statement solves, I am not so sure that adding it as a langauge feature is a good idea. It really hurts the simplicity and elegance of the language (and thus its appeal to beginners), just to provide some modern conveniences to advanced users.

The general problem with adding language features to make certain programming problems have simpler solutions, is that it isn't obvious to newcomers what problems a given language feature is in fact solving.

Related Reading

More Insights

Currently we allow the following HTML tags in comments:

Single tags


<br> Defines a single line break

<hr> Defines a horizontal line

Matching tags


<a> Defines an anchor

<b> Defines bold text

<big> Defines big text

<blockquote> Defines a long quotation

<caption> Defines a table caption

<cite> Defines a citation

<code> Defines computer code text

<em> Defines emphasized text

<fieldset> Defines a border around elements in a form

<h1> This is heading 1

<h2> This is heading 2

<h3> This is heading 3

<h4> This is heading 4

<h5> This is heading 5

<h6> This is heading 6

<i> Defines italic text

<p> Defines a paragraph

<pre> Defines preformatted text

<q> Defines a short quotation

<samp> Defines sample computer code text

<small> Defines small text

<span> Defines a section in a document

<s> Defines strikethrough text

<strike> Defines strikethrough text

<strong> Defines strong text

<sub> Defines subscripted text

<sup> Defines superscripted text

<u> Defines underlined text

