Javascript这个范围问题

时间:2011-01-14 06:06:25

标签: javascript scope closures this

我正在加载一个csv文件并解析它。我希望结果数组成为某个对象的成员,但它最终未定义,因为我没有正确使用“this”关键字。

function SimPlayer(){

    this.dataset = new Array();
    var client = new XMLHttpRequest();
    var dset = this.dataset;

    function handler(){
        if(client.readyState == 4){
            if(client.status == 200){
                //file is done loading
                //split by lines
                dset = client.responseText.split("\n");
                for(var i=0; i<dset.length; i++){
                    //split each line by commas
                    dset[i] = dset[i].split(",");
                    //convert to ints
                    for(var j=0; j<dset[i].length; j++){
                        dset[i][j] = parseInt(dset[i][j]);
                    }
                }
                //dset is defined here, no problem. It contains the data from the csv file
                console.log(dset[0]);
            }
        }
    }
    client.onreadystatechange = handler;
    client.open("GET", "http://nathannifong.com/LayerCake/simdata/rec0_i0.csv");
    client.send();

    this.check = function(){
        //does not work because this.dataset will be empty.
        console.log(this.dataset[0])
    }
}

假设我创建了一个SimPlayer实例,然后稍后调用check(在csv文件有时间加载之后)

foo = new SimPlayer();
//....time passes....
foo.check();

foo.check()导致

Uncaught TypeError: Cannot read property '0' of undefined

如何修复我的代码,以便在check()中,this.dataset将包含来自csv文件的数据?

2 个答案:

答案 0 :(得分:2)

您需要存储对此绑定的正确引用:

var _this = this;
this.check = function(){
    //does not work because this.dataset will be empty.
    console.log(_this.dataset[0])
}

答案 1 :(得分:1)

作为替代选项,您可以考虑以下示例:

this.check = (function(thus){
    return function() {//does not work because this.dataset will be empty.
       console.log(thus.dataset[0])
    };
})(this);
PS:我没有完全阅读原帖,我的例子 - 只是答案的另一种方式。您可以在许多JavaScript示例中找到此类代码。你应该理解使用闭包。