1.变量的声明
let命令
1. 在同一作用域下声明不可以重复
2. 声明不会提升
3. 具有局部作用域
let a = 0;
if(true){
a++; //报错
let a = 1;
}
console.log(a); //报错
4. 暂时性死区
总之,在代码块内,使用let
命令声明变量之前,该变量都是不可用的。这在语法上,称为“暂时性死区”(temporal dead zone,简称 TDZ)
const命令
基本用法
const
声明一个只读的常量。一旦声明,常量的值就不能改变。具有let的所有特性, 只能被显示初始化一次。const
声明的变量不得改变值,这意味着,const
一旦声明变量,就必须立即初始化,不能留到以后赋值。
ES6 声明变量的六种方法
ES5 只有两种声明变量的方法:var
命令和function
命令。ES6 除了添加let
和const
命令,后面章节还会提到,另外两种声明变量的方法:import
命令和class
命令。所以,ES6 一共有 6 种声明变量的方法。
2.变量的解构赋值
默认值
解构赋值允许指定默认值。若不存在值时,则将取默认值
1.数组的解构赋值:ES6 允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构
按照对应位置,对变量赋值
let [a,b,c,d]=[1,2,3,[4,5],6]
应用: 交换两个数组的值
let i=1;
let j=2;
[i,j]=[j,i]
2.对象的解构赋值
对象的解构与数组有一个重要的不同。数组的元素是按次序排列的,变量的取值由它的位置决定;而对象的属性没有次序,变量必须与属性同名,才能取到正确的值。
es5中对象必须是键值对,但es6中对象可以简写
let { foo, bar } = { foo: "aaa", bar: "bbb" };
foo // "aaa"
bar // "bbb"
应用:模块化的引用
category.js
module.exports={
findAllCategory:function(){},
deleteCategoryById:function(){}
}
index.js
let category=require('./category');
let {deleteCategoryById}=require('./category');//只获取deleteCategoryById中的函数,其他的不导入
3.字符串解构
字符串也可以解构赋值。这是因为此时,字符串被转换成了一个类似数组的对象。
let [a,b,c...d]="hello" lo->d
类似数组的对象都有一个length
属性,因此还可以对这个属性解构赋值。
let {length : len} = 'hello';
len // 5
4.数值和布尔值的解构赋值
解构赋值时,如果等号右边是数值和布尔值,则会先转为对象。
let {toString: s} = 123;
s === Number.prototype.toString // true
let {toString: s} = true;
s === Boolean.prototype.toString // true
上面代码中,数值和布尔值的包装对象都有toString
属性,因此变量s
都能取到值。
解构赋值的规则是,只要等号右边的值不是对象或数组,就先将其转为对象。由于undefined
和null
无法转为对象,所以对它们进行解构赋值,都会报错。
解构的用途
变量的解构赋值用途很多。
(1)交换变量的值
(2)从函数返回多个值
函数只能返回一个值,如果要返回多个值,只能将它们放在数组或对象里返回。有了解构赋值,取出这些值就非常方便。
(3)函数参数的定义
解构赋值可以方便地将一组参数与变量名对应起来。
(4)提取 JSON 数据
解构赋值对提取 JSON 对象中的数据,尤其有用
let jsonData = {
id: 42,
status: "OK",
data: [867, 5309]
};
let { id, status, data: number } = jsonData;
console.log(id, status, number);
// 42, "OK", [867, 5309]
(5)函数参数的默认值
(6)遍历 Map 结构
任何部署了 Iterator 接口的对象,都可以用for...of
循环遍历。Map 结构原生支持 Iterator 接口,配合变量的解构赋值,获取键名和键值就非常方便。
const map = new Map();
map.set('first', 'hello');
map.set('second', 'world');
for (let [key, value] of map) {
console.log(key + " is " + value);
}
// first is hello
// second is world
如果只想获取键名,或者只想获取键值,可以写成下面这样。
// 获取键名
for (let [key] of map) {
// ...
}
// 获取键值
for (let [,value] of map) {
// ...
}
(7)输入模块的指定方法
加载模块时,往往需要指定输入哪些方法。解构赋值使得输入语句非常清晰。
const { SourceMapConsumer, SourceNode } = require("source-map");
3.对象扩展
属性简写
function f(x, y) {
return {x, y};
}
// 等同于
function f(x, y) {
return {x: x, y: y};
}
f(1, 2) // Object {x: 1, y: 2}
对象函数方法的简写,对象的方法简写可用于多处,箭头函数仅用于回调函数
const o = {
method() {
return "Hello!";
}
};
// 等同于
const o = {
method: function() {
return "Hello!";
}
};
4.函数扩展
1) 参数默认值:ES6 允许为函数的参数设置默认值,即直接写在参数定义的后面。
参数较少的用参数默认,参数比较多时用解构形式