变量声明 和 数组对象解构赋值,本编主要学习 let const 使用语法，注意事项。以及数组和对象的解构赋值。
let 声明
作用：let作用主要是定义一个局部变量.
使用语法：
let hello = "hello word";
使用注意事项：
- let 声明的变量只在声名的块级内有作用
- let 变量必须先声明后使用，否则会报错
- let 变量不能在一个作用域里多次声明
- let 在函数内声明时，尽量不与参数同名。
错误示例：
//1.let是块级作用域
function f(input) {
let a = 100;
if (input) {
let b = a + 1; //运行正确
return b;
}
return b; //错误 , b没有被定义
}
//2.let 变量必须先声明后使用
a++;
let a;
//3.不能在同一作用域重复定义
let y = 2;
let y = 3;
var x = 1;
let x = 2;
//4.与参数重复的情况
//错误：
function funA(x) {
let x = 100; //报错，x已经在函数参数声明了
}
//正确：
function funB(codition,x) {
if (codition) {
let x = 100; //运行正确，x在一新的作用域中
return x;
}
return x;
}
const 声明
作用：const作用主要是定义一个常量
使用语法：
const PI = 3.1415;
使用语法:
1.对常量直接赋值将会出错
2.常量如果是对象，对象属性是可以重新赋值的;
3.常量的作用域与let 相同; 只在声明的块级有用
4.常量不可重复定义
错误示例：
//1.常量不可修改
const PI = 3.1415;
PI = 3; //报错，常量不可修改
//2.对象常量不可直接修改，对象属性可以更改
const kitty = {
name: "Aurora",
numLives:9
};
//错误
kitty = {
name: "Danielle",
numLives:9
};
//正确
kitty.name = "Kitty";
kitty.numLives--;
//3.常量作用域
if (codition) {
const MAX = 5;
}
console.log(MAX) // MAX 在此处不可见
//4.不能重复声明
var message = "Hello";
let age = 25;
//以下两行都是错误
const message = "Goodbye";
const age = 26;
解构赋值
作用：解构赋值可将一个复杂类型的数据，如数组和对象，分解匹配赋值给多个独立的变量。
使用语法：
- 数组解构
let [a,b,c] = [1,2,3]; - 对象解构
let {foo, bar} = {foo: "aaa",bar:"bbb"};
使用注意事项：
1.数组解构按顺序，对象解构则无关顺序据属性名取值。
2.对于不成功的的解构，最值会赋值undefined
3.对undefined 和 null 进行解构会报错
4.解构赋值允许指定默认值
5.解构赋值对于var let const 都是适用的
数组解构使用示例：
//解构数组
var [first,second] = [1,2];
first; //1
second; //2
//解构多维数组
var [foo,[[bar],baz]] = [1,[[2],3]];
foo; //1
bar; //2
baz; //3
var [,,third] = ["foo","bar","baz"];
third; //baz
//解构...数组
var [head,...tail] = [1,2,3,4];
head; //1;
tail //[2,3,4];
//解构失败赋值undefined
var [foo] = [];
var [foo] = 1;
var [foo] = 'Hello';
var [foo] = false;
var [foo] = NaN;
//以下两行解构会报错
const [foo] = undefined;
const [foo] = null;
//指定解构的默认值
var [foo = true] = [];
foo; //true
对象解构示例：
//解构对象
let test = { x: 0, y: 10, width: 15, height: 20 };
let { x, y, width, height } = test;
console.log(x, y, width, height); //输出0,10,15,20
//解构对象按属性名取值,无关顺序
let { foo, bar } = { foo: 'aaa', bar: 'bbb'};
foo //'aaa';
bar //'bbb';
let {bar,foo} = { foo: 'aaa', bar: 'bbb'};
foo //'aaa';
bar //'bar';
//属性名不对,赋值为undefined
let { baz , foo} = { foo: 'aaa', bar: 'bbb'};
baz; //undefined //解构不成功
foo; //'aaa'
//重命名解构属性,重命名后原名称不可取值。
let { foo: baz } = { foo: 'aaa', bar: 'bbb'};
baz; //'aaa';
foo; // 出错
//解构多维对象
var o = {
p: [
"Hello",
{ y: "word" }
]
};
var { p: [x, { y }] } = o;
x //"Hello";
y //"word";
//指定默认值
var { x = 3 } = {};
x //3
解构赋值的具体使用点：
- 交换变量值
- 从函数返回多个值
- 更方便的接收json类型参数对象
- 更方便设置默认参数
- 更方例的遍历对象
- 模块加载更清晰
本文为我个人学习ECMA6的笔记，内容及案例多为书本抄写，未做代码正确性测试，内容仅供参考，不保证文中观点的及代码的正确性。