ES6学习总结是自己在学习过程中的总结,记笔记就是为了督促自己学习和复习,好记性不如烂笔头。如果有错误,感谢指出。
解构赋值
简单地理解:左边一种结构,右边一种结构,一一对应,进行赋值
解构赋值的分类
- 数组解构赋值**
- 对象解构赋值**
- 字符串解构赋值
- 布尔值解构赋值
- 函数参数解构赋值
- 数值解构赋值
12两边一样为数组或对象,重要
3左边数组,右边字符串
46属于2的一种
5是1的一种应用
数组解构赋值
基本使用方法
{
let a,b,rest;
[a,b]=[1,2];//数组解构赋值
console.log(a,b)//1 2
}
{
let a,b,rest;
[a,b,...rest]=[1,2,3,4,5,6]//数组解构赋值
console.log(a,b,rest)//1 2 [3,4,5,6]
}
{
let a,b,c,rest;
[a,b,c=3]=[1,2]
console.log(a,b,c)//1 2 3
}
默认值
//默认值
{
let a,b,c,rest;
[a,b,c]=[1,2]
console.log(a,b,c)//1 2 undefind
}
使用场景1:变量交换
{
let a=1;
let b=2;
[a,b]=[b,a]//变量交换
}
使用场景2:对函数返回值直接提取
没有解构赋值 需要先取出结果 然后通过索引来进行取出
{
function f(){
return [1,2]
}
let a,b;
[a,b]=f();
console.log(a,b);
}
使用场景3:取出返回结果的某些需要的值
{
function f(){
return [1,2,3,4,5]
}
let a,b,c;
[a,,,b]=f();
console.log(a,b); // 输出1 4
}
使用场景4:未知数组长度赋值
{
function f(){
return [1,2,3,4,5]
}
let a,b,c;
[a,...b]=f();
console.log(a,b);//输出1,[2,3,4,5]
}
对象解构赋值
基本使用方法
{
let o={p:42,q:true};
let {p,q}=o;
console.log(p,q);//42 true
}
默认值
{
let {a=10,b=5}={a:3};
console.log(a,b);//输出3 5
}
使用场景:json对象的解构赋值
{
let metaData={
title:'abc',
test:[{
title:'test',
desc:'description'
}]
}
let {title:esTitle,test:[{title:cnTitle}]}=metaData;
console.log(esTitle,cnTitle);//abc test
}