解构赋值中这是我参与11月更文挑战的第4天，活动详情查看：2021最后一次更文挑战。前言 ECMAScript 6.

这是我参与11月更文挑战的第4天，活动详情查看：2021最后一次更文挑战。

前言

ECMAScript 6.0 简称ES6 , 是 JavaScript 语言的新一代的标准，于在 2015 年 6 月发布，正式名称就是《ECMAScript 2015 标准》。

一般情况，ES6 一个泛指， 5.1版以后的 JavaScript 的下一代标准，涵盖了 ES2015、ES2016、ES2017、ES2018、ES2019、ES2020、ES2021 等等

上篇我们讲到了对象，数组(Set，Generator函数，类数组）的结构，我们今天继续字符串，数字，布尔值等的解构。

字符串的解构

字符串的结构，你可以认为是 String对象的解构。

因为字符串可以用下标访问字符，所以用数组解构，得到的是对应位置的字符。

const [p, e, r, s, o , n] = 'person';

console.log(p,e,r); // p e r

其次还可以用对象结构，获得原型上的方法。

const {length, slice} = "person"
console.log(length); // 6
console.log(slice);  // ƒ slice() { [native code] }

数字的解构

数字的解构，本质是对 Number对象的解构。

我们先尝试数组解构

const [num1] = 123;

理所当然报错，但是我们可以解构到原型上的方法。

const { toFixed } = 123;
console.log(toFixed); 
// ƒ toFixed() { [native code] }

布尔值的解构

和数字的解构非常类似，不做过多的阐述。

null, undefined

null和undefined是无法转为为对象的，所以并不能进行解构。

const {p} = null;
const {p2} = undefined
// VM2042:1 Uncaught TypeError: Cannot destructure property 'p' of 'null' as it is null.
// VM2127:1 Uncaught TypeError: Cannot destructure property 'p2' of 'undefined' as it is undefined.

BigInt的解构

其实原始数据类型，基本都是一个套路，转为对象然后进行解构。

const { constructor } = 1n;
console.log(constructor === BigInt) // true

Symbol的解构

其实原始数据类型，基本都是一个套路，转为对象然后进行解构。

我们看看怎么获取description

const symbol = Symbol.for("key");
const { description } = symbol;
console.log(description);  // key

参数的解构

参数同样分为对象结构和数组解构。

对象结构：

function log({id, name}){
    console.log(id, name)
}
log({id:10, name: "Tom"}) // 10, Tom

数组解构

function divide([num1, num2]){
    return num1/num2
}

解构还可以和默认值一起使用，

function log({id = 1, name = "tom"} = {id:100, name: "jim"}){
    console.log(id, name)
}
log() // 100, jim

log(null)

log()
因为没传递任何值，{id:100, name: "jim"} 生效
log(null) 默认值，只有值是undefined才生效
log({})
因为有值，{id = 1, name = "tom"}生效，最后输出为 1, tome
log({id: 10})
因为有值，{id = 1, name = "tom"}生效，但是name属性没有传递，默认值生效，最终输出 10, tom

还有一种比较隐蔽的参数结构，就是高阶函数时，参数的解构。

var arr = [[1,2],[3,4]];
var result = arr.map( ([a,b])=> a*b);
console.log(result); // [2, 12]

小结

基本都是一个套路

null 和 undefined不能解构
其他基础数据类型转为对象，进行解构
如果已经是对象或者数组，直接进行解构

今天你收获了吗？

解构赋值 中

前言