[JS] synchronous xmlhttprequest エラーについて

Monacaでアプリを作っているのですが、CSVを読み込む際にsynchronous xmlhttprequest 　のエラーが表示されます。

また、ググッた結果同期・非同期に問題があるようでしたので、はじめ falseだったものをtrueに変えたところ、undifindと出力されます。（まだ読み込みが終わっていなかったから？）

どうすれば、リストが表示されるでしょうか？

    <script>  

        function csv2Array(filePath) { //csvﾌｧｲﾙﾉ相対ﾊﾟｽor絶対ﾊﾟｽ
            var csvData = new Array();
            var data = new XMLHttpRequest();
            data.open("GET", filePath, true); //true:非同期,false:同期
            data.send(null);

            var LF = String.fromCharCode(10); //改行ｺｰﾄﾞ
            var lines = data.responseText.split(LF);
            for (var i = 0; i < lines.length; ++i) {
                var cells = lines[i].split(",");
                if (cells.length != 1) {
                    csvData.push(cells);
                }
            }
            return csvData;
        }

        var list = csv2Array("mydata.csv")
 
    
    document.addEventListener('click', function(){
        console.log(list[1])
    })
        
        
    </script>

退会済みユーザー

2019/03/11 12:56

回答は出揃ってると思うが、いかがだろう。解決済みにしては。

行動規範の内容に同意します

回答1件

Monacaは存じませんが参考まで

はじめ falseだったものをtrueに変えたところ、undifindと出力されます。（まだ読み込みが終わっていなかったから？）

そのとおりです.

XMLHttpRequestによるAjax通信を非同期で行う場合は, リソースの取得以降の処理をloadendイベントの発生を待ってから行います.

JavaScript
1function csv2Array(filePath) { //csvﾌｧｲﾙﾉ相対ﾊﾟｽor絶対ﾊﾟｽ
2    var csvData = new Array();
3    var data = new XMLHttpRequest();
4    data.open("GET", filePath, true); //true:非同期,false:同期
5    data.onloadend = function(e){
6        var LF = String.fromCharCode(10); //改行ｺｰﾄﾞ
7        var lines = data.responseText.split(LF);
8        for (var i = 0; i < lines.length; ++i) {
9            var cells = lines[i].split(",");
10            if (cells.length != 1) {
11                csvData.push(cells);
12            }
13        }
14        list = csvData;//リスナ関数から値を設定する
15    };
16    data.send(null);
17}
18var list;
19csv2Array("mydata.csv");
20
21document.addEventListener('click', function(){
22    console.log(list[1])
23})