• ES6的解构赋值


    通常在与后端进行接口对调的时候,后端往往会返回一大堆的数据,以前我们往往会这么做:

        var obj = {
            name: 'name',
            age: '20'
        };
        var name = obj.name;
        var age = obj.age;

    以这样的形式来去取出需要的数据,但是如果在数据量非常多的情况下,这样的话,代码量就特别多了,而在ES6里面的解构赋值,取值就变得方便了很多。

        var obj = {
            name: 'name',
            age: '20'
        };
        var {name} = obj;
        console.log(name);

    如何在声明变量之后再去进行解构赋值呢?

    var obj = {
        name: 'name',
        age: '20'
    };
    var name = '';
    ({name} = obj);
    console.log(name);

    这里一定要将解构的区域用括号包裹起来,表示这里是一个完整区域。

    如何将数据解构之后将Key值进行重命名呢?

    var obj = {
        name: 'kimo',
        age: '20'
    };
    var {name : str} = obj;
    console.log(str);

    这里是将name的名字修改为了str。

    解构赋值如何进行默认值的设置呢?

    var obj = {
        name: 'kimo',
        age: '20'
    };
    var {c} = obj;
    console.log(c);

    由于c在obj中是不存在的,所以肯定会报未定义。

    var obj = {
        name: 'kimo',
        age: '20'
    };
    var {c = 100} = obj;
    console.log(c);

    这里设置为c=100,就是当这个值不存在的时候就会显示100,如果里面有值,则以原始值为准,默认值不生效。

    默认值也可配合重命名的方式来进行使用。

    var obj = {
        name: 'kimo',
        age: '20'
    };
    var {gender: g ="男"} = obj;
    console.log(g); //

    如何对数组进行解构赋值呢?

        var arr = '我是数组'.split('');
        console.log(arr)
        var [a,b,,c] = arr; //按照数据的顺序进行解构,如果不想输出当前值,就直接写,
        console.log(a,b,c); //我是组
  • 相关阅读:
    自己搭建一个vue项目
    nodejs 后台开发入门
    bootstrap table入门例子
    datatable入门
    猜数字案例
    Cookie
    管理系统案例
    PHP操作数据库(以MySQL为例)
    数据库(以MySQL为例)
    案例:音乐列表
  • 原文地址:https://www.cnblogs.com/qiuchuanji/p/9665467.html
Copyright © 2020-2023  润新知