将函数作为参数传递时,Javascript函数范围问题

时间:2013-02-12 17:25:25

标签: javascript class scope

如果我有以下内容:

var ScatterQuadrant = function ScatterQuadrant( id, _width, _height, methods )
{
    this.id = id;
    this.canvas = document.getElementById( id );
    this.canvas.width = _width;
    this.canvas.height = _height;   
    this.ctx = this.canvas.getContext( "2d" );
    methods();

}

function Init()
{
    var scatterQuad = new ScatterQuadrant( 
        "Frame", 800, 600, function()
        {      
            this.ctx.fillStyle = "#FF0000"; // this.ctx isn't going to work, but what will?
            this.ctx.fillRect( 0, 0, 150, 75 ); 
        }
    );

}

您会注意到我已将函数推入ScatterQuadrant函数,现在我想访问调用函数中的参数ctx。我将如何做到这一点(参见我在代码中的评论)

2 个答案:

答案 0 :(得分:2)

调用方法就像那样,将始终将this引用到全局对象undefined(ES5严格模式)。

您需要使用Function.prototype.call显式设置上下文,例如:

methods.call( this );

答案 1 :(得分:2)

看看MDN's introduction to the this keyword(它应该被称为“上下文”,“范围”是另一回事)。在您的情况下,使用call()就足够了:

methods.call(this);