Difference between variable declaration syntaxes in Javascript (including global variables)? - Stack Overflow

admin管理员组

文章数量:1129036

Is there any difference between declaring a variable:

var a=0; //1

...this way:

a=0; //2

...or:

window.a=0; //3

in global scope?

Is there any difference between declaring a variable:

var a=0; //1

...this way:

a=0; //2

...or:

window.a=0; //3

in global scope?

• javascript

Share Improve this question Follow edited Nov 7, 2016 at 11:49 Steve Chambers 39.3k2929 gold badges174174 silver badges220220 bronze badges asked Feb 1, 2011 at 11:53 DanDan 57.8k4343 gold badges122122 silver badges162162 bronze badges 7

• 2 AFAIK var a = 0; does not work in IE when accessing the variable via another external js file which is declared in another js file – Aivan Monceller Commented Feb 1, 2011 at 11:56
• I donot know about window.a but the other 2 ways are the same in global scope. – programmer Commented Feb 1, 2011 at 11:56
• 1 @AivanMonceller really? link please. – Raynos Commented Feb 1, 2011 at 11:58
• @Raynos, I experience it on my own website. IE6 to be specific. I could not get my var enum to appear which is on an external js file and i am referencing it as an inline javascript on an html file – Aivan Monceller Commented Feb 1, 2011 at 12:00
• @Ashwini In the global scope, window is the global object (in browsers). var a = 1; console.log(a); console.log(win – leebriggs Commented Feb 1, 2011 at 12:08

 |  Show 2 more comments

5 Answers 5

Sorted by: Reset to default 581

Yes, there are a couple of differences, though in practical terms they're not usually big ones (except for your #2 — a = 0; — which A)  I strongly recommend not doing, and B) is an error in strict mode).

There's a fourth way, and as of ES2015 (ES6) there's two more. I've added the fourth way at the end, but inserted the ES2015 ways after #1 (you'll see why), so we have:

var a = 0;                             // 1
let a = 0;                             // 1.1 (new with ES2015)
const a = 0;                           // 1.2 (new with ES2015)
a = 0;                                 // 2
window.a = 0; /*or*/ globalThis.a = 0; // 3
this.a = 0;                            // 4

Those statements explained

1. var a = 0;

This creates a global variable which is also a property of the global object, which we access as window on browsers (or via the globalThis global added in ES2020, or via this at global scope). Unlike some other properties, the property cannot be removed via delete.

In specification terms, it creates an identifier binding on the Object Environment Record for the global environment. That makes it a property of the global object because the global object is where identifier bindings for the global environment's Object Environment Record are held. This is why the property is non-deletable: It's not just a simple property, it's an identifier binding, and identifiers can't be removed.

The binding (variable) is defined before the first line of code runs (see "When var happens" below).

The property this creates is enumerable (except on the very obsolete IE8 and earlier).

---

1.1 let a = 0;

This creates a global variable which is not a property of the global object. This is a new thing as of ES2015.

In specification terms, it creates an identifier binding on the Declarative Environment Record for the global environment rather than the Object Environment Record. The global environment is unique in having a split Environment Record, one for all the old stuff that goes on the global object (the Object Environment Record) and another for all the new stuff (let, const, and the functions created by class) that don't go on the global object, but go in the global environment's Declarative Environment Record instead.

The binding is created before any step-by-step code in its enclosing block is executed (in this case, before any global code runs), but it's not accessible in any way until the step-by-step execution reaches the let statement. Once execution reaches the let statement, the variable is accessible. (See "When let and const happen" below.) The time between the binding being created (on entry to the scope) and becoming accessible (code execution reaching the let) is called the Temporal Dead Zone [TMZ]. While the binding is in that state, any attempt to read from it or write to it is a runtime error.

(The specification's terminology for whether the binding is accessible is whether it's "initialized," but don't confuse that use of "initialized" with having an initializer on the let statement [let a = 10; vs. just let a;]; they're unrelated. The variable defined by let a; is initialized with undefined once the let is reached.)

---

1.2 const a = 0;

Creates a global constant, which is not a property of the global object.

A const binding is exactly like a let binding (including the TMZ and such) except it has a flag saying its value cannot be changed. One implication of that is you must provide an initializer (the = value part) to provide the initial (and never-changing) value for the const.

Using const does three things for you:

1. Makes it a runtime error if you try to assign to the constant (and most IDEs will flag it up for you more proactively than that).
2. Documents its unchanging nature for other programmers.
3. Lets the JavaScript engine optimize on the basis that the const's value won't change (without having to track whether it's written to later or not — e.g., doesn't have to check if it's effectively constant).

It's important to understand that the const's value never changing doesn't mean that an object the const refers to is immutable. It isn't. It just means that the value of the const can't be changed so it refers to a different object (or contains a primitive):

// This is fine:
const x1 = {a: 1};
console.log(x1.a); // 1
x1.a = 2;
//^^^^^^−−− No problem, just changing the object's state, not the value in the `const` (the object reference)
console.log(x1.a); // 2

// This is not:
const x2 = {a: 1};
console.log(x2.a); // 1
x2 = {a: 2};
// ^−−−−−−− Error here ("TypeError: Assignment to constant variable"),
// you can't change the value of a `const`
console.log(x2.a);

---

2 a = 0;

Don't do this.

本文标签： Difference between variable declaration syntaxes in Javascript (including global variables)Stack Overflow