es6---对象

发布时间:2019-08-09 发布网站:脚本宝典
脚本宝典收集整理的这篇文章主要介绍了es6---对象脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。

简洁写法

变量和函数均有简单写法

clipboard.png

简单写法的应用:
1、在commonJs模块中使用。
module.exports = {getITem,setItem,clear}
相当于
module.exports = {

getItem:getItem,
setItem:setItem,
clear:clear

}
2、避免由于是关键字而导致语法解析错误(自认为这点不太好)

VAR obj = {
    class () {}
}
相当于
var obj = {
    'class':function(){}
}

定义对象属性

定义对象属性有两种方法:
1、直接用标识符作为属性名。
2、用表达式作为属性名。

clipboard.png

字面量定义对象

es5写法:(只能用标识符的方法)

es6---对象

es6写法:(形式更加多样化)

es6---对象


(es6用表达式定义方法名

es6---对象

(注意:如果属性名表达式是对象,会自动将对象转为字符串)

es6---对象

方法的name属性

1、正常返回函数的函数名。

es6---对象

2、对象方法使用了取值函数(getter)和存值函数(setter)。

es6---对象

3、使用bind()函数时,name属性的返回值。
name属性会返回‘bound’加上原函数的名字。

es6---对象

4、对象方法是个Symbol值,name属性返回的是这个Symbol值。

es6---对象

对象常用方法

【1】Object.is() --->比较两个值是否相等。
避免了es5比较值的两个缺点:
1) +0和-0的问题。

es6---对象

2)NaN的问题

es6---对象

【2】Object.assign() --->将所有可枚举属性复制到目标对象。
注意:只有第一个参数是目标对象,其他参数都是对象。
目标对象与源对象有同名属性,后面的属性会覆盖前面的属性。

es6---对象

只有一个参数的情况:
1、直接将该参数返回。
![图片上传中...]

2、将不是对象的参数,先转化为对象。

es6---对象

3、用undefinednull作为参数,会报错。因为这两无法转换为对象。

es6---对象

但是如果undefined和null不作为首参数,是不会报错的,会把无法转为对象的跳过。

4、除了对象外,其他类型作为源参数,也不会报错。但只有字符串会以数组的形式复制到目标对象。

es6---对象

5、属性名为Symbol值的属性会被Object.assign复制。

es6---对象

Object.assign是浅复制

复制的只是对象引用,任何对象的变化都会反应到目标函数上。很多时候并不是开发者想要的结果。要注意使用。
(1)改变源对象中的值,也会改变目标对象中相应的值,因为是浅复制,复制的只是对象的引用。

es6---对象

(2)Object.assign是替换而不是添加。

es6---对象

(3)Object.assign可以用处理数组,但是会把数组当做对象来处理。

es6---对象

__PRoto__,Object.setPrototyPEOf,Object.getPrototypeOf

__proto__:用来读取和设置对象的prototype对象。
__proto__是内部属性,无论从语义还是兼容性都最好不用这个属性。它不是一个正式的对外的API

最好用setPrototypeOf和getPrototypeOf取代__proto__
setPrototypeOf()
1、将proto对象设置为obj对象的原型

es6---对象

2、这个方法会把第一参数转换为对象,所以undefined和null作为第一参数,会报错。

es6---对象

3、setPrototypeOf()方法会返回,返回的就是第一个参数。

es6---对象


getPrototypeOf()
读取某个对象的原型对象

es6---对象


同样:如果参数不是对象会被转换为对象,同理,undefined和null作为参数会报错。

es6---对象


Object.keys(),Object.values(),Object.entries()

1、Object.keys() 返回键名 --->返回的是一个数组

es6---对象

2、Object.values() 返回键值 --->返回的是一个数组
注意:返回的顺序是有规则的,如下图

es6---对象

3、Object.entries() 返回键值对 --->返回的是一个数组

es6---对象

注意:如果对象的属性名是一个Symbol值,该属性就会被忽略。

es6---对象


对象的扩展运算符

1、解构赋值是浅复制,复制的值的引用,而不是值的副本。

es6---对象

2、解构赋值不会复制继承自原型对象的属性。

es6---对象

脚本宝典总结

以上是脚本宝典为你收集整理的es6---对象全部内容,希望文章能够帮你解决es6---对象所遇到的问题。

如果觉得脚本宝典网站内容还不错,欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。