JavaScript核心原理解析
周爱民
《JavaScript语言精髓与编程实践》作者,南潮科技(Ruff)首席架构师
立即订阅
3637 人已学习
课程目录
已更新 21 讲 / 共 21 讲
0/3登录后,你可以任选3讲全文学习。
开篇词 (1讲)
开篇词 | 如何解决语言问题?
免费
从零开始:JavaScript语言是如何构建起来的 (5讲)
01 | delete 0:JavaScript中到底有什么是可以销毁的
02 | var x = y = 100:声明语句与语法改变了JavaScript语言核心性质
03 | a.x = a = {n:2}:一道被无数人无数次地解释过的经典面试题
04 | export default function() {}:你无法导出一个匿名函数表达式
05 | for (let x of [1,2,3]) ...:for循环并不比使用函数递归节省开销
从表达式到执行引擎:JavaScript是如何运行的 (6讲)
06 | x: break x; 搞懂如何在循环外使用break,方知语句执行真解
07 | `${1}`:详解JavaScript中特殊的可执行结构
08 | x => x:函数式语言的核心抽象:函数与表达式的同一性
09 | (...x):不是表达式、语句、函数,但它却能执行
10 | x = yield x:迭代过程的“函数式化”
11 | throw 1;:它在“最简单语法榜”上排名第三
从原型到类:JavaScript是如何一步步走向应用编程语言的 (6讲)
12 | 1 in 1..constructor:这行代码的结果值,既可能是true,也可能是false
13 | new X:从构造器到类,为你揭密对象构造的全程
14 | super.xxx():虽然直到ES10还是个半吊子实现,却也值得一讲
15 | return Object.create(new.target.prototype):做框架设计的基本功:写一个根类
16 | [a, b] = {a, b}:让你从一行代码看到对象的本质
17 | Object.setPrototypeOf(x, null):连Brendan Eich都认错,但null值还活着
不定期加餐 (3讲)
加餐 | 捡豆吃豆的学问(上):这门课讲的是什么?
免费
加餐 | 捡豆吃豆的学问(下):这门课该怎么学?
免费
加餐 | 让JavaScript运行起来
免费
JavaScript核心原理解析
登录|注册

15 | return Object.create(new.target.prototype):做框架设计的基本功:写一个根类

周爱民 2019-12-18
你好,我是周爱民。
今天这一讲的标题呢,比较长。它是我这个专栏中最长的标题了。不过说起来,这个标题的意义还是很简单的,就是返回一个用Object.create()来创建的对象。
因为用到了return这个子句,所以它显然应该是一个函数中的退出代码,是不能在函数外单独使用的。
这个函数呢,必须是一个构造器。更准确地说,标题中的代码必须工作在构造过程之中。因为除了return,它还用到了一个称为元属性(meta property)的东西,也就是new.target
迄今为止,new.target是 JavaScript 中唯一的一个元属性。

为什么需要定义自己的构建过程

通过之前的课程,你应该知道:JavaScript 使用原型继承来搭建自己的面向对象的继承体系,在这个过程中诞生了两种方法:
使用一般函数的构造器;
使用 ECMAScript 6 之后的类。
从根底上来说,这两种方法的构建过程都是在 JavaScript 引擎中事先定义好了的,例如在旧式风格的构造器中(以代码new X为例),对象this实际上是由 new 运算依据X.prototype来创建的。循此前例,ECMAScript 6 中的类,在创建this对象时也需要这个X.prototype来作为原型。
取消
完成
0/1000字
划线
笔记
复制
© 版权归极客邦科技所有,未经许可不得传播售卖。 页面已增加防盗追踪,如有侵权极客邦将依法追究其法律责任。
该试读文章来自付费专栏《JavaScript核心原理解析》,如需阅读全部文章,
请订阅文章所属专栏。
立即订阅
登录 后留言

精选留言(3)

  • Astrogladiator-埃蒂纳度斯
    new.target为什么称为元属性,它与a.b(例如 super.xxx,或者’a’.toString)有什么不同?
    个人理解是new.target是用来描述构造器本身的属性,指代是当前这个构造器函数this, 它不属于实例对象的一部分,它可以由super函数传递至根类,并最终由根类创建带有子类实例的对象。

    作者回复: 谢谢。确实是正确答案之一。

    2019-12-19
    1
  • 行问
    这里的代码在 Chrome 或 Node 是报错的


    class MyClass extends Object {
      constructor() {
        return 1;
      }
    }

    function MyConstructor() {
      return 1;
    }


    console.log(new MyClass)
    console.log(new MyConstructor)

    作者回复: Oh... 这个问题在之前的课程中讲过,所以这里没有说很细。在第13讲中,

    > 因此到了 ECMAScript 6 之后,那些一般函数,以及非派生类,就延续了这一约定:使用已经创建的this对象来替代返回的无效值。
    > ... ...
    > 对于那些派生的子类(即声明中使用了extends子句的类),ECMAScript 要求严格遵循“不得在构造器中返回非对象值(以及 null 值)”的设计约定,并在这种情况下直接抛出异常。

    所以简单地说,就是如果class声明中不使用extends,那么它就跟你示例中的MyConstructor()一样,不会报错。而如果像你的MyClass那样使用了extends,就会报错了。

    2019-12-18
    1
  • qqq
    因为可以改变默认的原型继承行为
    2019-12-18
收起评论
3
返回
顶部