javascript - 将函数作为参数传递时的 Javascript 函数范围问题

Question

如果我有以下情况：

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。我将如何去做（见我在代码中的评论）

Answer 1

看看MDN 对this关键字的介绍（应该叫“context”，“scope”是另外一回事）。在您的情况下，使用call()就足够了：

methods.call(this);

Answer 2

像这样调用方法，将始终引用this全局对象或undefined（ES5 严格模式）。

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

methods.call( this );