JavaScript函数别名似乎不起作用

一尘不染

JavaScript函数别名似乎不起作用

javascript

我只是在阅读这个问题，想尝试使用别名方法，而不是使用功能包装器方法，但是我似乎无法使其在Firefox 3或3.5beta4或GoogleChrome中在调试窗口和在测试网页中。

萤火虫：

>>> window.myAlias = document.getElementById
function()
>>> myAlias('item1')
>>> window.myAlias('item1')
>>> document.getElementById('item1')
<div id="item1">

如果将其放在网页中，则对myAlias的调用给我这个错误：

uncaught exception: [Exception... "Illegal operation on WrappedNative prototype object" nsresult: "0x8057000c (NS_ERROR_XPC_BAD_OP_ON_WN_PROTO)" location: "JS frame :: file:///[...snip...]/test.html :: <TOP_LEVEL> :: line 7" data: no]

Chrome（为清楚起见，插入了>>>）：

>>> window.myAlias = document.getElementById
function getElementById() { [native code] }
>>> window.myAlias('item1')
TypeError: Illegal invocation
>>> document.getElementById('item1')
<div id=?"item1">?

在测试页中，我得到了相同的“非法调用”。

难道我做错了什么？有人可以复制吗？

另外，奇怪的是，我刚刚尝试过，它可以在IE8中使用。

阅读 498

2020-04-25

共1个答案

一尘不染

您必须将该方法绑定到文档对象。看：

>>> $ = document.getElementById
getElementById()
>>> $('bn_home')
[Exception... "Cannot modify properties of a WrappedNative" ... anonymous :: line 72 data: no]
>>> $.call(document, 'bn_home')
<body id="bn_home" onload="init();">

当您做一个简单的别名时，该函数在全局对象上调用，而不是在文档对象上调用。使用称为闭包的技术来解决此问题：

function makeAlias(object, name) {
    var fn = object ? object[name] : null;
    if (typeof fn == 'undefined') return function () {}
    return function () {
        return fn.apply(object, arguments)
    }
}
$ = makeAlias(document, 'getElementById');

>>> $('bn_home')
<body id="bn_home" onload="init();">

这样，您就不会失去对原始对象的引用。

在2012年，bindES5提供了一种新方法，可以让我们以一种更奇妙的方式做到这一点：

>>> $ = document.getElementById.bind(document)
>>> $('bn_home')
<body id="bn_home" onload="init();">

2020-04-25