JavaScript：通过局部变量引用主机函数答案

【问题标题】：JavaScript: Referencing host function via local variable [duplicate]JavaScript：通过局部变量引用主机函数
【发布时间】：2011-06-22 10:57:46
【问题描述】：

可能重复：
JavaScript function aliasing doesn't seem to work

为什么这不起作用？

function foo() {

    var g = document.getElementById;

    g('sampleID');

}

Chrome 中抛出此错误：Uncaught TypeError: Illegal invocation
...在 Firefox 中：Error: uncaught exception: [Exception... "Illegal operation on WrappedNative prototype object"

它可以在 IE9 beta 中运行！！

演示： http://jsfiddle.net/ugBpc/

【问题讨论】：

JavaScript function aliasing doesn't seem to work的可能重复
你试过了吗，g.call(document, 'sampleID');??
@Pointy 不，我没有提前考虑 :)
@Pekka 我投票决定关闭它。那样可以么？我不想删除它，因为我担心它会从我的问题列表中删除，我想保留这个问题。
@Šime 是的，绝对！您的示例比另一个问题中的示例方式好，请保留此示例。

标签： javascript

【解决方案1】：

大多数浏览器要求在原始对象 (document) 的上下文中调用 document.getElementById 方法。所以这会起作用：

function foo() {      
    var g = document.getElementById;      
    g.call(document, 'sampleID');  
}

但是，这在 Internet Explorer 7 及更低版本中会失败，因为 DOM 方法不继承自 Function.prototype。您的原始示例应该适用于所有版本的 Internet Explorer。

您也可以在支持它的浏览器或您提供compatibility implementation 的浏览器中使用Function.prototype.bind：

function foo() {      
    var g = document.getElementById.bind(document);      
    g('sampleID');  
}

【讨论】：

+1。我建议不要这样做。如果document.getElementById() 太长，只需将其包装在一个名称较短的函数中，而不是尝试创建对宿主方法的引用。
@Tim Down：同意，我认为没有必要使用 bind 来处理这样的事情。我前段时间测试了性能，它在 Chrome 和 Firefox 中的速度要慢几个数量级（尽管我不确定为什么）。
@Tim 是的，这将是更合理的方式。