1

Now that we can write ES6 and deploy it to browsers (using Traceur or 6to5 to support legacy user agents), is there any reason why we wouldn't use let or const as our default keywords for variable declaration?

Is var dead? And if it is, can I configure my linting tools to reject it?

Jimmy Breck-McKye
  • 2,923
  • 1
  • 22
  • 32
  • 1
    compatibility with old engines? – thefourtheye May 13 '15 at 09:39
  • There is a prior discussion of this exact topic here on StackOverflow, but I can't seem to find it at the moment. – jfriend00 May 13 '15 at 09:53
  • @thefourtheye - are there any deficiencies in transpilers like 6to5 with these keywords? Surely they should just swap const and let our for 'var'? – Jimmy Breck-McKye May 13 '15 at 09:53
  • @JimmyBreck-McKye As `let` is scoped, the transpilers might create a function I guess. I am not very sure though. – thefourtheye May 13 '15 at 09:56
  • 1
    A transpiler would have to create a function scope for each block scope in which `let` was used because that's the only way to simulate block scope in pre-ES6. That likely means lots of IIFEs in the generated code. I'm not sure what that means for run-time efficiency and cleanliness of debugging. – jfriend00 May 13 '15 at 10:01

3 Answers3

2

As es5 only has function scope for variables, presumably your transpiler is creating closures in order to mock the let keyword's functionality. That may have an effect on the resulting size of your code if you're declaring variables inside scopes that are not functions (e.g. loops, ifs etc). So that is one reason not to, currently. It may also make debugging slightly more confusing, although this could be mitigated using sourcemaps.

There aren't really any other drawbacks. Variable hoisting is pretty confusing to people coming from other languages, and using let allows you to avoid this potential hiccup. So I would use it now if you can.

liamness
  • 742
  • 3
  • 5
1

At times, let doesn't allow the named function hoisting pattern. It does in Chrome 51, but does not in Safari 9.1.1. Thus,

let foo = func;

function func () {
    return true;
}

would throw an error. Whereas the following style is valid:

var foo = func;

function func () {
    return true;
}

Depending on your purposes, this could make your code more or less readable. For example, an exposing module pattern which has a lot of initialization code, so doesn't return immediately.

var foo = (function () {
    let factory = {
        func: func
    };

    init();
    // do more init stuff

    return factory;

    function func () {
        //
    }
}());

Using function declarations to hide implementation details, for example.

Rahman Malik
  • 543
  • 6
  • 10
0

It depends on your environment :

  • If you're writing server-side JavaScript code (Node.js), you can safely use the let statement.

  • If you're writing client-side JavaScript code and use a transpiler like Traceur, you can can safely use the let statement, however your code is likely to be anything but optimal with respect to performance.

  • If you're writing client-side JavaScript code and don't use a transpiler, you need to consider browser support.

    Today, Feb 23 2016, these are some browsers that either don't support let or have only partial support :

    • Internet explorer 10 and below (no support)
    • Firefox 43 and below (no support)
    • Safari 9 and below (no support)
    • Opera Mini 8 and below (no support)
    • Android browser 4 and below (no support)
    • Opera 36 and below (partial support)
    • Chome 51 and below (partial support)

For an up-to-date overview of which browsers support the let statement at the time of your reading this answer, see this Can I Use page.

John Slegers
  • 45,213
  • 22
  • 199
  • 169