ES6学习解构赋值

栏目: JavaScript · 发布时间: 6年前

内容简介:结构赋值,又叫结构化赋值,出现主要是为了方便从后端获取复杂数据结构值。下面介绍解构赋值。以上面obj对象为例通过{}可以很容易获取到obj里面的name,age对象。

结构赋值,又叫结构化赋值,出现主要是为了方便从后端获取复杂数据结构值。下面介绍解构赋值。

解构对象

let obj = {
        name: 'aa',
        age: 17
    }
复制代码

以上面obj对象为例

let name
    let age
    ({name,age} = obj)
    console.log(name,age) //aa 17
复制代码

通过{}可以很容易获取到obj里面的name,age对象。

获取同名对象还可以这样写

let {name,age} = obj
    console.log(name,age) //aa 17
复制代码

获取不同名变量可以在后面重写

let {name:oName,age:oAge} = obj
    console.log(oName,oAge) //aa 17
复制代码

默认赋值 sex = 'male'

let {name:oName,age:oAge,sex = 'male'} = obj
    console.log(oName,oAge,sex) //aa 17 male
复制代码

默认赋值也可在函数形参中使用

function sum(x= 10,y = 20){
        console.log(x + y) //50  30+20=50,传入取实参,不传入取默认值。
        return x + y
    }
    sum(30)
复制代码

解构数组

let arr = [1,2,3]
    let [x,y,z] = arr // 也可写成 let {0:x,1:y,2:z} = arr
    console.log(x,y,z) //1,2,3
复制代码

因为数组有length,所以获取数组length方法

let arr = [1,2,3]
    let {length} = arr
    console.log(length) //3
复制代码

如果数组里有对象,也是可以结构赋值的

let arr1 = [1,2,3,{name:'aa'}]
    let [,,,{name}] = arr1
    console.log(name) //aa
复制代码

结构赋值相对简单,在这里就不多说了。

有错误欢迎指出,谢谢观看。

广告:

作者github: github.com/webxukai

作者gitee:gitee.com/webxukai

作者微信:e790134972

作者QQ:我想你应该知道了!

作者QQ邮箱:同上,呵呵!

ES6其他文章:

ES6学习let&const

juejin.im/post/5c683e…

ES6学习...运算符

juejin.im/post/5c6917…

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持 码农网

查看所有标签

猜你喜欢:

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

Learning Vue.js 2

Learning Vue.js 2

Olga Filipova / Packt Publishing / 2017-1-5 / USD 41.99

About This Book Learn how to propagate DOM changes across the website without writing extensive jQuery callbacks code.Learn how to achieve reactivity and easily compose views with Vue.js and unders......一起来看看 《Learning Vue.js 2》 这本书的介绍吧!

HTML 压缩/解压工具
HTML 压缩/解压工具

在线压缩/解压 HTML 代码

在线进制转换器
在线进制转换器

各进制数互转换器

Markdown 在线编辑器
Markdown 在线编辑器

Markdown 在线编辑器