ES6学习笔记(对象新增方法)
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"]
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学习笔记(对象新增方法)相关推荐
- ES6学习笔记(五):轻松了解ES6的内置扩展对象
前面分享了四篇有关ES6相关的技术,如想了解更多,可以查看以下连接 <ES6学习笔记(一):轻松搞懂面向对象编程.类和对象> <ES6学习笔记(二):教你玩转类的继承和类的对象> ...
- es6学习笔记-顶层对象_v1.0_byKL
es6学习笔记-顶层对象_v1.0 (虽然是笔记,但是基本是抄了一次ruan大师的文章了) 顶层对象 顶层对象,在浏览器环境指的是window对象,在Node指的是global对象. ES5之中,顶层 ...
- ES6学习笔记04:Set与Map
ES6学习笔记04:Set与Map JS原有两种数据结构:Array与Object,ES6新增两种数据结构:Set与Map 一.Set数据结构 Set类似于数组,但是成员值不允许重复,因此主要用于数据 ...
- es6学习笔记-字符串的扩展_v1.0_byKL
es6学习笔记-字符串的扩展_v1.0 字符的Unicode表示法 JavaScript 允许使用uxxxx的形式表示一个字符,但在 ES6 之前,单个码点仅支持u0000到uFFFF,超出该范围的必 ...
- ES6学习笔记(三):教你用js面向对象思维来实现 tab栏增删改查功能
前两篇文章主要介绍了类和对象.类的继承,如果想了解更多理论请查阅<ES6学习笔记(一):轻松搞懂面向对象编程.类和对象>.<ES6学习笔记(二):教你玩转类的继承和类的对象>, ...
- # es6 学习笔记
es6 学习笔记 let变量 let和var用法级别一样 let不能重复声明,但是var可以 var varIns = "A"; var varIns = "B" ...
- ES6学习笔记03:变量的解构赋值
ES6学习笔记03:变量的解构赋值 如果想从复杂数据结构(数组.对象)中获取某一个数据,可能需要大量的遍历操作才能完成.通过解构赋值,这一过程可以得到简化. 1.字符串的解构赋值 其实,Python也 ...
- ES6学习笔记01:Symbol数据类型
ES6学习笔记01:Symbol数据类型 1.Symbol定义 浏览demo01.html: 2.Symbol作对象属性名 Symbol函数可以接收一个字符串作为参数,表示对Symbol实例的描述,输 ...
- HALCON 21.11:深度学习笔记---对象检测, 实例分割(11)
HALCON 21.11:深度学习笔记---对象检测, 实例分割(11) HALCON 21.11.0.0中,实现了深度学习方法. 本章介绍了如何使用基于深度学习的对象检测. 通过对象检测,我们希望在 ...
- Python学习笔记Task11.魔法方法
Python学习笔记Task11.魔法方法 魔法方法格式__init__ 1.基本 init(self[,-]) new(cls[,-]) del(self) str(self) repr(self) ...
最新文章
- Spring Boot全面总结(超详细,建议收藏)
- 122. Leetcode 647. 回文子串 (动态规划-子序列问题)
- Spring MVC 和 Spring 总结
- 读取CSV内容,根据不同的图片标签放到指定文件夹
- matlab基础试题,MATLAB基础试题题目及答案,课程2020最新期末考试题库,章节测验答案...
- Python_爬虫笔记_2018.3.19
- 海康威视 摄像头 RTMP 转 FLV
- 工具类:获取两个经纬度的距离(米)
- 前端好用的素材网站分享
- springboot的开发流程
- UE4导入外部插件方法
- vue-cli4引入Element Plus 插件
- 《如何阅读一本书》的梗概
- 开水果店前期投入,水果店会有哪些费用
- 造人先于造物——松下幸之助的人才观
- Delta tuning(只抓核心)
- 【SQL必知必会笔记(3)】SELECT语句的WHERE子句数据过滤操作
- Java:支付宝当面付demo(公钥证书方式)-沙箱环境测试版
- 开源Cortex-M模拟器QEMU的使用方法
- H7-TooL高速 DAPLINK仿真器,含全功能版 RTT Viewer
热门文章
- ARCH与GARCH模型
- Windows中使用包管理器(类似于apt/yum的) - Chocolatey
- 计算相同维度向量之间的欧氏距离
- 本地广播LocalBroadcastManager简单使用
- android webview 字体被放大,Android WebView文字大小调整及页面缩放调整
- [linux]linux IO 5种方式
- IDEACould not autowire. No beans of 'xxxMapper' type found.
- [转载]测试程序执行时间
- django+echarts+ajax异步+显示优化--基本例子
- 工作所思--IT新人