Is it safe to copy a reference to a native JavaScript method?

问题

For example

var w = document.getElementById;
var b = w('header');
var c = w('footer');
var d = w('body');

Edit: Semicolons are another one of those big arguments. I thought I would edit the question for fun.

Edit: Responses to Andrey's comments found on his answer.

"How does copying reference make it more effective with JS compilers?"
Response: JS compilers are to shorten and/or obfuscate code. If there were 40 calls to document.getElementById(..), it would be much more compact if they called getById(..) which would be renamed to something like O(..).

"Also, when you handle html element events, you usually specify a js method, and inside the method you put the logic, not directly in the html event handlers - that is not required but a good practice"
Response: I know. But we have many many web systems and they rarely follow good practice completely.

"Also, using built in methods directly makes the code way more readable" Response: Given these two examples, I think the latter is more readable

document.getElementById('total').value = document.getElementById('subtotal').value + document.getElementById('salestax').value - document.getElementById('discount').value
document.getElementById('yousaved').value = document.getElementById('discount').value / (document.getElementById('subtotal').value + document.getElementById('salestax').value)

var byId = document.getElementById
byId('total').value = byId('subtotal').value + byId('salestax').value - byId('discount').value
byId('yousaved').value = byId('discount').value / (byId('subtotal').value + byId('salestax').value)

回答1:

Did you mean

var w = document.getElementById

Thsi link explains in detail why you shouldn't do that: JavaScript function aliasing doesn't seem to work

回答2:

Well, it happens that it does not even work in Chrome. I suppose I could have tested it before posting up here. I get TypeError: Illegal invocation.

The alternative is instead of

var byId = document.getElementById

just use

function byId(a) {return document.getElementById(a)}

This is not as efficient,, but it is shorter and many compilers will have no trouble at all converting

function getElementById(id) {return document.getElementById(id)}

into

function q(a){return document.getElementById(a)}

Edit: Thanks to Andrey: I now know that the reason the first example did not work was because I was changing document.getElementById to window.getElementById.

The following works in my test and based on what I am reading, it should work everywhere.

var d = document
d.i = d.getElementById

回答3:

Actually it turns out that the compiler benefit is not useful in the event you are using gzip. gzip already has deduplication built in while looking for any string. So if every instance of document had a dot after it it would deduplicate the dot also.

In fact, if you have a variable with a string in it, Google Closure Compiler will -- by default -- replace all references to the variable with the string itself and remove the variable and assume that it will have made a profit with gzip's help.

See: https://groups.google.com/group/closure-compiler-discuss/browse_thread/thread/857bdaa095a8685e

来源：https://stackoverflow.com/questions/4880535/is-it-safe-to-copy-a-reference-to-a-native-javascript-method

标签

javascript

reference

native