美文网首页
JS中new的原理及实现

JS中new的原理及实现

作者: 脸滚键盘已成书 | 来源:发表于2020-02-21 11:14 被阅读0次

在调用new的过程中做了四件事:

1.新生成对象

2.链接到原型

3.绑定this

4.返回新对象

接下来就针对这几点,实现类似new的方法


//定义create方法

function create(){

//定义空对象

let obj = {};

//取出参数列表的第一个参数(构造函数)

let Con = [].shift.call(arguments);

//手动指正obj的构造函数为Con(链接原型)

obj.__proto__ = Con.prototype;

//调用Con,改变this为obj,传入剩余参数arguments

let result = Con.apply(obj,arguments);

//考虑到Con函数中有return的原因,需要对result进行判断

return result instanceof Object ? result : obj

}

现在便可以通过 create(构造函数,参数)来创建对象

注:

1.关于[].shift.call(arguments)

因为arguments是类数组对象,虽然有length属性,但是没有shift方法,故通过call方法改变执行上下文调用shift方法

2.关于obj.proto = Con.prototype

链接原型使用,proto是每个对象拥有的隐藏属性,指向它构造函数的原型,prototype是每个函数(Fuction.prototype除外)拥有的对象,二者关系这里就不赘述了

相关文章

  • JS中new的原理及实现

    在调用new的过程中做了四件事: 1.新生成对象 2.链接到原型 3.绑定this 4.返回新对象 接下来就针对这...

  • new 原理及模拟实现

    定义 new 运算符创建一个用户定义的对象类型的实例或具有构造函数的内置对象的实例。 ——(来自于MDN) 举个栗...

  • 实现js中的new

    观察 观察new的结果,rec1是一个对象,对象被赋予了构造函数的属性,并根据传参赋予属性相应的值。并且rec1的...

  • JS new 创建对象原理

    前言 怎么new一个对象呢?今天我们就来谈谈JS中,怎样使用new关键字创建一个对象及其实现原理。下文中涉及到的题...

  • js中的new操作符实现原理

    序言 这是前端进阶的文章,要想知道new的原理,必须深刻理解原型链、js继承的几种方式与及call、apply等相...

  • js new 运行机制

    js手札--js中new到底做了些啥JS核心系列:理解 new 的运行机制深入理解 Javascript 运行机制及原型

  • 实现js中new的功能

    首先看看new具有哪些功能: 创建一个对象,对象的原型指向构造函数的prototype。 构造函数里的this指向...

  • 复习笔记之API(15) JS动画

    [TOC] JS中的动画 动画实现原理 核心原理:通过定时器setInterval()不断移动盒子的位置实现步骤:...

  • new方法实现原理

    本小节知识: 【掌握】new方法实现原理 1.new方法实现原理 完整的创建一个可用的对象:Person *p=[...

  • 源码时代前端干货分享|new关键字底层原理-执行过程

    构造对象关键字:new 众所周知,js是用new来产生对象的,那么今天我们就来说说js里new产生对象的构造原理。...

网友评论

      本文标题:JS中new的原理及实现

      本文链接:https://www.haomeiwen.com/subject/tptcqhtx.html