First, the preface
The JavaScript language has subtle differences under different browsers, but unlike DOM operations, it now lists one of the "for loops" differences and explains how to effectively resolve the differences.
Second, the problem description
In the following test code Example 1, the result of IE6 and chrome output is inconsistent, IE6 does not execute the code in the For statement
Copy Code code as follows:
Example 1:
Alert ("Ready to test if ToString is enumerated for loop")
var fortest = {Tostring:1}
For (i in Fortest) {
Alert ("ToString is cycled out")//under IE6 This is not performed, but in Chrome executes and outputs the result value "1"
}
Iii. Analysis of problems
The objects in JavaScript include ' toString ', ' valueof ', ' isprototypeof ', ' propertyisenumerable ', ' tolocalestring ', ' hasOwnProperty ' , the ' constructor ' 7 built-in methods. These 7 built-in methods cannot be enumerated with the for statement. However, IE6 and chrome support for built-in method overrides are inconsistent.
IE6: Although you can override the method on it, the for loop cannot be enumerated.
Chrome: The built-in overlay method can be used, and the For Loop can also enumerate the built-in methods covered.
So IE6 and Chrome browser output are inconsistent in the above test code example 1
iv. problem-solving
We have to solve the problem described above, we have to do two things:
Whether the browser used by the user supports the built-in method of the For loop to enumerate overrides
How to gracefully resolve incompatible issues so that all browsers can enumerate the built-in methods for loops
(Resolve code Example 2)
Copy Code code as follows:
Example 2:
Enumerables = True,
Fortest = {Tostring:1}
For (i in Fortest) {
Enumerables = null;
}
if (enumerables) {//These are properties of object objects, the for loop of some browsers (IE6) does not iterate over these attributes, so the properties are traversed by hand work.
Enumerables = [' hasOwnProperty ', ' valueof ', ' isprototypeof ', ' propertyisenumerable ',
' toLocaleString ', ' toString ', ' constructor '];
}
If Enumerables is null, the browser supports the built-in method of enumerating overrides, otherwise it can only be forced to copy the built-in methods to the new object, as the following code enforces.
/**
* All attributes are copied to the specified object
* @param the objects to be merged by {object} object
* @param {Object} Config Source property
* @return {Object} returns the merged object
*/
function apply (object, config) {
If (Object && config && typeof config = = = ' object ') {
var I, J, K;
The normal way to copy objects here
For (i in config) {
Object[i] = Config[i];
}
Compatible with multiple browsers the built-in attributes can be reset to a new object
if (enumerables) {
for (j = enumerables.length; j--;) {
k = Enumerables[j];
if (Config.hasownproperty (k)) {//Determine if the object has a specific property. This property must be specified with a string. (For example, Config.hasownproperty ("toString")
OBJECT[K] = config[k];
}
}
}
}
return object;
};
Now write a few test code to verify our results (test code example 3)
Copy Code code as follows:
Example 3:
var a={};
For (i in Fortest) {
A[i] = Fortest[i];
}
The Copy failure under alert (a.tostring)//ie6 can only be entered "native code", not the value of the output we overwrite
var b=apply ({},fortest)
Alert (b.tostring)//Use the Apply function, IE6 and chrome output values are the coverage we expect to get "1"
v. Summary
The author guesses that the For statement in IE6 identifies the 7 built-in functions to the ignored list, so how to overwrite them cannot be enumerated in the for, and chrome can intelligently copy the built-in functions that are overwritten.
Use the Apply function in code example 2 to resolve the problem of inconsistencies in the for loop under multiple browsers.
The author is a rookie, also rarely write a blog, if I express the wrong point of view, or a clerical error, please also please big birds to correct the error.
Vi. Frequently Asked questions
Q: Why not first determine whether the browser version is IE6, in order to set up the corresponding enumeration scheme?
A: My personal view is that I am not sure that there are so many browsers in the market (PC machine has n browser, there are mobile browsers, and later do not know what the new version of the browser) is the use of what mechanism for the language system. So we test the mechanism of the For statement first.
