Object.create()与new操作符

最近几天在看ES6的东东,看到了对象的扩展运算赋值解构部分,对被扩展操作符应用的赋值解构变量与对象实际属性解构时候的对应关系产生了一点疑惑,所以着手研究了一下,写一写心得,防止之后再忘记或者混淆可以再回头来看看这篇文章 ,看下面例子:

const o = Object.create({ x: 1, y: 2 });
o.z = 3;

let { x, ...{ y, z } } = o;
x // 1
y // undefined
z // 3

上面代码中,变量x是单纯的解构赋值,所以可以读取对象o继承的属性;变量y和z是扩展运算符的解构赋值,只能读取对象o自身的属性,所以变量z可以赋值成功,变量y取不到值。

根据上面这段代码,我查找了Object.create()new操作符对于原型继承方面的知识。

这两个知识点涉及到__proto__prototype,可以点击下面链接了解一下。
Javascript原型与原型链的理解

Object.create()

我们先来看一下Object.create()在MDN上英文原话:

The Object.create() method creates a new object with the specified prototype object and properties.

  • 语法

Object.create(proto[, propertiesObject])

  • 参数描述

proto

The object which should be the prototype of the newly-created object

propertiesObject

Optional. If specified and not undefined, an object whose enumerable own properties (that is, those properties defined upon itself and not enumerable properties along its prototype chain) specify property descriptors to be added to the newly-created object, with the corresponding property names. These properties correspond to the second argument of Object.defineProperties()

  • 返回值

A new object with the specified prototype object and properties.

看着英文描述我们来模拟一下Object.create()在执行过程中做了哪些操作呢?
①创建一个空对象{}
②指定空对象的原型(__proto__)为Object.create()的参数({}.__proto__ = proto
③返回这个对象
Object.create()的第一个参数可以是对象也可以是函数,返回值的类型实际上都是Object。

var Base = function () {}
var o2 = Object.create(Base);

//console info
Base => //ƒ () {}
o2.__proto__ => // ƒ () {}
o2.prototype === Base.prototype => //true

var obj = {s:1,b:2};
var ty = Object.create(obj)

//console info
obj => // {s: 1, b: 2}
ty.__proto__ => // {s: 1, b: 2}
obj 与 ty 都是Object对象 没有prototype属性

new操作符

MDN对于 new操作符是这样解释的:

The new operator creates an instance of a user-defined object type or of one of the built-in object types that has a constructor function.

  • 语法

new constructor[([arguments])]

  • 参数描述

constructor

A class or function that specifies the type of the object instance.

arguments

A list of values that the constructor will be called with.

接下来我们模拟一下var o = new Foo();在执行过程中做了什么:

var o = new Object();
o.[[Prototype]] = Foo.prototype;
Foo.call(o);

①创建实例对象o
②指定o.__proto__ = Foo.prototype
③将 this 绑定到新创建的对象(Foo.call(o))

var Base = function () {}
var o1 = new Base();
//console info
Base.prototype ===  o1.__proto__  => //true

new 操作符只能对构造函数进行创建实例操作

  • 0
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值