解构赋值的使用

最新推荐文章于 2023-05-09 15:37:06 发布

小豪boy

最新推荐文章于 2023-05-09 15:37:06 发布

阅读量945

点赞数

分类专栏： ES6学习笔记文章标签： javascript java node.js

本文链接：https://blog.csdn.net/qq_34771938/article/details/120418825

版权

ES6学习笔记专栏收录该内容

20 篇文章 0 订阅

订阅专栏

一、数组的解构赋值

1. 数组解构赋值是什么

认识解构赋值

什么是解构赋值

解析某一数据的结构，将我们想要的东西提取出来，赋值给变量或常量。

2. 数组解构赋值的原理

模式（结构）匹配

// 1.模式（结构）匹配
[] = [1, 2, 3];

索引值相同的完成赋值

// 2.索引值相同的完成赋值
const [a, b, c] = [1, 2, 3];

3. 数组解构赋值的默认值

默认值的基本用法

默认值的生效条件

只有当一个数组成员严格等于（===）undefined 时，对应的默认值才会生效。

默认值表达式

如果默认值是表达式，默认值表达式是惰性求值的（当满足默认值的生效条件时才会求值）。

4. 数组解构赋值的应用

常见的类数组的解构赋值

arguments：

NodeList：

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8" />
    <title>常见的类数组的解构赋值</title>
</head>

<body>
    <p>123</p>
    <p>321</p>
    <p>34567</p>
    <script>
        // NodeList
        console.log(document.querySelectorAll('p'));
        const [p1, p2, p3] = document.querySelectorAll('p');
        console.log(p1, p2, p3);
    </script>
</body>

</html>

函数参数的解构赋值

交换变量的值

二、对象的解构赋值

1. 对象解构赋值的原理

模式（结构）匹配

// 1.模式（结构）匹配
{ }={ }

属性名相同的完成赋值

2. 对象解构赋值的注意事项

对象解构赋值的默认值

对象的属性值严格等于 undefined 时，对应的默认值才会生效。

如果默认值是表达式，默认值表达式是惰性求值的。

将一个已经声明的变量用于解构赋值

如果将一个已经声明的变量用于对象的解构赋值，整个赋值需在圆括号中进行。

可以取到继承的属性

3. 对象解构赋值的应用

函数参数的解构赋值

复杂的嵌套

三、其它数据类型的解构赋值

1. 字符串的解构赋值

字符串既可以按数组形式来解构赋值，也可以按对象形式来解构赋值。

但是不能写成下面的这种解构形式。

2. 数值和布尔值的解构赋值

3. undefined 和 null 的解构赋值

小豪boy

关注

0
点赞
踩
14

收藏

觉得还不错? 一键收藏
0
评论
解构赋值的使用

数组的解构赋值数组解构赋值是什么认识解构赋值什么是解构赋值解析某一数据的结构，将我们想要的东西提取出来，赋值给变量或常量。数组解构赋值的原理模式（结构）匹配// 1.模式（结构）匹配[] = [1, 2, 3];索引值相同的完成赋值// 2.索引值相同的完成赋值const [a, b, c] = [1, 2, 3];数组解构赋值的默认值默认值的基本用法默认值的生效条件只有当一个数组成员严格等于（===）undefi
复制链接

扫一扫