JavaScript ES6中Object的新增方法
在 ES6 中,添加了Object.is()
、Object.assign()
、Object.keys()
、Object.values()
、Object.entries()
等方法。
1. Object.is()
Object.is()
方法用来判断两个值是否为同一个值。
使用语法如下,其中,value1
和value2
是比较的两个值。
Object.is(value1, value2);
Object.is()
方法返回一个布尔类型的值,若满足以下条件则两个值相等:
- 都是
undefined
- 都是
null
- 都是
true
或都是false
- 都是字符串,且相同长度、相同字符、相同顺序
- 是相同对象(每个对象有同一个引用)
- 都是数字,且满足以下任意一个
- 都是
0
- 都是
+0
- 都是
-0
- 都是
NaN
- 都非零,且非
NaN
,且是同一个值
- 都是
例如,如下代码,先定义了两个空对象obj1
和obj2
,虽然他们都是空对象,但对象是引用数据类型,存储的是对象的地址,所以它们是不相等的。
const obj1 = {};
const obj2 = {};
console.log(Object.is(obj1, obj2)); // false
但如果将同一个对象赋值给两个变量,那么两个变量中存储的都是同一个地址,所以他们是相等的。
const obj1 = {};
const value1 = obj1;
const value2 = obj1;
console.log(Object.is(value1, value2)); // true
Object.is()
方法与===
不同的地方在于,===
运算符将+0
和-0
视为相等,而将NaN
与NaN
视为不相等。
console.log(+0 === -0); // true
console.log(NaN === NaN); // false
同样的两个值,在Object.is()
方法中的结果:
console.log(Object.is(+0, -0)); // false
console.log(Object.is(NaN, NaN)); // true
2. Object.assign()
Object.assign()
方法用于将所有可枚举属性的值从一个或多个源对象分配到目标对象,并返回目标对象。
使用语法如下,target
是目标对象,sources
是源对象:
Object.assign(target, ...sources)
如下代码,将源对象obj2
合并到目标对象obj1
上,打印结果显示完成了合并。
同时,通过判断res === obj1
为true
,也说明了Object.assign()
改变了第一个参数的对象,即目标对象,也说明返回值是合并后的目标对象。
const obj1 = { a: 1 };
const obj2 = { b: 2 };const res = Object.assign(obj1, obj2);
console.log(res); // { a: 1, b: 2 }
console.log(res === obj1); // true
如下代码,如果目标对象和源对象中有相同的属性,那么源对象的属性将覆盖目标对象的属性:
const obj1 = { a: 1, b: 2 };
const obj2 = { a: 2 };const res = Object.assign(obj1, obj2);
console.log(res); // { a: 2, b: 2 }
3. Object.keys()
Object.keys()
方法会返回一个由一个给定对象的自身可枚举属性组成的数组,数组中属性名的排列顺序和正常循环遍历该对象时返回的顺序一致 。
语法如下,obj
是待枚举的对象:
Object.keys(obj)
如下代码,遍历对象obj
的属性,并返回一个数组:
const obj = { a: 1, b: 2, c: 3, d: 4 };const res = Object.keys(obj);
console.log(res); // [ 'a', 'b', 'c', 'd' ]
注意,Object.keys()
只能遍历到可枚举属性,有如下代码,通过Object.defineProperty
给对象obj
添加了一个属性e
,但没有添加配置项enumerable
为true
,那么这个新添加的属性e
就是不可枚举的,使用Object.keys()
方法是遍历不到e
的:
const obj = { a: 1, b: 2, c: 3, d: 4 };Object.defineProperty(obj, 'e', {value: 5,
});const res = Object.keys(obj);
console.log(res); // [ 'a', 'b', 'c', 'd' ]
有关Object.defineProperty
的更多说明,请看「JavaScript中的Object.defineProperty()方法」。
4. Object.values()
Object.values()
方法返回一个给定对象自身的所有可枚举属性值的数组,排列顺序和正常循环遍历该对象时返回的顺序一致 。
语法如下,obj
是待枚举的对象:
Object.values(obj)
如下代码所示,Object.values()
也只能遍历可枚举属性的值:
const obj = { a: 1, b: 2, c: 3, d: 4 };Object.defineProperty(obj, 'e', {value: 5,
});const res = Object.values(obj);
console.log(res); // [ 1, 2, 3, 4 ]
5. Object.entries()
Object.entries()
方法相当于Object.keys()
和Object.values()
的结合,它返回一个给定对象自身可枚举属性的键值对数组。
语法如下,obj
是待枚举的对象:
Object.entries(obj)
如下代码所示,Object.entries()
也只能遍历可枚举属性的键值对:
const obj = { a: 1, b: 2, c: 3, d: 4 };Object.defineProperty(obj, 'e', {value: 5,
});const res = Object.entries(obj);
console.log(res); // [ [ 'a', 1 ], [ 'b', 2 ], [ 'c', 3 ], [ 'd', 4 ] ]
参考:
「MDN」
JavaScript ES6中Object的新增方法相关推荐
- JavaScript中Object.prototype.toString方法的原理
在JavaScript中,想要判断某个对象值属于哪种内置类型,最靠谱的做法就是通过Object.prototype.toString方法. <一>, ECMAScript 3 1. 在E ...
- es6字符串添加html标签,JavaScript_详解JavaScript ES6中的模板字符串,在 ES6 中引入了一种新的字符 - phpStudy...
详解JavaScript ES6中的模板字符串 在 ES6 中引入了一种新的字符串字面量 - 模板字符串,除了使用反引号 (`) 表示,它们看上去和普通的字符串没有什么区别.在最简单的情况下,他们就是 ...
- js模板字符串自定义类名_详解JavaScript ES6中的模板字符串
这篇文章主要介绍了详解JavaScript ES6中的模板字符串,JS的ES6版本带来诸多简洁化方面的重大改进,需要的朋友可以参考下 在 ES6 中引入了一种新的字符串字面量 - 模板字符串,除了使用 ...
- JavaScript文件中调用AngularJS内部方法或改变$scope变量
需要在其他JavaScript文件中调用AngularJS内部方法或改变$scope变量,同时还要保持双向数据绑定: 首先获取AngularJS application: 方法一:通过controll ...
- 关于es6中常见的一些方法----对象篇
好了,话不多说,是骡子是马拉出来溜溜,这篇文章笔者就来简单介绍下关于对象的一些方法 1.Object.is() Object.is() 方法判断两个值是否是相同的值. 参数: value1: 第一个需 ...
- 5个技巧让你更好的编写 JavaScript(ES6) 中条件语句
使用 JavaScript 时,我们经常需要处理很多条件语句,这里分享5个小技巧,可以让你编写更好/更清晰的条件语句. 1.使用 Array.includes 来处理多个条件 我们来看看下面的例子: ...
- ES6中的Promise使用方法与总结
在javascript中,代码是单线程执行的,对于一些比较耗时的IO操作,都是通过异步回调函数来实现的. 但是这样会存在一个问题,当下一个的操作需要上一个操作的结果时,我们只能把代码嵌到上一个操作的回 ...
- ES6中object对象属性
//es5中定义对象属性要么字面量.要么点.要么[],变量与空格在这些方法中没有得到好的支持 /在es6中可以这么定义: let w='www'; let obj1={w};//obj1={w:'ww ...
- [译]JavaScript:ES6中的模板字符串简介
原文:http://tc39wiki.calculist.org/es6/template-strings/ ES6中的模板字符串(template string)是一种能在字符串文本中内嵌表达式的字 ...
最新文章
- 堆(heap)与栈(stack)的区别(一)
- Codeforces 1322D Reality Show (DP)
- wow服务器已满 队列位置5,《魔兽世界》前夕版本中“碧空之歌”排队人数近万,有必要排吗?...
- C语言:L1-031 到底是不是太胖了 (10分)(解题报告)
- gulp自动添加版本号
- 分布式架构的王者?Kubernetes凭什么
- char*,const char*和string的相互转换
- 在VS 2010中查询和导航代码
- IntelliJ IDEA 2016
- 大佬们不会告诉你的史上最全的Java进阶书籍推荐
- c语言学习指南app,c语言学习手册app
- 华盛顿大学计算机专业gpa,华盛顿大学计算机专业基本信息全盘点 学习来这里就对了...
- 【机器学习】数据驱动方法在电网稳定分析应用浅谈
- net::ERR_INTERNET_DISCONNECTED
- 非线性光学散射偏微分方程组的matlab求解仿真
- 【量化入门】通过几种常见的量化策略框架,学习量化炒股
- G、S、C、P、T STATE
- STM32中断向量表的位置,重定向
- matlabGUI神经网络系统设计
- Process terminated以及出现Dependency not found的情况
热门文章