es6语法入门let 和 const 命令

let块级作用域
1 {
2   let a = 10;
3   var b = 1;
4 }
5
6 a // ReferenceError: a is not defined.
7 b // 1

for循环的计数器,就很合适使用let命令(防止i泄露为全局变量)

1 for (let i = 0; i < 10; i++) {
2   // ...
3 }
4
5 console.log(i);
6 // ReferenceError: i is not defined
下面的代码如果使用var,最后输出的是10
1 var a = [];
2 for (var i = 0; i < 10; i++) {
3   a[i] = function () {
4     console.log(i);
5   };
6 }
7 a[6](); // 10

如果使用let,声明的变量仅在块级作用域内有效,最后输出的是6。

1 var a = [];
2 for (let i = 0; i < 10; i++) {
3   a[i] = function () {
4     console.log(i);
5   };
6 }
7 a[6](); // 6

如果是es5也想输出6的话,必须使用闭包

1 var a = [];
2 for (var i = 0; i < 10; i++) {
3   (function(i){
4     a[i]=function(){
5       console.log(i)
6     }
7   })(i)
8 }
9 a[6](); // 10
for循环还有一个特别之处,就是设置循环变量的那部分是一个父作用域,而循环体内部是一个单独的子作用域
1 for (let i = 0; i < 3; i++) {
2   let i = ‘abc‘;
3   console.log(i);
4 }
5 // abc
6 // abc
7 // abc
1 // var 的情况
2 console.log(foo); // 输出undefined
3 var foo = 2;
4
5 // let 的情况
6 console.log(bar); // 报错ReferenceError
7 let bar = 2;


不存在变量提升,如上图

1 var tmp = 123;
2
3 if (true) {
4   tmp = ‘abc‘; // ReferenceError
5   let tmp;
6 }

存在全局变量tmp,但是块级作用域内let又声明了一个局部变量tmp,导致后者绑定这个块级作用域,所以在let声明变量前,对tmp赋值会报错

 1 if (true) {
 2   // TDZ开始
 3   tmp = ‘abc‘; // ReferenceError
 4   console.log(tmp); // ReferenceError
 5
 6   let tmp; // TDZ结束
 7   console.log(tmp); // undefined
 8
 9   tmp = 123;
10   console.log(tmp); // 123
11 }
1 typeof x; // ReferenceError
2 let x;

如果一个变量没有声明,使用typeof不会报错

1 typeof undeclared_variable // "undefined"
1 function bar(x = y, y = 2) {
2   return [x, y];
3 }
4
5 bar(); // 报错
1 function bar(x = 2, y = x) {
2   return [x, y];
3 }
4 bar(); // [2, 2]
// 不报错
var x = x;

// 报错
let x = x;
// ReferenceError: x is not defined

LET不允许相同作用域重复声明

 1 // 报错
 2 function () {
 3   let a = 10;
 4   var a = 1;
 5 }
 6
 7 // 报错
 8 function () {
 9   let a = 10;
10   let a = 1;
11 }
1 function func(arg) {
2   let arg; // 报错
3 }
4
5 function func(arg) {
6   {
7     let arg; // 不报错
8   }
9 }

内层变量可能覆盖外层变量

 1 var tmp = new Date();
 2
 3 function f() {
 4   console.log(tmp);
 5   if (false) {
 6     var tmp = ‘hello world‘;
 7   }
 8 }
 9
10 f(); // undefined
 1 // 浏览器的 ES6 环境
 2 function f() { console.log(‘I am outside!‘); }
 3
 4 (function () {
 5   if (false) {
 6     // 重复声明一次函数f
 7     function f() { console.log(‘I am inside!‘); }
 8   }
 9
10   f();
11 }());
12 // Uncaught TypeError: f is not a function

等价于

 1 // 浏览器的 ES6 环境
 2 function f() { console.log(‘I am outside!‘); }
 3 (function () {
 4   var f = undefined;
 5   if (false) {
 6     function f() { console.log(‘I am inside!‘); }
 7   }
 8
 9   f();
10 }());
11 // Uncaught TypeError: f is not a function

CONST

1 const foo = {};
2
3 // 为 foo 添加一个属性,可以成功
4 foo.prop = 123;
5 foo.prop // 123
6
7 // 将 foo 指向另一个对象,就会报错
8 foo = {}; // TypeError: "foo" is read-only
1 const a = [];
2 a.push(‘Hello‘); // 可执行
3 a.length = 0;    // 可执行
4 a = [‘Dave‘];    // 报错



 
时间: 2024-10-30 23:45:29

es6语法入门let 和 const 命令的相关文章

ES6教程:let和const命令的用法

ES6中新增了let和const命令,分别用于声明变量和常量. 1. 使用let命令取代var命令 在ES6之前的版本中,使用var声明变量,在ES6中新增了let来声明变量.let完全可以取代var,因为二者的语义相同,而且let没有"副作用". 我们先来看一下let命令有哪些特点: 不存在变量提升:变量只有在声明之后才能使用: 不允许重复声明:在相同的作用域下,一个变量名只能使用一次,不能重复声明: 具有块级作用域:在代码块中声明的变量,只对当前代码块和其内部嵌套代码块有效,如果嵌

ES6语法:let和const

ES6新增加了两个重要的JavaScript关键字:let和const 一.let关键字 let声明的变量只在let命令所在的代码块内有效. 1.基本语法 let a='123' 2.let和var的区别 var也是用来声明变量,let和var有什么区别呢?区别主要是以下三点: 2.1.同一作用域内let不能重复定义同一个名称,var可以重复定义 看下面的例子: // 同一个作用域内let不能重复定义同一个名称 let a='123';let a='456'; // 错误 // var可以重复定

ES6中的let和const命令

1.let命令 1)基本用法 let命令是ES6新增的命令,用来声明变量,类似于var,但let声明的变量只在let命令所在的代码块范围内有效. 2)不存在"声明提前" let声明的变量不存在"声明提前",变量一定要在声明后使用,否则会造成报错,例如: console.log(a);//undefined console.log(b);//报错! var a=3; let b=3: 3)暂时性死区 只要块级作用域内存在let命令,它所声明的变量就绑定了当前块级作用域

ES6 第一章 let和const命令 具体参照http://es6.ruanyifeng.com

1.let类似于var用用来定义变量 1)let没有预解析,不存在变量提升 // var 的情况 console.log(foo); // 输出undefined var foo = 2; // let 的情况 console.log(bar); // 报错ReferenceError let bar = 2; 2)let定义的变量在其定义之前使用都会报错,称为暂时性死区(TDZ) var tmp = 123; if (true) { tmp = 'abc'; // ReferenceError

1.《ES6标准入门》(阮一峰)--2.let 和 const 命令

1.let命令 基本用法 let只在命令所在的代码块内(花括号内)有效. for循环的计数器,就很合适使用let命令. //var var a = []; for (var i = 0; i < 10; i++) { a[i] = function () { console.log(i); }; } a[6](); // 10 //let var a = []; for (let i = 0; i < 10; i++) { a[i] = function () { console.log(i)

Vue -- ES6 快速入门,Vue初识

一.ES6快速入门 let和const let ES6新增了let命令,用于声明变量.其用法类似var,但是声明的变量只在let命令所在的代码块内有效. { let x = 10; var y = 20; } x // ReferenceError: x is not defined y // 20 效果如下: var声明变量存在变量提升.也就是在声明变量之前就可以使用该变量. console.log(x) // undefined,var声明变量之前可以使用该变量 var x = 10; 刷新

let和const命令

基本用法 ES6新增了let命令,用来声明变量.它的用法类似于var,但是所声明的变量,只在let命令所在的代码块内有效. { let a = 10; var b = 1; } a // ReferenceError: a is not defined. b // 1 上面代码在代码块之中,分别用let和var声明了两个变量.然后在代码块之外调用这两个变量,结果let声明的变量报错,var声明的变量返回了正确的值.这表明,let声明的变量只在它所在的代码块有效. for循环的计数器,就很合适使用

1.let 和 const 命令

let 和 const 命令 let 和 const 命令 let 命令 基本用法 ES6 新增了let命令,用来声明变量.它的用法类似于var,但是所声明的变量,只在let命令所在的代码块内有效. { let a = 10; var b = 1; } a // ReferenceError: a is not defined. b // 1 上面代码在代码块之中,分别用let和var声明了两个变量.然后在代码块之外调用这两个变量,结果let声明的变量报错,var声明的变量返回了正确的值.这表明

let 和 const 命令

let 命令 基本用法 ES6 新增了let命令,用来声明变量.它的用法类似于var,但是所声明的变量,只在let命令所在的代码块内有效. { let a = 10; var b = 1; } a // ReferenceError: a is not defined. b // 1 上面代码在代码块之中,分别用let和var声明了两个变量.然后在代码块之外调用这两个变量,结果let声明的变量报错,var声明的变量返回了正确的值.这表明,let声明的变量只在它所在的代码块有效. for循环的计数