ES5、ES6自学笔记( 九 )


for循环中的let声明
在let出现之前,for循环定义的迭代变量会渗透到循环体外部:
for(var i=0;i<5;++i){}console.log(i);//5
改成使用let之后,这个问题就消失了,因为迭代变量的作用域仅限于for循环块内部:
for(let i=0;i<5;++i){}console.log(i);//ReferrenceError:i 没有定义
在使用var的时候,最常见的问题就是对迭代变量的奇特声明和修改:
for(var i = 0; i< 5; ++i){setTimeout(()=>console.log(i), 0)}//实际上输出5、5、5、5、5
之所以会这样,是因为在退出循环时,迭代变量保存的是导致循环退出的值:5 。在之后执行超时逻辑时,所有i都是同一个变量,因而输出的都是同一个最终值 。
而在使用let声明迭代变量时,引擎在后台会为每个迭代循环声明一个新的迭代变量 。每个引用的都是不同的变量实例 。
for(let i = 0; i< 5; ++i){setTimeout(()=>console.log(i), 0)}//实际上输出0、1、2、3、4
const

ES5、ES6自学笔记

文章插图
const的行为与let基本相同,唯一一个重要的区别是用它声明变量时必须同时初始化变量,且尝试修改const声明的变量会导致运行错误
const age=20;age=22;//TypeError:给常量赋值//const也不允许重复声明const name="Continue";const name="xiao"//SyntaxError//const声明的作用域也是块const name="Continue"if(true){const name="xiao"}console.log(name);//Continue
const声明的限制只适用于它指向的变量的引用 。换句话说,如果const变量引用的是一个对象,那么修改这个对象的内部属性并不违反const的限制 。
const person(){};person.name="Continue";
即使引擎会为for循环中的let声明分别创建独立的变量实例,而且const变量跟let变量很相似,也不能用const来声明迭代变量(因为迭代变量会自增):
for(const i = 0; i< 5; ++i){}//TypeError:给常量赋值
声明风格及最佳实践
不使用var
有了let和const,大多数开发者会发现不需要var了 。限制自己只使用let和const有助于提升代码质量,因为变量有了明确的作用域、声明位置、以及不变的值 。
const优先,let次之
使用const声明可以让浏览器运行时强制保持质量不变,也可以让静态代码分析工具提前发现不合法的赋值操作 。因此,很多开发者认为应该优先使用const来声明变量,只在提前知道未来会有修改时,在使用let 。这样可以让开发者更有信心的判断某些变量的值永远不会变,同时也能迅速的发现因意外赋值导致的非预期行为 。
解构赋值
ES6中允许从数组中提取值,按照对应位置,对变量赋值 。对象也可以实现解构 。(算是一种定义变量的语法糖)
数组解构
// 不使用数组解构赋值// let a = 1;// let b = 2;// let c = 3;// 数组解构let [a, b, c] = [1, 2, 3];console.log(a);// 1console.log(b);// 2console.log(c);// 3// 扩展let arr = [4, 5, 6];let [d, e, f] = arr;console.log(d); //4console.log(e); //5console.log(f); //6
如果变量名和值的数量不对应,则值为
对象解构
let person = {name : "zhangsan",age : 27}let {name, age, like} = person;console.log(name);// zhangsanconsole.log(age); // 27console.log(like);// undefinedlet {name : myname } = person;// 这里的myname属于别名;console.log(myname); // zhangsan