jQuery / Javascript：GET調用后變量未更新

Question

我正在嘗試從文本文件讀取並將其內部的信息放入數組。 但是，看來我做錯了。

var Level = function(ctx) {
    this.ctx = ctx;
    this.lvlWidth = 0;
    this.lvlHeight = 0;

    this.map = [];


    this.loadLevel = function(){
    var start = 0;
    var end = 0;
    this.lvlHeight = 25;
    this.lvlWidth = 21;

    $.get("1.txt", function(data){
        start = data.indexOf("0");
        end = data.lastIndexOf("#");
        this.map = data.slice(start, end - 2).split(" ");
    }, "text");

    console.log(this.map);
   };
}; // end Level 

在控制台上，它說我的變量this.map是一個空數組。 它不會自我修改，我也不知道為什么。 我檢查了其他答案，人們說如果不在函數外部聲明變量（在我的情況下為地圖），就會發生此問題，但您可以清楚地看到我這樣做了。 具有諷刺意味的是，this.lvlWidth和this.lvlHeight DO分別更改為21和25。 誰能告訴我為什么地圖不更新？

這是1.txt的信息（與該文件位於同一文件夾中）：

# startleveldata
0 0 0 0 0 0 0 0 0 113 21 113 0 0 0 0 0 0 0 0 0 
0 107 100 100 100 100 100 100 100 106 0 105 100 100 100 100 100 100 100 108 0 
0 101 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 101 0 
0 101 3 120 2 113 2 111 100 108 2 107 100 112 2 113 2 120 3 101 0 
0 101 2 2 2 101 2 2 2 101 2 101 2 2 2 101 2 2 2 101 0 
0 101 2 111 100 106 2 113 2 110 2 110 2 113 2 105 100 112 2 101 0 
0 101 2 2 2 2 2 101 2 2 2 2 2 101 2 2 2 2 2 101 0 
0 101 2 120 2 111 100 130 100 112 2 111 100 130 100 112 2 120 2 101 0 
0 101 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 101 0 
0 105 100 108 2 113 2 111 100 100 100 100 100 112 2 113 2 107 100 106 0 
0 0 0 101 2 101 2 2 0 0 10 0 0 2 2 101 2 101 0 0 0 
111 100 100 106 2 105 112 2 107 112 1 111 108 2 111 106 2 105 100 100 112 
20 0 0 0 2 0 0 2 101 11 12 13 101 2 0 0 2 0 0 0 20 
111 133 100 112 2 111 112 2 105 100 100 100 106 2 111 112 2 111 100 133 112 
0 101 2 2 2 0 0 2 0 0 0 0 0 2 0 0 2 2 2 101 0 
0 101 2 120 2 107 112 2 111 100 100 100 112 2 111 108 2 120 2 101 0 
0 101 2 2 2 101 2 2 0 0 4 0 0 2 2 101 2 2 2 101 0 
0 105 133 112 2 110 2 111 100 100 133 100 100 112 2 110 2 111 133 106 0 
0 0 101 2 2 2 2 2 2 2 101 2 2 2 2 2 2 2 101 0 0 
0 0 101 2 111 112 2 111 108 2 101 2 107 112 2 111 112 2 101 0 0 
107 100 106 2 2 2 2 2 101 2 101 2 101 2 2 2 2 2 105 100 108 
101 2 2 2 111 100 112 2 110 2 110 2 110 2 111 100 112 2 2 2 101 
101 3 120 2 2 2 2 2 2 2 2 2 2 2 2 2 2 2 120 3 101 
101 2 2 2 107 100 100 100 100 108 0 107 100 100 100 100 108 2 2 2 101 
105 100 100 100 106 0 0 0 0 110 21 110 0 0 0 0 105 100 100 100 106 
# endleveldata

編輯：我使它工作的家伙！ 問題是我需要調用一個回調函數，該函數將再次調用該函數。 按照用戶@ ACOMIT001的建議，我在$ .get（）之后使用了.then（）函數。 我提取了$ get函數，將其放在主程序中，並將其放在.then（）函數中，並將其稱為loadLevel（），然后它可以工作。 我無法真正解釋原因，但這現在對我有效。 謝謝大家的幫助/

Answer 1

$ .get是一個異步方法。 它被調用后立即返回，而不是等待服務器的響應。 因此，為什么this.map將為空。

嘗試這樣的事情：

var that = this;

$.get("1.txt", function(data){
    start = data.indexOf("0");
    end = data.lastIndexOf("#");
    that.map = data.slice(start, end - 2).split(" ");
}, "text").then(function () { 
    console.log(that.map); 
});

同樣如先前的回答所述，其范圍也在變化。

Answer 2

我認為這是因為您的范圍正在變化。 嘗試這個：

var that = this;
....
 $.get("1.txt", function(data){
    start = data.indexOf("0");
    end = data.lastIndexOf("#");
    that.map = data.slice(start, end - 2).split(" ");
}, "text");

console.log(that.map);

http://javascriptplayground.com/blog/2012/04/javascript-variable-scope-this/