javascript - 以点开头的一行是什么意思？

Question

我正在阅读 Crafty tutorial并遇到了一个我找不到文档的代码片段。很难搜索标点符号。

有问题的第 11 和 12 行跟在 Crafty.e 行之后，以 .text 和 .css 开头。这些属性属于什么对象？

//the loading screen that will display while our assets load
Crafty.scene("loading", function () {
    //load takes an array of assets and a callback when complete
    Crafty.load(["sprite.png"], function () {
        Crafty.scene("main"); //when everything is loaded, run the main scene
    });

    //black background with some loading text
    Crafty.background("#000");
    Crafty.e("2D, DOM, Text").attr({ w: 100, h: 20, x: 150, y: 120 })
            .text("Loading")
            .css({ "text-align": "center" });
});

//automatically play the loading scene
Crafty.scene("loading");

这在规范中的什么位置？

Answer 1

以 . 开头的行只是在上一个函数/行的对象上调用的函数/属性。

---

在您的具体情况下，

Crafty.e("2D, DOM, Text").attr({ w: 100, h: 20, x: 150, y: 120 })
      .text("Loading")
      .css({ "text-align": "center" });

.text("Loading") 只是对 Crafty.e(...) 结果的函数调用。

类似地，.css({ "text-align": "center"}) 只是对上一行 .text("Loading").

因为它在同一行中，所以 .attr(...) 调用在外部不可见，但它与其他行中的其他内容完全相同。

---

在扩展术语中，上面的示例与执行此操作相同:

var eResult = Crafty.e("2D, DOM, Text");
var attrResult = eResult.attr({ w: 100, h: 20, x: 150, y: 120 });
var textResult = attrResult.text("Loading");
var cssResult = textResult.css({ "text-align": "center" });

---

正如其他人所说，这只是一种链接调用同一对象的方法 - 然而，请注意(!)这在所有编程语言中并不总是可行的。 jQuery 和许多其他 JavaScript 框架/库都采用这种方法来使开发更容易/更顺畅，因此，它在 JavaScript 开发中得到广泛应用。

在 JavaScript 中，真正的 语句终止是 ;(分号)。这意味着一个单个语句可以跨越多行。