Question

我是一名学习JavaScript的初学者。阅读这个页面，我无法理解这段代码是如何定义一个对象的。我期待“foo：bar”构造，并且不确定__proto__是否是内置名称或在此处执行某些特殊操作。发生了什么事？

在ES2015中，扩展了对象文字以支持在构造时设置原型，foo：foo赋值的简写，定义方法，进行超级调用以及使用表达式计算属性名称。它们一起使对象文字和类声明更加紧密，让基于对象的设计从一些相同的便利中受益。 MDN
var obj = {
    // __proto__
    __proto__: theProtoObj,
    // Shorthand for ‘handler: handler’
    handler,
    // Methods
    toString() {
     // Super calls
     return "d " + super.toString();
    },
    // Computed (dynamic) property names
    [ 'prop_' + (() => 42)() ]: 42
};

Answer 1

对于普通的旧key: value符号，该代码段实际上是一堆syntactic sugar。

`proto: theProtoObj,`

是的，这是一个特殊字段，而不仅仅是一个任意名称。它是搜索继承树时使用的对象。它＆＃39;一般不鼓励明确使用。请阅读this Quora answer以便更好地了解它。

`handler,`

这是handler: handler的语法糖。通常，您希望在对象中有一个字段，并为具有相同名称的变量赋值，因此它们在规范中包含该缩写。

var x = 10;
var y = 15;

// longhand
var point = { x: x, y: y };

// shorthand
var point = { x, y };

`toString() {`

这是语法糖：

var obj = {
    toString: function () {
        ...
    }
};

`return "d " + super.toString();`

super关键字使父类的调用函数更加清晰。之前它看起来像这样：

var Person = function (name) {
    this.name = name;
}

var Engineer = function (name) {
    // "super call"
    Person.call(this, name);

    this.profession = 'Engineer';
}

现在看起来像这样：

class Engineer extends Person {
    constructor (name) {
        super(name);

        this.profession = 'Engineer';
    }
}

`[ 'prop_' + (() => 42)() ]: 42`

可能是我的最爱。此语法允许您在对象文字中包含动态键名。以前，你必须这样做：

var obj = {};
obj['prop_' + 42] = 42;

但是，使用动态文字语法，您可以这样做：

var obj = {
    ['prop_' + 42]: 42
};

`(() => 42)()`

语法糖：

// create an anonymous function and call it immediately
(function () {
    return 42;
})();

在对象文字中设置原型

1 个答案: