Javascript 在构造函数中调用原型函数

Javascript calling prototype functions in constructor

本文关键字:原型 函数 调用 构造函数 Javascript      更新时间:2023-09-26

我不断收到一个错误,说当我尝试在构造函数中调用原型函数时,我的函数没有定义,我不知道它有什么问题。

这是我的代码:

function Renderer()
{
    initialiseWebGL();
    initialiseShader();
    initialiseBuffer();
}
Renderer.prototype.initialiseWebGL()
{
    //Do stuff.
};
Renderer.prototype.initialiseShader()
{
        //Do Shader's stuff
};
Renderer.prototype.initialiseBuffer()
{
        //Do Buffers
};

它有什么问题?

你的语法是错误的。使用这个:

function Renderer() {
    this.initialiseWebGL();
    this.initialiseShader();
    this.initialiseBuffer();
}
Renderer.prototype.initialiseWebGL = function () {
    //Do stuff.
};
Renderer.prototype.initialiseShader = function () {
        //Do Shader's stuff
};
Renderer.prototype.initialiseBuffer = function () {
        //Do Buffers
};

之后,您可以创建新对象并通过以下方式使用它:

var rendererInstance = new Renderer();

你的代码有一些问题

1. initialiseWebGl()会寻找在全局范围内声明的函数 ->没有函数

  • 您应该使用 this.initialiseWebGl() 来访问对象方法
    注意:在这种情况下,this是指Renderer的实例

2.您没有为函数分配Renderer.prototype.initialiseWebGL()而是尝试调用Renderer的原型方法initialiseWebGl这给您一个错误,因为它没有定义

3.由于{向下移动一行,因此它们被解释为块 ->因此执行此代码.
如果您在()之后使用它们,则会收到语法错误 -> Renderer.prototype.initialiseWebGL() {...会导致Uncaught SyntaxError: Unexpected token {

这是一个注释示例

function Renderer() {
    initialiseWebGL(); // I call the global declared function
    this.initialiseShader(); //I call the Prototypes function
    this.initialiseBuffer(); //Me too
}
Renderer.prototype.initialiseWebGL = function (){ //Here a function gets assigned to propertie of `Renderer`s `prototype` Object
    //Do stuff.
};
Renderer.prototype.initialiseShader = function (){
        console.log("Do Shader Stuff");
};
Renderer.prototype.initialiseBuffer = function (){
        console.log("Do initialise stuff");
};
 Renderer.prototype.initialiseBuffer() // I invoke the method above
{
 console.log("I'm a Block statement");
}; 
function initialiseWebGL () { //I'm the global declared function
  console.log("Global");
}
var ren1 = new Renderer();
/*"Do initialise stuff"  
"I'm a Block statement"  
"Global"  
"Do Shader Stuff"  
"Do initialise stuff"*/

正如您在控制台中看到的输出

这是一个JSBin

由于您的实例从原型对象继承了 (method) 属性,因此您需要将它们作为属性而不是普通变量进行访问:

function Renderer() {
    this.initialiseWebGL();
    this.initialiseShader();
    this.initialiseBuffer();
}