参考

1、先看看我们经常使用的{}创建的对象是什么样子的:

  var o = {a:1};

  console.log(o)

  从上图可以看到,新创建的对象继承了Object自身的方法,如hasOwnPropertytoString等,在新对象上可以直接使用。

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来使用,我们可以自己定义hasOwnPropertytoString方法,不管是有意还是不小心,我们完全不必担心会将原型链上的同名方法覆盖掉。

  另一个使用create(null)的理由是,在我们使用for..in循环的时候会遍历对象原型链上的属性,使用create(null)就不必再对属性进行检查了,当然,我们也可以直接使用Object.keys[]。  

Object.create(null)、Object.create({})、{} 三者创建对象的区别的更多相关文章

  1. 详解Object.create(null)

    在Vue和Vuex的源码中,作者都使用了Object.create(null)来初始化一个新对象.为什么不用更简洁的{}呢? 在SegmentFault和Stack Overflow等开发者社区中也有 ...

  2. object.create(null) 和 {}创建对象的区别

    原文 简书原文:https://www.jianshu.com/p/43ce4d7d6151 创建对象的方法 如果要创建一个空的对象,可以使用如下的三种方法 var obj1 = {}; var ob ...

  3. Object.create(null) 和 {} 区别

    Object.create(null) 创建一个空对象,此对象无原型方法. {} 其实是new Object(),具有原型方法. 应用: 使用Object.create(null)的一个重要应用是:创 ...

  4. Object.create 以及 Object.setPrototypeOf

    第一部分 Object.crate() 方法是es5中的关于原型的方法, 这个方法会使用指定的原型对象以及属性去创建一个新的对象. 语法 Object.create(proto, [ properti ...

  5. (转)es6中object.create()和object.assign()

    今天学习javascript面向对象,在学习Obejct方法时了解到create方法,偶像想起之前使用的assign方法,顺带查找一番,感觉这篇博客讲解详细,遂转载. 先简单提一下装饰器函数,许多面向 ...

  6. vs变量监视提示-VAR-CREATE: UNABLE TO CREATE VARIABLE OBJECT解决方法

    昨天有个linux应用在使用vs 远程debug的时候,debug可以正常进行,但是监视变量的时候提示-VAR-CREATE: UNABLE TO CREATE VARIABLE OBJECT,经测试 ...

  7. php错误:Uncaught exception com_exception with message Failed to create COM object

    本文为大家讲解的是php错误:Uncaught exception com_exception with message Failed to create COM object,感兴趣的同学参考下. ...

  8. Object.create 和 Object.assign

    Object.assign(target, ...source) 1.Object.assign方法只会拷贝源对象自身(不包括原型)的并且可枚举的属性到目标对象,使用源对象的get和目标对象的set, ...

  9. 设计模式之美:Null Object(空对象)

    索引 意图 结构 参与者 适用性 效果 相关模式 实现 实现方式(一):Null Object 的示例实现. 意图 通过对缺失对象的封装,以提供默认无任何行为的对象替代品. Encapsulate t ...

随机推荐

  1. 文件上传中UUID的解读

    UUID简介如下:1.简介UUID含义是通用唯一识别码 (Universally Unique Identifier),这 是一个软件建构的标准,也是被开源软件基金会 (Open Software F ...

  2. 6、Spring-Kafka4

    4.1. Using Spring for Apache Kafka This section offers detailed explanations of the various concerns ...

  3. centos7.3配置python2、3环境与配置各自pip

    环境:CentOS-7-x86_64-Everything-1611 No.1 查看CentOS对Python的默认依赖 [root@cs ~]# ls /usr/bin/python* /usr/b ...

  4. mysql 5.7 运维命令

    MySQL安装 1)卸载旧版本 a) 停掉mysql #pkill -9 mysqld b) 查看rpm包 # rpm -qa|grep -i mysql c) 删除 #yum -y remove m ...

  5. CBV与FBV

    FBV FBV(function base views)就是在 url 中一个路径对应一个函数 urls.py urlpatterns = [ url(r'^admin/', admin.site.u ...

  6. Endnote X8激活注册信息

    使用以下激活信息进行注册: Name:胡萝卜周 Organization:www.carrotchou.blog Product Key:3VHLX-TJJ74-SAM4N-38HEX-KNUCL 来 ...

  7. 关系数据库、NoSQL和NewSQL数据库产品分类

  8. 使用echarts时option可以复用的方法

    其实复用option很简单,在所要展示的图形在其他需求大致一致时,即可写一个option然后设置不同的地方就好了,坐标轴.series等都可以设置,具体代码如下: var barLeft = echa ...

  9. (转)决定系数R2

    有些讲得太烂了,我来通俗的梳理一下R2. Calculating R-squared 在线性回归的模型下,我们可以计算SE(line), SE(y均值). The statistic R2descri ...

  10. Flutter采坑之路 Run Configuration error:broken configuration due to unavailable

    今天把AndroidStudio升级成了3.3.1 原先还能编译成功的Flutter工程突然连编译都不行了, 错误是 Run Configuration error:broken configurat ...