d3 连接散点图示例，语法问题

Question

在这个例子中：https://observablehq.com/@d3/connected-scatterplot

第一段代码是这样开始的：

chart = {
  replay;

//...create svg element and setup the chart...

  return svg.node();
}

两个问题（如果这些问题很简单，我深表歉意，但我是 javascript 的新手，google 对我没有任何帮助）：

1) 图表看起来像一个函数，因为它有一个 return 语句，但没有函数关键字。如果我在我的烧瓶应用程序中为自己尝试这样的事情，当我放置 return 语句时会出错，因为它被评估为对象定义？这是什么 node.js 东西吗？

2) "replay;" 行在做什么？我在代码的其他地方没有看到任何对它的引用

编辑：我在这里找到了答案：https://observablehq.com/@observablehq/observables-not-javascript

简而言之，那个网站上的任何东西都不完全javascript，这在学习时真的很混乱D3.js而且几乎所有的例子都在那个网站上（而且上面的页面有点很难找到）。但我想这就是让人们在 observablehq 上订阅和开发而不是编写独立的网络应用程序的商业模式的一部分。

Answer 1

我为 Observable 工作，是的，“Observable’s not JavaScript” is the best thing to read on that. chart is declaring a reactive variable; it uses no keyword; it can be defined as a single expression, like x = d3.scaleLinear(), or as a curly-braces function block that returns a value, as you saw. You can download the notebook compiled into plain JavaScript by clicking “Download code” in the “⋯” menu in the upper right; here I’ve annotated the source 折线图示例。你可以在那里看到单元格如何被编译成一个普通的 JavaScript 函数，该函数传递了它所依赖的其他单元格的值。在那个“连接的散点图”示例中，如果您下载代码，chart 单元格的主体最终看起来像这样：

function(replay, d3, width, height, length, line, data, xAxis, yAxis, x, y, halo) {
  replay;
    
  //...create svg element and setup the chart...
      
  return svg.node();
}

反应性的工作方式是，只要它引用的其中一个单元格发生变化，就会重新评估每个单元格。 replay; 行利用它在您单击按钮时重新绘制散点图，这会触发其单击事件，从而触发反应性重新评估，即使它没有传递任何数据或被分配给变量或任何东西.

（我想这是一门生意，但我们真的在努力让这些东西的编码变得更容易！如果你有问题，很乐意聊天。）

d3 连接散点图示例，语法问题

d3 connected scatterplot example, question on syntax

javascript

d3.js

observablehq