下载安卓APP箭头
箭头给我发消息

客服QQ:3315713922
论坛 >编程语言 >JavaScript 深入之new的模拟实现

JavaScript 深入之new的模拟实现

课课家iOS游客发布于 2017-07-28 09:36查看:692回复:1

     new

        一句话介绍 new:

        new 运算符创建一个用户定义的对象类型的实例或具有构造函数的内置对象类型之一

        也许有点难懂,我们在模拟 new 之前,先看看 new 实现了哪些功能。

        举个例子:

1501205243764820.jpg

       从这个例子中,我们可以看到,实例 person 可以:

      1. 访问到 Otaku 构造函数里的属性

      2. 访问到 Otaku.prototype 中的属性

        接下来,我们可以尝试着模拟一下了。

        因为 new 是关键字,所以无法像 bind 函数一样直接覆盖,所以我们写一个函数,命名为 objectFactory,来模拟 new 的效果。用的时候是这样的:

1501205668885432.jpg

     初步实现

        分析:

        因为 new 的结果是一个新对象,所以在模拟实现的时候,我们也要建立一个新对象,假设这个对象叫 obj,因为 obj 会具有 Otaku 构造函数里的属性,想想经典继承的例子,我们可以使用 Otaku.apply(obj, arguments)来给 obj 添加新的属性。

        在 JavaScript 深入系列第一篇中,我们便讲了原型与原型链,我们知道实例的 __proto__ 属性会指向构造函数的 prototype,也正是因为建立起这样的关系,实例可以访问原型上的属性。

        现在,我们可以尝试着写第一版了:

1501205747825695.jpg

在这一版中,我们:

      1. 用new Object() 的方式新建了一个对象 obj

      2. 取出第一个参数,就是我们要传入的构造函数。此外因为 shift 会修改原数组,所以 arguments 会被去除第一个参数

      3. 将 obj 的原型指向构造函数,这样 obj 就可以访问到构造函数原型中的属性

      4. 使用 apply,改变构造函数 this 的指向到新建的对象,这样 obj 就可以访问到构造函数中的属性

      5. 返回 obj



收藏(0)0
查看评分情况

全部评分

此主贴暂时没有点赞评分

总计:0

回复分享

版主推荐

    共有1条评论

    • 课课家运营团队
    • 酸酸~甜甜
    • Mr ken
    • YUI
    • cappuccino
    • mr jack
    • IT宅男
    • Mright
    • 课课家技术团队1
    • 选择版块:

    • 标题:

    • 内容

    • 验证码:

    • 标题:

    • 内容

    • 选择版块:

    移动帖子x

    移动到: