Object.create()和new object()和{}的区别
Object.create()介绍
Object.create(null) 创建的对象是一个空对象,在该对象上没有继承 Object.prototype 原型链上的属性或者方法,例如:toString(), hasOwnProperty()等方法
Object.create()方法接受两个参数:Object.create(obj,propertiesObject) ;
obj:一个对象,应该是新创建的对象的原型。
propertiesObject:可选。该参数对象是一组属性与值,该对象的属性名称将是新创建的对象的属性名称,值是属性描述符(这些属性描述符的结构与Object.defineProperties()的第二个参数一样)。注意:该参数对象不能是 undefined,另外只有该对象中自身拥有的可枚举的属性才有效,也就是说该对象的原型链上属性是无效的。
var o = Object.create(Object.prototype, {
// foo会成为所创建对象的数据属性
foo: {
writable:true,
configurable:true,
value: "hello"
},
// bar会成为所创建对象的访问器属性
bar: {
configurable: false,
get: function() { return 10 },
set: function(value) {
console.log("Setting `o.bar` to", value);
}
}
});
console.log(o);//{foo:'hello'}
var test1 = Object.create(null) ;
console.log(test1);// {} No Properties
因为在bar中设置了configurable 使用set,get方法默认都是不起作用,所以bar值无法赋值或者获取
这里的o对象继承了 Object.prototype Object上的原型方法
我们可以 对象的 __proto__属性,来获取对象原型链上的方法 如:
console.log(o.__proto__);//{__defineGetter__: ƒ, __defineSetter__: ƒ, hasOwnProperty: ƒ, __lookupGetter__: ƒ, __lookupSetter__: ƒ, …}
console.log(test1.__proto__);//undefined
通过打印发现, 将{}点开,显示的是 No Properties ,也就是在对象本身不存在属性跟方法,原型链上也不存在属性和方法,
new object()
var test1 = {x:1};
var test2 = new Object(test1);
var test3 = Object.create(test1);
console.log(test3);//{}
//test3等价于test5
var test4 = function(){
}
test4.prototype = test1;
var test5 = new test4();
console.log(test5);
console.log(test5.__proto__ === test3.__proto__);//true
console.log(test2);//{x:1}
{}
var test1 = {};
var test2 = new Object();
var test3 = Object.create(Object.prototype);
var test4 = Object.create(null);//console.log(test4.__proto__)=>undefined 没有继承原型属性和方法
console.log(test1.__proto__ === test2.__proto__);//true
console.log(test1.__proto__ === test3.__proto__);//true
console.log(test2.__proto__ === test3.__proto__);//true
console.log(test1.__proto__ === test4.__proto__);//false
console.log(test2.__proto__ === test4.__proto__);//false
console.log(test3.__proto__ === test4.__proto__);//false
总结:使用Object.create()是将对象继承到__proto__属性上
var test = Object.create({x:123,y:345});
console.log(test);//{}
console.log(test.x);//123
console.log(test.__proto__.x);//3
console.log(test.__proto__.x === test.x);//true
var test1 = new Object({x:123,y:345});
console.log(test1);//{x:123,y:345}
console.log(test1.x);//123
console.log(test1.__proto__.x);//undefined
console.log(test1.__proto__.x === test1.x);//false
var test2 = {x:123,y:345};
console.log(test2);//{x:123,y:345};
console.log(test2.x);//123
console.log(test2.__proto__.x);//undefined
console.log(test2.__proto__.x === test2.x);//false
Object.create()和new object()和{}的区别的更多相关文章
- Object.create(null)、Object.create({})、{} 三者创建对象的区别
参考 1.先看看我们经常使用的{}创建的对象是什么样子的: var o = {a:1}; console.log(o) 从上图可以看到,新创建的对象继承了Object自身的方法,如hasOwnProp ...
- [设计模式] JavaScript 之 原型模式 : Object.create 与 prototype
原型模式说明 说明:使用原型实例来 拷贝 创建新的可定制的对象:新建的对象,不需要知道原对象创建的具体过程: 过程:Prototype => new ProtoExam => clone ...
- Object.create() vs new SomeFunction() in javascript
Object.create builds an object that inherits directly from the one passed as its first argument. Wit ...
- js Object.create 初探
1.作用 Object.create()方法创建一个新对象,使用现有的对象来提供新创建的对象的__proto__. https://developer.mozilla.org/zh-CN/docs/W ...
- 【前端】js中new和Object.create()的区别
js中new和Object.create()的区别 var Parent = function (id) { this.id = id this.classname = 'Parent' } Pare ...
- 基本类型和引用类型调用是的区别(Object.create)
var person = { name : 'jim', address:{ province:'浙', city:'A' } } var newPerson = Object.create(pers ...
- js中的new操作符与Object.create()的作用与区别
js中的new操作符与Object.create()的作用与区别 https://blog.csdn.net/mht1829/article/details/76785231 2017年08月06日 ...
- object.create(null) 和 {}创建对象的区别
原文 简书原文:https://www.jianshu.com/p/43ce4d7d6151 创建对象的方法 如果要创建一个空的对象,可以使用如下的三种方法 var obj1 = {}; var ob ...
- Object.create(null) 和 {} 区别
Object.create(null) 创建一个空对象,此对象无原型方法. {} 其实是new Object(),具有原型方法. 应用: 使用Object.create(null)的一个重要应用是:创 ...
随机推荐
- 每天一套题打卡|河南省第十届ACM/ICPC
A.谍报分析 题意:请你编程,快速统计出频率高的前十个单词. 思路:字符串输入,map哈希表map<string,int >记录每个单词出现的次数,pair重载优先级 #include&l ...
- 从零开始 CentOs 7 搭建论坛BBS Discuz_X3.2
由于公司项目需要一个互动平台,可以发起活动,发消息留言,讨论过后发现这竟然是一个论坛的功能. 于是就不打算耗费功夫开发相关功能,直接另外搭一套BBS算球... 一直觉得搭建BBS不是一件难事,目前有很 ...
- VMware15 安装centos7标准板
VM主页——>创建虚拟机——>典型——>下一步: 选择安装安装操作系统,进入选择客户机操作系统界面 选择Linux 版本centos7 64位: 下一步——>填写虚拟机名称, ...
- eclipse 下修改Dynamic Web Modulle 的问题
上图右侧圈中位置 有提示对应jdk版本. 若在eclipse修改Dynamic Web Modulle 为3.0失败,可以去项目工作空间文件中的.seting文件下修改: 上图对应的 <ins ...
- DLL 破解工具
1.Reflecter+Reflexil (第一类) 2.本文使用的工具下载地址为:(第二类) https://github.com/cnxy/dnSpy/archive/v4.0.0.zip 或 d ...
- spring+springmvc+hibernate 整合
三大框架反反复复搭了很多次,虽然每次都能搭起来,但是效率不高.最近重新搭了一次,理顺了思路,整理了需要注意的地方,分享出来. 工具:Eclipse(jdk 1.7) spring和hibernate版 ...
- Poj2018 Best Cow Fences
传送门 题目大意就是给定一个长度为 n 的正整数序列 A ,求一个平均数最大的,长度不小于 L 的子序列. 思路: 二分答案. Code: #include<iostream> #incl ...
- Kotlin 泛型
泛型,即 "参数化类型",将类型参数化,可以用在类,接口,方法上. 与 Java 一样,Kotlin 也提供泛型,为类型安全提供保证,消除类型强转的烦恼. 声明一个泛型类: cla ...
- webpack的安装及使用
webpack 是一个现代 JavaScript 应用程序的静态模块打包器(module bundler).当 webpack 处理应用程序时,它会递归地构建一个依赖关系图(dependency g ...
- NodeJS基础总结(一)
NodeJS官网网址:https://nodejs.org/en/ 使用require方法加载fs核心模块 var fs = require('fs'); 一.读取文件// 第一个参数就是尧读取的 ...