问题

我不是d3.js专家，但我必须使用它来修改一个程序。

我没有找到对我的问题的好答案，我需要在解析之前修改一个文件：所以我使用了这段代码（**d3.js v4**）

```javascript
d3.text(file, function (d) {
    // 修改加载文件的内容
    d = d.replace(/ \(édito\)/g, "_edito")
         .replace(/ \(startup\)/g, "_startup");
    // 解析之后
    d3.csvParse(d, function (d) {
        console.log(d);
    });
});
console.log("next");

但问题是d3.text和d3.csv是异步的，所以 console.log("next") 在以 console.log(d) 逐行输出文件内容之前就执行了。

我怎样才能等待d3.txt的结果？ 在继续之前...并且不阻塞UI？

<details>
<summary>英文:</summary>

I am not expert in d3.js and i have to modify a program using it.

I have not found a good answer for my problem, i need to modify a file before to parse it: so i use this piece of code: (**d3.js v4**)

        d3.text(file, function (d) {
            //modify the content of file loaded
            d = d.replace(/ \(&#233;dito\)/g, &quot;_edito&quot;)
                .replace(/ \(startup\)/g, &quot;_startup&quot;);
            //parse after
            d3.csvParse(d, function (d) {
                console.log(d);
            });
        });
        console.log(&quot;next&quot;);

but the problem is d3.text, d3.csv are asynchronous and so `console.log(&quot;next&quot;)` is executed before the content of file line par line with `console.log(d)`. 

***How i can wait the result of d3.txt ?*** before to continue...and without blocking the UI

</details>


# 答案1
**得分**: 1

If you're reading a CSV file with D3 v4, then the recommend approach looks like so:

d3.csv("file.csv", function(error, data) {
  if (error) {
    throw error
  }
  else {
    ... do something with data
  }
});

Note that the handler is a function of two variables, the first of which is any error that might be thrown. The same is true of `d3.text`, but you have only one variable in your code that doesn't refer to the data, as you'd like.

I guess you might be using version 4 of D3 because you're dealing with legacy code or some such. The current version of v7, though, and there have been plenty of improvements. The API changed at v5 so that the suggested approach would now be.

d3.csv("file.csv").then(function(data) {
  ... do something with data
});

<details>
<summary>英文:</summary>

If you&#39;re reading a CSV file with D3 v4, then the recommend approach looks like so:

    d3.csv(&quot;file.csv&quot;, function(error, data) {
      if (error) {
        throw error
      }
      else {
        ... do something with data
      }
    });

Note that the handler is a function of two variables, the first of which is any error that might be thrown. The same is true of `d3.text`, but you have only one variable in your code that doesn&#39;t refer to the data, as you&#39;d like.

I guess you might be using version 4 of D3 because you&#39;re dealing with legacy code or some such. The current version of v7, though, and there have been plenty of improvements. The API changed at v5 so that the suggested approach would now be.

    d3.csv(&quot;file.csv&quot;).then(function(data) {
      ... do something with data
    });

</details>



# 答案2
**得分**: 0

事实上，如果我将所有下一个代码都设置在函数中，那么就没有问题。

```javascript
d3.text(file, function (d) {
    //修改加载文件的内容
    d = d.replace(/ \(&#233;dito\)/g, "_edito")
        .replace(/ \(startup\)/g, "_startup");
    //解析后
    var result = d3.csvParse(d, function (d) {
        console.log(d);
        return d;
    });
    goToNext(result)
});

function goToNext(datas){
    console.log(datas);
}

d3.text(file, function (d) {
    //modify the content of file loaded
    d = d.replace(/ \(édito\)/g, "_edito")
        .replace(/ \(startup\)/g, "_startup");
    //parse after
    var result = d3.csvParse(d, function (d) {
        console.log(d);
        return d;
    });
    goToNext(result)
});

function goToNext(datas){
    console.log(datas);
}