js中的new做了什么事及实现方法

(1) 创建一个新对象;
(2) 将构造函数的作用域赋给新对象(因此 this 就指向了这个新对象) ;
(3) 执行构造函数中的代码(为这个新对象添加属性) ;
(4) 返回新对象。

var obj = new Base();

这样代码的结果是什么,我们在Javascript引擎中看到的对象模型是:


image.png

new操作符具体干了什么呢?其实很简单,就干了三件事情:

var obj  = {};
obj.__proto__ = Base.prototype;
Base.call(obj);
return obj;

第一行,我们创建了一个空对象obj
第二行,我们将这个空对象的proto成员指向了Base函数对象prototype成员对象
第三行,我们将Base函数对象的this指针替换成obj,然后再调用Base函数,于是Base的this就指向了这个obj对象
第四行,返回这个obj对象

用原生JS实现new方法

function New(fn) {
    const obj = Object.create(fn.prototype)
    const a = fn.apply(obj, Array.prototype.slice.call(arguments, 1))
    if (a instanceof Object) {
        return a
    }
    return obj
}
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 第一部分 HTML&CSS整理答案 1. 什么是HTML5? 答:HTML5是最新的HTML标准。 注意:讲述HT...
    kismetajun阅读 28,019评论 1 45
  • Lua 5.1 参考手册 by Roberto Ierusalimschy, Luiz Henrique de F...
    苏黎九歌阅读 14,737评论 0 38
  • 第一章 错误处理: 错误: 程序运行过程中,导致程序无法正常执行的现象(即bug) 现象: 程序一旦出错,默认会报...
    fastwe阅读 4,840评论 0 1
  • 概要 64学时 3.5学分 章节安排 电子商务网站概况 HTML5+CSS3 JavaScript Node 电子...
    阿啊阿吖丁阅读 13,115评论 0 3
  • 函数和对象 1、函数 1.1 函数概述 函数对于任何一门语言来说都是核心的概念。通过函数可以封装任意多条语句,而且...
    道无虚阅读 10,128评论 0 5