摘要：解构赋值的分类数组解构赋值对象解构赋值字符串解构赋值数值解构赋值布尔值解构赋值函数参数解构赋值。嵌套情况默认值解构赋值允许设置默认值，当数组成员严格等于，默认值将生效。报错报错函数参数的解构赋值函数的参数也可以使用解构赋值和指定默认值
ES6可以从数组和对象中提取值，然后对变量进行赋值。解构赋值的分类：数组解构赋值、对象解构赋值 、字符串解构赋值、数值解构赋值、布尔值解构赋值、 函数参数解构赋值。
1 数组的解构赋值 1.1 基本用法let [a, b, c] = [1, 2, 3]; //等同于 let a = 1; let b = 2; let c = 3;
如上所示，只要等号两边的模式相同，左边的变量就会被赋予右边对应的值。还可以使用嵌套数组进行结构。
let [foo, [[bar], baz]] = [1, [[2], 3]]; foo // 1 bar // 2 baz // 3 let [x, , y] = [1, 2, 3]; x // 1 y // 21.2 解构不成功
如果结构不成功，变量的值就等于undefined。
let [x, y, ...z] = ["a"]; x // "a" y // undefined z // [] //以下两种情况，foo的值都等于undefined。 let [foo] = []; let [bar, foo] = [1];1.3 不完全解构
即等号左边的模式只匹配一部分等号右边的数组，依然可以解构成功。
let[x, y] = [1, 2, 3]; x // 1 y // 2 //嵌套情况 let [a, [b], d] = [1, [2, 3], 4]; a // 1 b // 2 c // 41.4 默认值
解构赋值允许设置默认值，当数组成员严格等于undefined，默认值将生效。
let [x = 1] = [undefined]; x // 1 let [y = 1] = [null]; y // null2 对象的解构赋值
解构同样适用于对象。
let {foo, bar, barz} = {foo: "aaa", bar: "bbb"};
foo // "aaa"
bar // "bbb"
barz // undefined
对象的解构赋值实际上是先找到同名属性，然后再赋值给对应的变量,前者是匹配模式，后者才是真正的变量。
let { foo: foo, bar: bar } = { foo: "aaa", bar: "bbb" };
let obj = { first: "hello", last: "world" };
let { first: f, last: g } = obj;
f // "hello"
g // "world"
first // first id not undefined
解构也可以用于嵌套结构的对象
let obj = {
p: [
"hello",
{ y: "world" }
]
};
let { p, p: [x, { y }] } = obj;
x // "hello"
y // "world"
p // ["hello", { y: "world" }]
对象的解构同样可以指定默认值
let { x = 1 } = {};
x // 1
3 字符串的解构赋值
字符串进行解构赋值时，会被转换成一个类数组对象。
const [a, b, c] = "red"; a // "r" b // "e" c // "d"
类数组对象的length属性也可以进行解构赋值
let { length: len } = "hello";
len // 5
4 数值和布尔值的解构赋值
解构赋值时，如果等号右边不是数组和对象，则会先转为对象，如果是undefined和null则无法转为对象，此时会报错。
let { toString: s } = 123;
s === Nunmber.prototype.toString // true;
let { toString: s } = true;
s === Boolean.prototype.toString // true;
let { prop : x } = undefined; // 报错
let { prop : y } = null; // 报错
5 函数参数的解构赋值
函数的参数也可以使用解构赋值和指定默认值
function add([x, y]){
return x + y;
}
add([1,2]); // 3
function move({ x = 0, y = 0 } = {}) {
return [x, y];
};
move({ x: 3, y: 8 }); // [3, 8]
文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。
转载请注明本文地址：https://www.ucloud.cn/yun/109691.html
摘要：另外对于已经声明的变量进行解构赋值时，要非常小心。因此在行首加，将其强制转化为表达式执行。由于和无法转为对象，所以对它们进行解构赋值，都会报错。 let和const let和const是es6新增的两个变量声明关键字，与var的不同点在于： （1）let和const都是块级作用域，在{}内有效，这点在for循环中非常有用，只在循环体内有效。var为函数作用域。 （2）使用let和con...
摘要：前言前言该篇笔记是第二篇变量的解构赋值。这一章原文链接变量的解构赋值解构赋值解构赋值允许按照一定模式，从数组和对象中提取值，对变量进行赋值，这被称为解构。对象的解构赋值是根据对象值进行匹配。前言该篇笔记是第二篇 变量的解构赋值。这一章原文链接： 变量的解构赋值解构赋值ES6 允许按照一定模式，从数组和对象中提取值，对变量进行赋值，这被称为解构（Destructuring）。解构赋值是对赋值运...
摘要：前言该篇笔记是第二篇变量的解构赋值。这一章原文链接变量的解构赋值解构赋值允许按照一定模式，从数组和对象中提取值，对变量进行赋值，这被称为解构。对象的解构赋值是根据对象值进行匹配。 前言该篇笔记是第二篇 变量的解构赋值。 这一章原文链接： 变量的解构赋值解构赋值ES6 允许按照一定模式，从数组和对象中提取值，对...
摘要：默认值同时，对象解构赋值也允许设置默认值，默认值生效的判断条件同数组，只有在对应值严格等于时会生效。报错如果要将一个已经声明的变量用于解构赋值，必须非常小心。的规则是，只要有可能导致解构的歧义，就不得使用圆括号。 ECMAScript6/ES6 入门 let和const命令 四、变量的解构赋值 在ES6之前，数组和对象属性赋值只能直接指定固定值，ES6 允许按照一定模式，从数组和对象中...
摘要：它是一个通用标准，奠定了的基本语法。年月发布了的第一个版本，正式名称就是标准简称。结语的基本扩展还有一些没有在这里详细介绍。 前言 ES6标准以及颁布两年了，但是，好像还没有完全走进我们的日常开发。这篇文章从ES6的基本类型扩展入手，逐步展开对ES6的介绍。 ECMAScript和JavaScript JavaScript是由Netscape创造的，该公司1996年11月将JavaSc...
阅读 2528·2021-10-11 10:58
阅读 1106·2021-09-29 09:34
阅读 1371·2021-09-26 09:46
阅读 3794·2021-09-22 15:31
阅读 682·2019-08-30 15:54
阅读 1429·2019-08-30 13:20
阅读 1217·2019-08-30 13:13
阅读 1453·2019-08-26 13:52
