JavaScript如何从回调函数设置成员变量?

时间:2014-05-14 20:11:33

标签: javascript

我有一个自定义对象,需要使用XMLHttpRequest在后台对文件进行异步加载。

我已经设置了请求并正确调用它,获得对对象原型中定义的正确方法的响应。但我相信这个对象不是"实例"正确的对象。例如:

在Obj A上调用成员函数 函数执行并启动XMLHttpRequest。 XMLHttpRequest正确调用onload函数。 在设置的onload函数中,我更改了Obj A的属性。(如果你想知道,只需一个布尔值。) 这就是问题发生的地方,布尔实际上并没有改变到预期的状态。有解决方法吗?

编辑(已添加代码段):

/******************************************/
/* Callback to process the vertex shader. */
/******************************************/
Entity.prototype.onRecieveVertexShader = function(e)
{
    console.log("RECEIVED VERTEX SHADER");
    this.vertexShaderHandle = GL.createShader(GL.VERTEX_SHADER);
    GL.shaderSource(this.vertexShaderHandle, e.target.response);
    GL.compileShader(this.vertexShaderHandle);

    // This doesn't work.
    this.vertexShaderCompiled = true;
}

/********************************************/
/* Callback to process the fragment shader. */
/********************************************/
Entity.prototype.onRecieveFragmentShader = function(e)
{
    console.log("RECIEVED FRAGMENT SHADER");
    this.fragmentShaderHandle = GL.createShader(GL.FRAGMENT_SHADER);
    GL.shaderSource(this.fragmentShaderHandle, e.target.response);
    GL.compileShader(this.fragmentShaderHandle);

    // This doesn't work.
    this.fragmentShaderCompiled = true;
}

Entity.prototype.getAndCompileVertexShader = function(filename)
{
    var request = new XMLHttpRequest();
    request.open("GET", "shaders/" + filename, true);
    request.responseType = "text";
    request.onload = this.onRecieveVertexShader;
    request.send();
}

Entity.prototype.getAndCompileFragmentShader = function(filename)
{
    var request = new XMLHttpRequest();
    request.open("GET", "shaders/" + filename, true);
    request.responseType = "text";
    request.onload = this.onRecieveFragmentShader;
    request.send();
}

前两个功能是"不正确的回叫"工作。后两个是从"主线程"调用的。这些启动HTTP请求。

(添加调用这些函数的代码。)

function Custom3DObject(verts, indexes, normals)
{   
    Entity.call(this);

    this.vertices = verts;
    this.normals = normals;
    this.indices = indexes;

    console.log("CUSTOM 3D OBJECT USING: " + this.vertices.length / 3 + " VERTICES.");
    console.log("CUSTOM 3D OBJECT USING: " + this.normals.length / 3 + " NORMALS.");
    console.log("CUSTOM 3D OBJECT USING: " + this.indices.length + " INDICES.");

    this.WMatrix = mat4.create(); // Identity for now.
    this.VMatrix = mat4.lookAt([], [0, 0, -5], [0, 0, 1], [0, -1, 0]);
    this.PMatrix = mat4.perspective([], 45, 1280 / 720, 1, 20000);
    this.WVPMatrix = mat4.multiply([], this.VMatrix, this.WMatrix);
    this.WVPMatrix = mat4.multiply([], this.PMatrix, this.WVPMatrix);

    this.getAndCompileVertexShader("test_vertex_shader.vs");
    this.getAndCompileFragmentShader("test_fragment_shader.ps");
}

构造此对象的代码是:

this.entityArray.push(new Custom3DObject(sphere.verts, sphere.inds, sphere.norms));

1 个答案:

答案 0 :(得分:0)

我在这里找到答案:http://forums.mozillazine.org/viewtopic.php?f=19&t=243142&sid=d65b4924ba3b506ab0938886497f5272

基本上,在定义/设置我的回调函数“onload”之前,它说要定义一个变量var local = this;第一。所以我的功能现在看起来像这样:

Entity.prototype.getAndCompileVertexShader = function(filename)
{
    var request = new XMLHttpRequest();
    request.open("GET", "shaders/" + filename, true);
    request.responseType = "text";

    var local = this;

    request.onload = function(e) {

        console.log("RECEIVED VERTEX SHADER");
        local.vertexShaderHandle = GL.createShader(GL.VERTEX_SHADER);
        GL.shaderSource(local.vertexShaderHandle, e.target.response);
        GL.compileShader(local.vertexShaderHandle);

        local.vertexShaderCompiled = true;

    }
    request.send();
}

在回调函数中使用该新变量来访问成员(实例)数据。怪异。