es笔记(解构赋值)

最新推荐文章于 2025-07-21 17:34:04 发布

原创最新推荐文章于 2025-07-21 17:34:04 发布 · 1.4k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#解构赋值

es6 专栏收录该内容

10 篇文章

订阅专栏

本文详细介绍了JavaScript中的解构赋值，包括数组、默认值、对象和字符串的解构赋值。对于数组，当变量传入为undefined时，会使用默认值；默认值可以是惰性求值的函数或已声明的其他变量。对象的解构赋值遵循同名属性赋值原则，若父属性不存在，会导致错误。字符串能被转换为类似数组对象进行解构。同时，解构赋值也适用于布尔值的情况。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

数组的解构赋值

let [a, b, c] = [1, 2, 3];
let [foo, [[bar], baz]] = [1, [[2], 3]];
let [ , , third] = ["foo", "bar", "baz"];
let [x, y, ...z] = ['a'];
x // "a"
y // undefined
z // []
这样的写法属于模式匹配，要是没有匹配到，返回undefined
不完全解构，也能成功
set结构也能使用数组解构
事实上，只要某种数据结构具有 Iterator 接口，都可以采用数组形式的解构赋值。

默认值

当let的变量传入的值为undefined时，这里的比较是===比较，所以传入null变量不会等于默认值，而传入undefined变量会等于默认值
例：

let [x = 1] = [undefined];
x // 1

let [x = 1] = [null];
x // null

如果默认值是一个函数，则惰性求值，即用到的时候才执行函数
默认值可以引用解构赋值的其他变量，但该变量必须已经声明。顺序从左往右

对象的解构赋值

对象的解构赋值机制，是先找到同名属性，再给对应变量赋值，真正赋值的是后者
如果解构模式是嵌套的对象，而且子对象所在的父属性不存在，那么将会报错
由于数组本质是特殊的对象，因此可以对数组进行对象属性的解构。

let arr = [1, 2, 3];
let {0 : first, [arr.length - 1] : last} = arr;
first // 1
last // 3

字符串的解构赋值

字符串也可以被转换成类似数组的对象
所以

let [a,b,c,d]='stri'

类似数组的对象有一个length属性
所以

let {length:aaa}='stri'
aaa//4

数组和布尔值的解构赋值

let {toString: s} = 123;
s === Number.prototype.toString // true

let {toString: s} = true;
s === Boolean.prototype.toString // true