[ES6] ES6 新特性之声明变量

ES5	ES6
用 var 关键字声明变量	用 let 关键字声明变量
全局作用域	全局作用域
函数作用域	块级作用域

ES5 中

用 var 关键字声明变量

var v = 100; // 在全局作用域中
function fn() {
    // 在函数作用域中 - 只能在当前函数作用域中访问
    var w = 10;

    console.log(v); // 100

    console.log(w); // 10
}

console.log(v) //100

fn();
console.log(w); // w is not defined

注意：在 ES5 中没有块级作用域

if (true) {
    var v = 100; // 全局作用域
}
console.log(v); // 100

ES6 中

用 let 关键字声明变量

if (true) {
    // 块级作用域 - 定义的变量只能在当前块级作用域中被访问
    let v =100; 
}
console.log(v); // v is not defined

let 与 var 的区别

let	var
全局作用域、函数作用域和块级作用域	全局作用域、函数作用域
不允许声明提前	声明提前
不允许重复声明	允许重复声明

作用域

全局作用域

var m = 100; // 全局变量 - 在全局作用域中定义
let n = 1000; // 全局变量- 在全局作用域中定义

console.log("var"+m); // var100
console.log("let"+n); // let1000

函数作用域

function fn() {
    // 在函数作用域中定义
    var j = 100;
    let k = 1000;

    console.log("var" + j); // var100
    console.log("let" + k); // let1000
}

fn();
console.log("var" + j); // j is not defined
console.log("let" + k); // k is not defined

块级作用域

if (true) {
    // 在块级作用域定义
    var j = 100;
    let k = 1000;

    console.log("内部var" + j); // 内部var100
    console.log("内部let" + k); // 内部let1000
}
console.log("外部var" + j); // 外部var100
console.log("外部let" + k); // k is not defined

声明提前

概念看代码

var 关键字定义变量-存在声明提前的现象

console.log(m); // undefind
var m = 10;

等同于

var m; // 只声明变量，并不初始化-默认值为undefined
console.log(m); // undefind
m = 10;  // 初始化变量 - 赋值

let 关键字定义变量时-不存在声明提前

console.log(v); // v is not defind
let v = 10; 

暂时性死区

ECMAScript 6 标准明确规定，如果在一个代码块中使用 let或 const 声明变量或常量时，当前代码块中对这些声明的变量或常量形成了一个封闭的作用域。

就是 let 或 const 没有声明提前给的一个名词

重复声明

var 允许重复声明

var v = 100;
console.log(v); // 100
var v = 1000; // 重复声明
console.log(v); // 1000

let 不允许重复声明

let v = 100;
console.log(v); // 100
let v = 1000; // 重复声明 - SyntaxError: Identifier 'v' has already been declared
console.log(v); // 

let 虽然不允许重复声明，但是允许重复赋值

let v = 100;
console.log(v); // 100
 v = 1000; // 重复赋值
console.log(v); // 1000