学习笔记 JavaScript ES6 解构赋值

• 数组的解构赋值
• 对象的解构赋值
• 字符串的解构赋值
• 参数的解构赋值
• 方法调用中对象的解构赋值
• 返回值的解构赋值
• JSON的解构赋值 

解构赋值就是按照一定的模式，从数组或对象中提取值，然后对变量赋值（模式匹配）。

解构赋值：“=”两边的结构是一样的

# JS内引入其它JS时，使用import关键字

import './2-2' //注意，js扩展名是可以不写的

----------------------------------------------------------------------

正式开始：

• 数组的解构赋值

let [a, b, [c, d]] = [1, 2, [3, 4]]

console.log(a, b, c, d)

------------
1,2,3,4


let [a, b, c, d = 5] = [1, 2, [3, 4], 6]

console.log(a,b,c,d) // d有初始值，后面又新赋值了，就是说如果你传给我值，就以新传的为准，如果不传就以默认的为准

----------------------
1 2 (2) [3, 4]  6

• 对象的解构赋值

let user = {
  name: "wangshuo",
  age: 36,
};

let {name, age} = user // {}是对象，[]是数组，对象用key查找，数据用顺序查找
console.log(name,age)

-------------------
wangshuo 36

如果想给上面代码中name,age换一个别名，可以用“ : ”实现

name: uname, age: uage

let user = {
  name: "wangshuo",
  age: 36,
};

let { name: uname, age: uage } = user;
console.log(uname, uage);

------------------
wangshuo 36

• 字符串的解构赋值

let str = 'sure';
let [a, b, c, d] = str;

console.log(a, b, c, d);
--------------------
s u r e

• 参数的解构赋值

function foo(a, b, c) {
  console.log(a, b, c);
}

let arr = [1, 2, 3];
foo(arr);

-----------------------
1,2,3

• 对象的解构赋值

function foo({ name, age, school = "sy" }) {
  console.log(name, age, school);
}

let obj = {
  name: "wangshuo",
  age: "36",
  school: "stinghua",
};

foo(obj);

--------------------------
angshuo 36 stinghua

• 返回值的解构赋值

function foo() {
  let obj = {
    name: "wangshuo",
    age: "36",
    school: "stinghua",
  };

  return obj;
}

let { name, age } = foo();

console.log(name, age);

------------------
wangshuo 36

• JSON的解构赋值

        思路是先将JSON转为对象，再进行对象的解构赋值

let json = '{"a":"hello","b":"world"}';
let { a, b } = JSON.parse(json);
console.log(a, b);

----------------------
hello world