javascript - 原型(prototype)继承和 'this'的值

Question

我正在构建一个包含多个“模块”的应用。每个模块都需要一组相似的基本功能，因此我创建了一个基本模块，每个模块都将通过原型(prototype)继承从中继承。基本模块上的一些函数名称很长，并且由于经常使用这些函数，我想在每个模块中分配较短的名称，但这会导致将“this”的值设置为等于 DOMWindow 的问题。

请看下面的代码:

var SAMPLEAPP = SAMPLEAPP || {};

//This is a base module that I want all other modules to inherit from
SAMPLEAPP.Module = function(){

};

SAMPLEAPP.Module.prototype.someLongFunctionName = function(){
    console.log(this);
};


//This is a module that inherits from the base module
SAMPLEAPP.RouterModule= function(){
    var shortName = this.someLongFunctionName;

    //This correctly logs 'SAMPLEAPP.RouterModule', but I would rather not type 
    //out this long function name each time I need to use the function
    this.someLongFunctionName();

    //However, this code logs 'DOMWindow' when I would expect the value of 'this' 
    //to be the same as the direct call to this.someLongFunctionName
    shortName();
};

SAMPLEAPP.RouterModule.prototype = new SAMPLEAPP.Module();


new SAMPLEAPP.RouterModule();

我的问题:如何修改代码以便调用 shortName() 记录 SAMPLEAPP.RouterModule？如果可能的话，我宁愿改变模块的定义方式，也不愿改变对 shortName 的实际调用(即 shortname.call(this)，违背了为 someLongFunctionName 创建别名的目的)

Answer 1

正如其他人提到的，您可以使用 call 或 apply(两者都可以，区别仅在于如何将参数传递给函数)。

或者，您可以使用 ES5 bind方法，它将上下文绑定(bind)到函数(在本例中，上下文将是 this):

var shortName = this.someLongFunctionName.bind(this);

然后您可以像往常一样调用 shortName:

shortName();

这是一个 working example .这是 MDN 文章中最相关的部分:

The bind() function creates a new function (a bound function) with the same function body (internal Call attribute in ECMAScript 5 terms) as the function it is being called on (the bound function's target function) with the this value bound to the first argument of bind(), which cannot be overridden.