Object.create(null)、Object.create({})、{} 三者创建对象的区别
1、先看看我们经常使用的{}
创建的对象是什么样子的:
var o = {a:1}; console.log(o)
从上图可以看到,新创建的对象继承了Object
自身的方法,如hasOwnProperty
、toString
等,在新对象上可以直接使用。
2、再看看使用Object.create(null)
创建对象:
var o = Object.create(null,{
a:{
writable:true,
configurable:true,
value:'1'
}
})
console.log(o)
可以看到,新创建的对象除了自身属性a之外,原型链上没有任何属性,也就是没有继承Object的任何东西,此时如果我们调用o.toString()
会报Uncaught TypeError
的错误。
大家可能会注意到,第一个参数使用了null。也就是说将null设置成了新创建对象的原型,自然就不会有原型链上的属性。
3、我们再把上面的例子改一改,将Object.create(null)改为Object.create({}):
var o = Object.create({},{
a:{
writable:true,
configurable:true,
value:'1'
}
})
console.log(o)
我们看到,这样创建的对象和使用{}
创建对象已经很相近了,但是还是有一点区别:多了一层proto
嵌套。
4、我们最后再来改一下:Object.create(Object.prototype)
var o = Object.create(Object.prototype,{
a:{
writable:true,
configurable:true,
value:'1'
}
})
console.log(o)
这次就和使用{}
创建的对象一模一样了。
5、使用Object.create(null)的理由:
使用create
创建的对象,没有任何属性,显示No properties
,我们可以把它当作一个非常纯净的map来使用,我们可以自己定义hasOwnProperty
、toString
方法,不管是有意还是不小心,我们完全不必担心会将原型链上的同名方法覆盖掉。
另一个使用create(null)
的理由是,在我们使用for..in
循环的时候会遍历对象原型链上的属性,使用create(null)
就不必再对属性进行检查了,当然,我们也可以直接使用Object.keys[]
。
Object.create(null)、Object.create({})、{} 三者创建对象的区别的更多相关文章
- 详解Object.create(null)
在Vue和Vuex的源码中,作者都使用了Object.create(null)来初始化一个新对象.为什么不用更简洁的{}呢? 在SegmentFault和Stack Overflow等开发者社区中也有 ...
- object.create(null) 和 {}创建对象的区别
原文 简书原文:https://www.jianshu.com/p/43ce4d7d6151 创建对象的方法 如果要创建一个空的对象,可以使用如下的三种方法 var obj1 = {}; var ob ...
- Object.create(null) 和 {} 区别
Object.create(null) 创建一个空对象,此对象无原型方法. {} 其实是new Object(),具有原型方法. 应用: 使用Object.create(null)的一个重要应用是:创 ...
- Object.create 以及 Object.setPrototypeOf
第一部分 Object.crate() 方法是es5中的关于原型的方法, 这个方法会使用指定的原型对象以及属性去创建一个新的对象. 语法 Object.create(proto, [ properti ...
- (转)es6中object.create()和object.assign()
今天学习javascript面向对象,在学习Obejct方法时了解到create方法,偶像想起之前使用的assign方法,顺带查找一番,感觉这篇博客讲解详细,遂转载. 先简单提一下装饰器函数,许多面向 ...
- vs变量监视提示-VAR-CREATE: UNABLE TO CREATE VARIABLE OBJECT解决方法
昨天有个linux应用在使用vs 远程debug的时候,debug可以正常进行,但是监视变量的时候提示-VAR-CREATE: UNABLE TO CREATE VARIABLE OBJECT,经测试 ...
- php错误:Uncaught exception com_exception with message Failed to create COM object
本文为大家讲解的是php错误:Uncaught exception com_exception with message Failed to create COM object,感兴趣的同学参考下. ...
- Object.create 和 Object.assign
Object.assign(target, ...source) 1.Object.assign方法只会拷贝源对象自身(不包括原型)的并且可枚举的属性到目标对象,使用源对象的get和目标对象的set, ...
- 设计模式之美:Null Object(空对象)
索引 意图 结构 参与者 适用性 效果 相关模式 实现 实现方式(一):Null Object 的示例实现. 意图 通过对缺失对象的封装,以提供默认无任何行为的对象替代品. Encapsulate t ...
随机推荐
- iOS项目之获取WebView的高度
获取高度值的方法: - (void)webViewDidFinishLoad:(UIWebView *)webView { // 获取webView的高度 CGFloat webViewHeight ...
- CRT/LCD/VGA Information and Timing
彩色阴极射线管的剖面图: 1. 电子QIANG Three Electron guns (for red, green, and blue phosphor dots)2. 电子束 Electron ...
- Vue基础进阶 之 自定义指令
自定义指令-----钩子函数 自定义指令 除了内置指令,Vue也允许用户自定义指令: 注册指令:通过全局API Vue.directive可以注册自定义指令: 自定义指令的钩子函数: bind: in ...
- Linux 系统最大TCP连接数 调优
Linux系统TCP最大连接数 Linux系统可接连接到最大的TCP连接数,高并发情况下可进行扩展加大,最大为65536. 限制最大TCP连接数 修改文件:/etc/sysctl.conf 生效命令: ...
- python从字符串中提取指定的内容
有如下字符串: text=cssPath:"http://imgcache.qq.com/ptlogin/v4/style/32",sig:"OvL7F1OQEojtPk ...
- [C++ Primer Plus] 第5章、循环和关系表达式(二)课后习题
1.编写一个要求用户输入两个整数的程序,将程序将计算并输出这两个整数之间(包括这两个整数)所有的整数的和.这里假设先输入较小的整数,例如如果用户输入的是2和9,则程序将指出2-9之间所有整数的和为44 ...
- [c/c++] programming之路(12)、循环结构
一.求2n #include<stdio.h> void main(){ ; ; while(n--){ s*=; printf("%d,%d\n",s,n); } g ...
- 如何快速实现 markdown 转 HTML 文档?
我想要在 Github 上开一个主题博客,我希望通过 Markdown 语法写作,然后生成 HTML 并附带自定义样式显示在网页上. 我找到了 gulp-markdown 这个库,看起来符合我的需求场 ...
- pandas之时间序列
Pandas中提供了许多用来处理时间格式文本的方法,包括按不同方法生成一个时间序列,修改时间的格式,重采样等等. 按不同的方法生成时间序列 In [7]: import pandas as pd # ...
- js Infinity 属性
Infinity 属性用于存放表示正无穷大的数值. 说明 无法使用 for/in 循环来枚举 Infinity 属性,也不能用 delete 运算符来删除它. Infinity 不是常量,可以把它设置 ...