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()和{}的区别的更多相关文章

  1. Object.create(null)、Object.create({})、{} 三者创建对象的区别

    参考 1.先看看我们经常使用的{}创建的对象是什么样子的: var o = {a:1}; console.log(o) 从上图可以看到,新创建的对象继承了Object自身的方法,如hasOwnProp ...

  2. [设计模式] JavaScript 之 原型模式 : Object.create 与 prototype

    原型模式说明 说明:使用原型实例来 拷贝 创建新的可定制的对象:新建的对象,不需要知道原对象创建的具体过程: 过程:Prototype => new ProtoExam => clone ...

  3. Object.create() vs new SomeFunction() in javascript

    Object.create builds an object that inherits directly from the one passed as its first argument. Wit ...

  4. js Object.create 初探

    1.作用 Object.create()方法创建一个新对象,使用现有的对象来提供新创建的对象的__proto__. https://developer.mozilla.org/zh-CN/docs/W ...

  5. 【前端】js中new和Object.create()的区别

    js中new和Object.create()的区别 var Parent = function (id) { this.id = id this.classname = 'Parent' } Pare ...

  6. 基本类型和引用类型调用是的区别(Object.create)

    var person = { name : 'jim', address:{ province:'浙', city:'A' } } var newPerson = Object.create(pers ...

  7. js中的new操作符与Object.create()的作用与区别

    js中的new操作符与Object.create()的作用与区别 https://blog.csdn.net/mht1829/article/details/76785231 2017年08月06日 ...

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

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

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

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

随机推荐

  1. python爬取全名k歌

    python3 爬取全名k歌 代码: import re import requests import ssl ssl._create_default_https_context=ssl._creat ...

  2. ionic3开发环境的搭建 记录!

    总的来说都很顺利,毕竟已经打包成功在手机上面跑起来了,给的两个教程很给力,基本没有误差,照着步骤敲没问题,打包命令有所更新目前已修正,吃一堑长一智下面说下其中遇到的问题:1.第一点是ionic ser ...

  3. tree与GridView交互

    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="OgGridView.asp ...

  4. Codeforces 803C. Maximal GCD

    题目链接:http://codeforces.com/contest/803/problem/C 中了若干trick之后才过... k个数的严格递增序列最小权值和就是${n*(n+1)/2}$,枚举这 ...

  5. 高阶函数 map、reduce、filter、sort 函数计算

    map() 循环遍历,返回一个新数组 ,reduce()把结果继续和序列的下一个元素做累积计算 把一个字符串13579先变成Array--[1, 3, 5, 7, 9],再利用reduce()就可以写 ...

  6. git push origin master 上传失败

    http://blog.csdn.net/llf369477769/article/details/51917557 按照网上教程用git把项目上传到github,但是在最后一步git push or ...

  7. 雷林鹏分享:url中加号引发的错误

    刚发现了博客的一个bug,标签页中一些标签带有空格,在url输出中使用了 urlencode 函数进行处理,导致空格被转换成了加号(+),这时通过url访问时会出现错误: 临时解决方法是在urlcod ...

  8. postgis 随笔

    一.表的定义:    对于任何一种关系型数据库而言,表都是数据存储的最核心.最基础的对象单元.现在就让我们从这里起步吧.    1. 创建表:    CREATE TABLE products (   ...

  9. JVM内存模型和GC机制

    目录 1.JVM内存模型 2.GC 1.JVM内存模型 堆,栈,本地方法栈,方法区,程序计数器 2.GC 新生代收集器:Serial(单线程).ParNew.Parallel Scavenge: 老年 ...

  10. python使用adb获取Android Phone截图(解决Windows传输编码导致png文件损坏的问题)

    使用adb命令 ./adb shell screencap -p 可以截取当前屏幕,并且作为stdout,传给外部.那么对于python,我们可以用如下代码获取数据流. 使用Popen创建子进程用于读 ...