ES6学习教程之对象的扩展详解

一、 属性的简洁表示法

ES6允许直接写入变量和函数作为对象的属性和方法。意思就是说允许在对象中只写属性名,不用写属性值。这时,属性值等于属性名称所代表的变量。下面分别举一个例子来说明:

属性:

function getPoint(){ var x = 1 ; var y = 2; return {x,y} }

等同于

fucntion getPoint(x,y){ var x = 1 ; var y = 2; return {x:x,y:y} }

测试:

getPoint();//{x:1,y:10}

函数:

var obj = { fun(){ return "simply function"; } };

等同于

var obj = { fun: function(){ return "simply function"; } }

测试:

obj.fun();//simply function

二、属性名表达式

ES6里允许定义对象的时候用表达式作为对象的属性名或者方法名,即把表达式放在方括号里。

属性

let propKey = 'foo'; let obj = { [propKey] : true, ['a'+'bc'] : 123 }

测试:

obj.foo; //true obj.abc ; //123

方法

let obj = { ['h'+'ello'](){ return "hello world"; } }

测试:

obj.hello();//hello world

注意:

属性名表达式与简介表达式不能同时使用。

//错误的 var foo = 'bar'; var bar = 'abc'; var baz = { [foo] }; //正确 var foo = 'bar'; var baz = { [foo] : 'abc'}

三、方法的name属性

这个比较容易理解,直接阐述文字。

函数的name属性返回函数名。对象方法也是函数,因此也有函数名。

一般情况方法的name属性返回函数名

如果是取值函数会在函数名前加”get”

如果是存值函数会在函数名前加”set”

如果bind方法创建的函数会在函数名前加”bound”

如果是Function构造函数创建的函数,会在函数名前加”anonymous”

如果对象的方法是一个Symbol值,那么name属性返回的是这个Symbol值的描述*

四、Oject.is()

Object.is()用来比较两个值yan'ge严格相等。与严格比价运算符(===)的行为基本一致。不同之处只有两个:一是 +0 不等于 -0 ,二是NaN等于自身

+0 === -0 //true NaN === NaN //false Object.is(+0,-0);//false Object.is(NaN,NaN);//true

五、Oject.assign()

Object.assign()方法是用于将源对象的可枚举属性复制到目标对象。它至少需要两个参数,第一是目标对象,后面的全是源对象。

注意:

每个参数必须是对象,否则会报TypeError错误。

如果目标对象与源对象有同名属性,或多个源对象有同名的属性,则后面的属性会覆盖前面的属性

Object.assign只复制自身属性,不可枚举的属性和继承属性不会被复制

属性名为Symbol值的属性,也会被Object。assign复制。

demo:

var target = {a:1,b:2}; var source1 = {a:2,c:5}; var source2 = {a:3,d:6}; Object.assign(target,source1,source2); target//{a:3,b:2,c:5,d:6}

Object.assign可用于处理数组,但是会将其视为对象

Object.assign([1,2,3],[4,5]); //[4,5,3]

其他用处

为对象添加属性

为对象添加方法

克隆对象

合并多个对象

为属性指定默认值

六、属性的可枚举性

对象的没个属性都有一个描述对象(Descriptor),可通过Object.getOwnPropertyDescriptor(object,prop) ,object表示对象,prop表示对象的里的一个属性,用的时候需要加上引号。描述对象里面有个enumerable(可枚举性)属性,来描述该属性是否可枚举。

ES5中会忽略enumerable为false的属性

for…in循环:只遍历对象自身和继承的可枚举属性(包含继承)

Object.keys() :返回对象自身的所有可枚举属性的键名

Json.stringify() :只串行化对象自身的可枚举属性

ES6新增的操作

Object.assign() : 只复制对象自身的可枚举属性

Reflect.enumerate() : 返回所有for…in循环会遍历的属性(包含继承)

7. 属性的遍历

ES6中一共有6种方法可以遍历对象的属性。

for…in循环遍历对象自身和继承的可枚举的属性(不含Symbol属性)

Object.keys(obj)返回一个数组,包括对象自身的(不含继承的)所有可枚举属性(不含Symbol属性,但是包含不可枚举属性)

Object.getOwnPropertySymbols(obj)返回一个数组,包含对象自身的所有Symbol属性。

Relect.ownKeys(obj)返回一个数组,包含对象的所有属性,包含属性名是Symbol或者字符串,也不管是否可枚举。

Reflect.enumerate(obj)返回一个Iterator对象,遍历对象自身的和继承的所有可枚举属性(不含Symbol),与for…in相同

以上6种方法遍历对象的属性遵守同样的属性遍历次序规则

首先遍历所有属性名为数值的属性,按照数字排序

其次遍历所有属性名为字符串的属性,按照生成时间排序

最后遍历所有属性名为Symbol值的属性,按照生成时间排序

Reflect.ownkeys({[Symbol()]:0,b:0,10:0,2:0,a:0}) //[‘2','10','b','a',Symbol()]

八、 proto 属性,Object.setPrototypeOf(),Object.getPrototypeOf()

proto 属性

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wypwjz.html