美文网首页
一个例子 - 看懂JS中new关键字的实现原理

一个例子 - 看懂JS中new关键字的实现原理

作者: Jason_Zeng | 来源:发表于2019-08-21 13:18 被阅读0次
  1. new的实现代码如下:
// new的实现
function NewFn(fn) {
    // 判断是否有原型对象,并当作new的原型对象
    let proto = Object(fn.prototype) === fn.prototype ? fn.prototype : Object.prototype;
    // 利用原型创建new的对象
    let obj = Object.create(proto);
    // 把obj当作fn的this调用, 并解析去除fn在arguments里面的位置,剩余的传进去
    let res = fn.apply(obj, Array.prototype.slice.call(arguments, 1));
    // 判断返回的是否是对象
    if (Object(res) === res) { 
        // 是对象则返回经过fn处理过的res
        return res;
    }
    // 不是对象返回obj
    return obj;
}
  1. 测试用例如下
// 构造函数
function Foo(name) {
    this.name= name;
    this.go = function() {
        console.log(this.name +  " go");
    }
}
Foo.prototype.base = "mother";

// 测试用例
var foo = NewFn(Foo, "jason");
console.log(foo.name);
console.log(foo.base);
foo.go();
console.log(foo instanceof Foo);
  1. 输出结果
jason
mother
jason go
true

相关文章

  • 一个例子 - 看懂JS中new关键字的实现原理

    new的实现代码如下: 测试用例如下 输出结果

  • js学习札记-new关键字

    js 的new关键字解析的过程中引擎执行了很多步骤,我们可以自己写一个仿new的函数来实现new关键字。 说js ...

  • JS new 创建对象原理

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

  • js基础-new关键字

    js 的new关键字解析的过程中引擎执行了很多步骤,我们可以自己写一个仿new的函数来实现new关键字。 js n...

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

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

  • JS中new的原理及实现

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

  • JS 手写 new

    new 关键字作用 众所周知,js 中 new 关键字的作用就是创建一个构造函数的实例对象 如以下构造函数,使用 ...

  • 简单案例来看JS中的面向对象

    在JS中,一般情况下我们都是直接写函数,直接调用,但是发现JS中也有new关键字,那么new关键字作为创建对象的关...

  • 小记 - class类的继承 - 绚丽的小球

    这个小例子简单使用了js中的class关键字,并实现类的继承:先定义一个简单的、具有基础功能的球类Ball,然后定...

  • 创建对象

    js中没有类这个概念,与之对应的叫做对象。 new关键字相当于class关键字 js中,类和函数都是使用funct...

网友评论

      本文标题:一个例子 - 看懂JS中new关键字的实现原理

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