1.Object.is()

ES5 比较两个值是否相等,只有两个运算符:相等运算符(==)和严格相等运算符(===)。它们都有缺点,前者会自动转换数据类型,后者的NaN不等于自身,以及+0等于-0

Object.is就是部署这个算法的新方法。它用来比较两个值是否严格相等,与严格比较运算符(===)的行为基本一致。

Object.is('foo', 'foo')
// true
Object.is({}, {})
// false

不同之处只有两个:一是+0不等于-0,二是NaN等于自身。

+0 === -0 //true
NaN === NaN // false

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

2.Object.assign()

Object.assign方法用于对象的合并,将源对象(source)的所有可枚举属性,复制到目标对象(target)。

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

Object.assign方法的第一个参数是目标对象,后面的参数都是源对象。

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

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

常见用途

(1)为对象添加属性

class Point {constructor(x, y) {Object.assign(this, {x, y});
}
}

(2)为对象添加方法

Object.assign(SomeClass.prototype, {someMethod(arg1, arg2) {···
},
anotherMethod() {···
}
});

// 等同于下面的写法
SomeClass.prototype.someMethod = function (arg1, arg2) {···
};
SomeClass.prototype.anotherMethod = function () {···
};

(3)克隆对象

function clone(origin) {return Object.assign({}, origin);
}

(4)合并多个对象

const merge =
(target, ...sources) => Object.assign(target, ...sources);

如果希望合并后返回一个新对象,可以改写上面函数,对一个空对象合并

const merge =
(...sources) => Object.assign({}, ...sources);

(5)为属性指定默认值

const DEFAULTS = {logLevel: 0,
outputFormat: 'html'
};
function processContent(options) {options = Object.assign({}, DEFAULTS, options);
console.log(options);
 // ...
}

3. Object.setPrototypeOf()和Object.getPrototypeOf()

__proto__属性没有写入 ES6 的正文,而是写入了附录,原因是__proto__前后的双下划线,说明它本质上是一个内部属性,而不是一个正式的对外的 API,只是由于浏览器广泛支持,才被加入了 ES6。标准明确规定,只有浏览器必须部署这个属性,其他运行环境不一定需要部署,而且新的代码最好认为这个属性是不存在的。因此,无论从语义的角度,还是从兼容性的角度,都不要使用这个属性,而是使用下面的Object.setPrototypeOf()(写操作)、Object.getPrototypeOf()(读操作)、Object.create()(生成操作)代替。

Object.setPrototypeOf方法的作用与__proto__相同,用来设置一个对象的prototype对象,返回参数对象本身。它是 ES6 正式推荐的设置原型对象的方法。

let proto = {};
let obj = { x: 10 };
Object.setPrototypeOf(obj, proto);
proto.y = 20;
proto.z = 40;
obj.x // 10
obj.y // 20
obj.z // 40

Object.getPrototypeOf,用于读取一个对象的原型对象。

function Rectangle() { // ...
}
const rec = new Rectangle();
Object.getPrototypeOf(rec) === Rectangle.prototype
// true

Object.setPrototypeOf(rec, Object.prototype);
Object.getPrototypeOf(rec) === Rectangle.prototype
// false

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

var obj = { foo: 'bar', baz: 42 };
Object.keys(obj)
// ["foo", "baz"]
let {keys, values, entries} = Object;
let obj = { a: 1, b: 2, c: 3 };
for (let key of keys(obj)) {
console.log(key); // 'a', 'b', 'c'
}
for (let value of values(obj)) {
console.log(value); // 1, 2, 3
}
for (let [key, value] of entries(obj)) {
console.log([key, value]); // ['a', 1], ['b', 2], ['c', 3]
}

5.Object.fromEntries()

Object.fromEntries()方法是Object.entries()的逆操作,用于将一个键值对数组转为对象。

Object.fromEntries([['foo', 'bar'],['baz', 42]
])
// { foo: "bar", baz: 42 }

转载于:https://www.cnblogs.com/NatChen/p/10797024.html

ES6学习笔记(对象新增方法)相关推荐

  1. ES6学习笔记(五):轻松了解ES6的内置扩展对象

    前面分享了四篇有关ES6相关的技术,如想了解更多,可以查看以下连接 <ES6学习笔记(一):轻松搞懂面向对象编程.类和对象> <ES6学习笔记(二):教你玩转类的继承和类的对象> ...

  2. es6学习笔记-顶层对象_v1.0_byKL

    es6学习笔记-顶层对象_v1.0 (虽然是笔记,但是基本是抄了一次ruan大师的文章了) 顶层对象 顶层对象,在浏览器环境指的是window对象,在Node指的是global对象. ES5之中,顶层 ...

  3. ES6学习笔记04:Set与Map

    ES6学习笔记04:Set与Map JS原有两种数据结构:Array与Object,ES6新增两种数据结构:Set与Map 一.Set数据结构 Set类似于数组,但是成员值不允许重复,因此主要用于数据 ...

  4. es6学习笔记-字符串的扩展_v1.0_byKL

    es6学习笔记-字符串的扩展_v1.0 字符的Unicode表示法 JavaScript 允许使用uxxxx的形式表示一个字符,但在 ES6 之前,单个码点仅支持u0000到uFFFF,超出该范围的必 ...

  5. ES6学习笔记(三):教你用js面向对象思维来实现 tab栏增删改查功能

    前两篇文章主要介绍了类和对象.类的继承,如果想了解更多理论请查阅<ES6学习笔记(一):轻松搞懂面向对象编程.类和对象>.<ES6学习笔记(二):教你玩转类的继承和类的对象>, ...

  6. # es6 学习笔记

    es6 学习笔记 let变量 let和var用法级别一样 let不能重复声明,但是var可以 var varIns = "A"; var varIns = "B" ...

  7. ES6学习笔记03:变量的解构赋值

    ES6学习笔记03:变量的解构赋值 如果想从复杂数据结构(数组.对象)中获取某一个数据,可能需要大量的遍历操作才能完成.通过解构赋值,这一过程可以得到简化. 1.字符串的解构赋值 其实,Python也 ...

  8. ES6学习笔记01:Symbol数据类型

    ES6学习笔记01:Symbol数据类型 1.Symbol定义 浏览demo01.html: 2.Symbol作对象属性名 Symbol函数可以接收一个字符串作为参数,表示对Symbol实例的描述,输 ...

  9. HALCON 21.11:深度学习笔记---对象检测, 实例分割(11)

    HALCON 21.11:深度学习笔记---对象检测, 实例分割(11) HALCON 21.11.0.0中,实现了深度学习方法. 本章介绍了如何使用基于深度学习的对象检测. 通过对象检测,我们希望在 ...

  10. Python学习笔记Task11.魔法方法

    Python学习笔记Task11.魔法方法 魔法方法格式__init__ 1.基本 init(self[,-]) new(cls[,-]) del(self) str(self) repr(self) ...

最新文章

  1. Spring Boot全面总结(超详细,建议收藏)
  2. 122. Leetcode 647. 回文子串 (动态规划-子序列问题)
  3. Spring MVC 和 Spring 总结
  4. 读取CSV内容,根据不同的图片标签放到指定文件夹
  5. matlab基础试题,MATLAB基础试题题目及答案,课程2020最新期末考试题库,章节测验答案...
  6. Python_爬虫笔记_2018.3.19
  7. 海康威视 摄像头 RTMP 转 FLV
  8. 工具类:获取两个经纬度的距离(米)
  9. 前端好用的素材网站分享
  10. springboot的开发流程
  11. UE4导入外部插件方法
  12. vue-cli4引入Element Plus 插件
  13. 《如何阅读一本书》的梗概
  14. 开水果店前期投入,水果店会有哪些费用
  15. 造人先于造物——松下幸之助的人才观
  16. Delta tuning(只抓核心)
  17. 【SQL必知必会笔记(3)】SELECT语句的WHERE子句数据过滤操作
  18. Java:支付宝当面付demo(公钥证书方式)-沙箱环境测试版
  19. 开源Cortex-M模拟器QEMU的使用方法
  20. H7-TooL高速 DAPLINK仿真器,含全功能版 RTT Viewer

热门文章

  1. ARCH与GARCH模型
  2. Windows中使用包管理器(类似于apt/yum的) - Chocolatey
  3. 计算相同维度向量之间的欧氏距离
  4. 本地广播LocalBroadcastManager简单使用
  5. android webview 字体被放大,Android WebView文字大小调整及页面缩放调整
  6. [linux]linux IO 5种方式
  7. IDEACould not autowire. No beans of 'xxxMapper' type found.
  8. [转载]测试程序执行时间
  9. django+echarts+ajax异步+显示优化--基本例子
  10. 工作所思--IT新人