ES6新增了let关键字
- 注意1:同一个块级作用域内,不允许重复声明同一个变量。
{
var a =1;
let a =2; //报错,因为a已经用var声明过
}
{
let a =1;
let a= 2; //还是报错,a已经用let声明过。
}
- 注意2:函数内不能用let重新声明函数的参数
function say(word){
let word = 'hello Jack'; //报错:用let重新声明word参数
alert(word)
}
say('hello Lili');
总结:用let声明变量只在块级作用域起作用,适合在for循环使用,也不会出现变量提升现象。同一个代码块内,不可重复声明的相同变量,不可重复声明函数内的参数。
关键字const 常量赋值
- 不可修改
const Name = '张三';
Name = '李四';//错误,企图修改常量Name
- 只在块级作用域起作用,这点与let关键字一样。
if(1){
const Name = '张三';
}
alert(Name);//错误,在代码块{ }外,Name失效
- 不存在变量提升,必须先声明后使用,这点也跟let关键字一样。
if(1){
alert(Name);//错误,使用前未声明
const Name = '张三';
}
- 不可重复声明同一个变量,这点跟let也一样。
var Name = '张三';
const Name = '李四';//错误,声明一个已经存在的变量Name
- 声明后必须要赋值
const NAME; //错误,只声明不赋值
- 赋值一个对象,传址赋值
const Person = {"name":"张三"};
Person.name = "李四";
Person.age = 20;
console.log(Person);
//结果:正常输出{name: "李四", age: 20}
const Person = {"name":"张三"};
Person.age = 20;
Person = {};
//错误,企图给常量Person赋新值(新地址)
总结:const也是用于声明一个常量,并必须赋值,声明后不可修改,跟let一样,只在块级作用域起作用,不可重复声明同一个变量,不会变量提升,声明引用类型的常量时,要注意是传址赋值
ES6新特性:解构赋值
- 变量的解构赋值
var [a,b,c] = [1,2,3]; //把数组的值分别赋给下面的变量;
console.log(a);//a的值为1
console.log(b);//b的值为2
console.log(c);//c的值为3
- 结构赋值可以嵌套的
var [ a,b,[ c1,c2 ] ] = [ 1,2,[ 3.1,3.2 ] ];
console.log(c1);//结果:c1的值为3.1
console.log(c2);//结果:c2的值为3.2
- 不完全解构
var [a,b,c] = [1,2];
console.log(a);//结果:a的值为1
console.log(b);//结果:b的值为2
- 赋值不成功,变量的值为undefined
var [a,b,c] = [1,2];
console.log(a);//结果:a的值为1
console.log(b);//结果:b的值为2
console.log(c);//结果:c的值为undefined
- 允许设定默认值
var [a,b,c=3] = [1,2];
console.log(a);//结果:a的值为1
console.log(b);//结果:b的值为2
console.log(c);//结果:c的值为3
var [a,b,c=3] =[1,2,4];
console.log(a);//结果:a的值为1
console.log(b);//结果:b的值为2
console.log(c);//结果:c的值为4
- 对象的解构赋值
var { a,b,c} = {"a":1,"b":2,"c":3};
console.log(a);//结果:a的值为1
console.log(b);//结果:b的值为2
console.log(c);//结果:c的值为3
- 字符串的解构赋值
var [a,b,c,d,e] = "我就是前端";
console.log(a);//我
console.log(b);//就
console.log(c);//是
console.log(d);//前
console.log(e);//端
- 解构赋值的用途
一、交换变量的值
var x = 1;
var y = 2;
[x,y] = [y,x];
二、提取函数返回的多个值
function demo(){
return {"name":"张三","age":21}
}
var {name,age} = demo();
console.log(name);//结果:张三
console.log(age);//结果:21
三、定义函数参数
function demo({a,b,c}){
console.log("姓名:"+ a);
console.log("身高:"+ b);
console.log("体重:"+ c);
}
demo({a:"张三",b:"1.72m",c:"50kg",d:"8000"});
四、函数参数的默认值
function demo({name="张三"}){
console.log("姓名:"+name);//结果:姓名:张三
}
demo({});
总结:解构赋值给我们一种新的变量赋值方式,主要可以利用数组解构赋值和对象解构赋值。它的用途包括:交换变量值,提取函数返回值,函数参数定义,默认值设定等等,都给我们编程带来便利,在未来的代码中会见到越来越多人使用这个新特性。