ES6入门---第二单元 模块三:对象新增、

一:对象简洁语法:

1、变量简洁

javascript 复制代码
<script>
        let name = 'Strive';
        let age = 18;

        let json ={
            name,   //name:name,
            age     //age:age
        };

        console.log(json);

    </script>

2、函数简洁

javascript 复制代码
let json ={
            name,   //name:name,
            age,     //age:age
            /* showA:function(){
                return this.name;
            } */
            showA(){//不要用箭头函数
                return this.name;
            },
            showB(){
                return this.age;
            }
        };

3、有关解构

javascript 复制代码
   let x = 10;
        let y =20;
        function show({x,y}){
            console.log(x, y);
        }

        show({x,y})

二、对象新增

1、

Object.is(): 用来比较两个值是否相等

Object.is('a','a');

补充:JavaScript NaN 属性

NaN 属性是代表非数字值的特殊值。该属性用于指示某个值不是数字。可以把 Number 对象设置为该值,来指示其不是数字值。

提示:请使用 isNaN() 全局函数来判断一个值是否是 NaN 值。

Object.is(+0, -0); false

Object.is(NaN, NaN); false

2、Object.assign():

用途:

  1. 复制一个对象
  2. 合并参数

let 新的对象 = Object.assign(目标对象, source1, srouce2....)

原则:后覆盖前

例:

javascript 复制代码
 let json = {a:1};
        let json2 = {b:2, a:2};
        let json3 = {c:3};

        let obj = Object.assign({}, json, json2,json3);

        console.log(obj);

3、补充:

ES2017引入:

Object.keys()

Object.entries();

Object.values();

javascript 复制代码
  let {keys, values, entries} = Object;

        let json = {
            a:1,
            b:2,
            c:3
        };

        for(let key of keys(json)){
            console.log(key);
        }

        for(let value of values(json)){
            console.log(value);
        }

        for(let item of entries(json)){
            console.log(item);
        }

        for(let [key, val] of entries(json)){
            console.log(key, val);
        }

4、【ES2018】对象扩展运算符:...

javascript 复制代码
 let json = {a:3, b:4};

        let json2 = {...json};

        delete json2.b;
        console.log(json2);
        console.log(json);
相关推荐
一斤代码4 小时前
vue3 下载图片(标签内容可转图)
前端·javascript·vue
中微子4 小时前
React Router 源码深度剖析解决面试中的深层次问题
前端·react.js
光影少年5 小时前
从前端转go开发的学习路线
前端·学习·golang
中微子5 小时前
React Router 面试指南:从基础到实战
前端·react.js·前端框架
3Katrina5 小时前
深入理解 useLayoutEffect:解决 UI "闪烁"问题的利器
前端·javascript·面试
前端_学习之路6 小时前
React--Fiber 架构
前端·react.js·架构
伍哥的传说6 小时前
React 实现五子棋人机对战小游戏
前端·javascript·react.js·前端框架·node.js·ecmascript·js
qq_424409196 小时前
uniapp的app项目,某个页面长时间无操作,返回首页
前端·vue.js·uni-app
我在北京coding6 小时前
element el-table渲染二维对象数组
前端·javascript·vue.js
布兰妮甜6 小时前
Vue+ElementUI聊天室开发指南
前端·javascript·vue.js·elementui