参考

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. Centos7 升级 Ruby

    Centos7通过yum 安装的Ruby 是2.0版本.版本较低,需要升级到2.5以上版本. #yum 安装ruby yum install ruby #查看ruby版本 ruby -v 以下开始升级 ...

  2. Yii1打印当前请求所有执行的SQL及耗时

    我们在熟悉新的项目了解业务的时候,可以有很多方式.看项目文档说明:和了解项目身边的人沟通:通过自己度代码调试,但是一步步调试打印语句或许有点慢,如果可以调出当前请求的所有语句,那么很快可以熟悉他的业务 ...

  3. Shell data、timedatectl

     data系统时间管理命令 命令date +%F xxxx—xx--xx #查看当前日期. 命令date +%T xx:xx:xx #查看当前时间. 命令date +%y xx #年2位 命令date ...

  4. listview控件的使用

    listview控件是用于实现向上下两个方向翻动的界面(类似于QQ音乐查找歌手时的哪个界面),但是listview只是提供了一个空架子并没有什么实质的东西,那么这些东西要从哪里获得呢,那就要用到适配器 ...

  5. [ajax] - 上传图片,视频后的路径回传及确定逻辑

    业务场景1: 后台要上传视频,图片到网站的首页或者附页,上传后,视频,图片存储到服务器或cdn,但是此时还要加确定按钮以实现该视频,图片路径数据库的插入操作. 页面展现: 点击操作按钮,触发input ...

  6. 【Git】vs code+git 不使用ssh的链接remote server的方式

    git config --global user.name "dennis wu" git config --global user.email "email" ...

  7. HADOOP HA 踩坑 - 所有 namenode 都是standby

    报错: 无明显报错 状况: 所有namenode都是standby,即ZK服务未生效 尝试一:手动强制转化某个namenode为active 操作:在某台namenode上,执行 hdfs haadm ...

  8. js parseInt

    语法: parseInt(string, radix); string 要被解析的值.如果参数不是一个字符串,则将其转换为字符串(使用  ToString 抽象操作).字符串开头的空白符将会被忽略. ...

  9. Andorid Studio中运行模拟器--夜神模拟器

    这样可以直接在夜神模拟器上运行app然后在androidstudio上查看log…. 1.下载夜神模拟器 2.修改配置 点击右上角的设置图标,对夜神模拟器的分辨率进行选择,手机版的480×800的就差 ...

  10. MVC实战之排球计分(八)——软件制作总结

    此系列博客目的是制作一款排球计分程序.这系列博客将讲述此软件的 各个功能的设计与实现.到这篇博客,此系列博客就算是结束了. 在最后的这篇博客里 我们来做一些总结. 一,制作此程序,我们使用的是MVC框 ...