JavaScript解构赋值（ES6）

以你之姓@ 2023-02-18 09:40 109阅读 0赞

**1. 数组的解构** （按顺序解构）

把数组里的元素按顺序赋值给四个变量：  
●如果解构的变量少于数组元素，那么就只解构前几个元素。  
●如果解构的变量多于数组元素，那么多余的变量就是undefined。

var arr = [4, 3, 9, 7]
        var [a, b, c, d, e] = arr
        console.log(a)   //打印4
        console.log(b)   //打印3
        console.log(c)   //打印9
        console.log(d)   //打印7
        console.log(e)   //打印undefined

**2. 对象的解构** （按属性名解构）

对象的解构是按照属性名来解构的：  
**声明的变量要对应对象里的属性名，才能拿到属性值**；  
如果去解构一个对象里不存在的属性，得到undefined。

// 对象是无序的，没有length属性
        var obj = { 
          username: 'lisi',
          age: 20,
          gender: 'male',
          say: function () { 
            console.log(this.age)
          }
    }
        var {  gender, age, aaa, say } = obj           // var age = obj.age
        console.log(age) // 打印20
        console.log(gender) // 打印male
        console.log(aaa) // 打印undefined

say解构出来就是一个全局函数了，可以直接调用，相当于var say = obj.say  
say()

**3. 解构赋值的逆用**：简写对象定义,直接将声明赋值过的标量写在对象中，无需键值对的形式。

var age = 20
        var username = 'lisi'
        var gender = 'male'
        // ES6里面可以简写
        var obj = { 
          age,
          username,
          gender
        }
        console.log(obj)

![在这里插入图片描述][20200617090849714.png]

[20200617090849714.png]: https://img-blog.csdnimg.cn/20200617090849714.png

发表评论取消回复

表情：

评论列表（有 0 条评论，109人围观）

还没有评论，来说两句吧...

相关阅读

相关 JavaScript解构赋值（ES6）

1. 数组的解构（按顺序解构）把数组里的元素按顺序赋值给四个变量： ●如果解构的变量少于数组元素，那么就只解构前几个元素。 ●如果解构的变量多于数组元素，那么多余

以你之姓@/ 2023年02月18日 09:40/ 0 赞/ 110 阅读

相关 es6解构赋值

一、定义 ES6允许按照一定的模式，从数组和对象中提取值，对变量进行赋值，被称为解构二、详情讲解 1、数组解构：数组解构时数组的元素是按次序排列的，变量的取

浅浅的花香味﹌/ 2022年11月06日 14:58/ 0 赞/ 226 阅读

相关 ES6解构赋值

ES6 解构赋值概述解构赋值是对赋值运算符的扩展。他是一种针对数组或者对象进行模式匹配，然后对其中的变量进行赋值。在代码书写上简洁且易读，语义更加清晰明

迷南。/ 2022年11月01日 15:50/ 0 赞/ 240 阅读

相关 ES6～解构赋值

解构赋值：定义： ES6按照统一模式，从数组和对象中提取值，对变量进行赋值，这样被称为解构．注意： \\1.\\node.js目前還不支持解构赋值，所以

刺骨的言语ヽ痛彻心扉/ 2022年06月05日 01:53/ 0 赞/ 288 阅读

相关 ES6解构赋值

原文转自[https://www.cnblogs.com/xiaohuochai/p/7243166.html][https_www.cnblogs.com_xiaohuoch

﹏ヽ暗。殇╰゛Y/ 2022年05月11日 16:24/ 0 赞/ 300 阅读

相关 es6 解构赋值

ES6解构赋值传统的变量赋值：变量的解构赋值：数组的解构赋值: 对象的解构赋值:\`(和数组解构赋值类似)\`

短命女/ 2022年02月05日 11:13/ 0 赞/ 357 阅读

相关 es6解构赋值

解构赋值如对象解构 // es6 const electron = require('electron') const { app, Br

Myth丶恋晨/ 2021年12月23日 16:33/ 0 赞/ 351 阅读

相关 ES6——解构赋值

原文链接：[小邵教你玩转ES6][ES6] 解构赋值解构赋值主要分为对象的解构和数组的解构，在没有解构赋值的时候，我们赋值是这样的 let arr = [0

迷南。/ 2021年11月04日 21:46/ 0 赞/ 478 阅读

相关 javaScript---ES6解构赋值

今天我兄弟遇到的一道题，分享给大家： ![70][] 运行结果：![70 1][] 这是ES6结构赋值的问题：解析如下： ![70 2][] [70]:

叁歲伎倆/ 2021年09月15日 02:10/ 0 赞/ 337 阅读

相关 ES6解构赋值

ES6解构赋值一、什么是解构赋值二、语法 1.数组解构 2.对象解构三、注意点一、什么是解构赋值允许从数组中

客官°小女子只卖身不卖艺/ 2021年09月07日 06:10/ 0 赞/ 441 阅读