Question

我是JavaScript新手，尝试制作这个简单的画布演示：

var c; // typeof c is the canvas element
function SolarSystem(plane, sun) {

    this.plane = plane; // typeof plane is Canvas Ctxt
    this.sun = sun;

    this.init = function () {
        draw();
    }


    this.render = function () {
        c.height = c.height;
        requestAnimationFrame(this.render);
        this.draw();
    }

    this.draw = function () {
        console.log(1);
    }

}

我想要做的是，要渲染SolarSystem，我想调用它内部的render（）。我无法从render（）调用render（），如何在控制台中不获取Uncaught TypeError: Type error的情况下执行此操作？谢谢！

Answer 1

this.init = function () {
    draw();
}

draw()应为this.draw()，否则通过全局window对象调用该函数。

Answer 2

通常在对象中使用的是这条小线：

var self = this;

因为this根据您所在的范围而变化，self使得引用原始对象变得非常容易。然后，当您需要SolarSystem()对象之外的内容时，可以使用self.method()引用它。

您可能看不到示例中的好处，但如果/当您开始将范围应用于您的方法时，您将看到它的用途。 e.g。

function MyObject(){
  var self = this;

  var private = function(){
  };
  this.Public = function(){
    // try it at home:
    // call      `self.private();`
    // then call `this.private();`
  };
}

Answer 3

好的，正如Brad Christie所说的那样，我指的是函数的局部范围，而不是SolarSystem这个对象。以下工作完美。再次感谢！

function SolarSystem(plane, sun){

this.plane = plane;
this.sun = sun;

var self = this;

this.init = function(){
    self.draw();
}


this.render = function(){
    c.height = c.height; // reset canvas
    requestAnimationFrame(self.render);
    self.draw();
}

this.draw = function(){
    console.log(1);
}
}

在Object中调用JS函数

3 个答案: