Talk about the Where in JS you need to be aware of

JS can traverse the dominant properties of an object or array, meaning that our own defined properties are the ones that can be traversed, those that are already on the prototype, for example: Object.prototype.toString, The Object.prototype.hasOwnProperty is not traversed.

The basic rules of for in are as follows, but there is a "pit" where we need attention:

1. The in loop out values are not necessarily sequential . The code is as follows:

var b = {3:1,42:2,11:3}forvar in b) {    alert (B[key])}

The order of the pop-up browser popup is: 1, 2, 3. The order of pop-up windows in modern browsers is 1, 3, 2.

2, the extension method on the prototype, will be out for the in. The code is as follows:

Object.prototype.test = "I am Test"var b = {"Name": "Txj"}forvar in b) {     + ":" + B[key])}

The method that we manually add to the prototype will be traversed for the in. In general, we do not need the properties of the prototype to traverse the object, so it is best to Object.prototype.hasOwnProperty the method when traversing.

3. Define the methods that are already in the prototype in the instance, and the browser for in case is inconsistent . The code is as follows:

var b = {"Name": "Txj"function() {alert ("I am ToString")}forvar inch b) {    + ":" + B[key])}

We have added a prototype to the B instance that has the method ToString. Modern browsers can recycle the ToString low-version browser but not. So when you give the instance a property name, do not match the original.

4, each browser loop out the order of the properties of different . The code is the same as in 2:

Object.prototype.test = "I am Test"var b = {"Name": "Txj"}forvar in b) {     + ":" + B[key])}

Modern browsers loop through the properties in the instance before looping through the properties in the prototype. The lower version of the browser is reversed.

This reminds me of a piece of code that jquery implements for the $.isplainobject () method:

// OWN Properties is enumerated firstly // if last one was own, then all properties are own. var Key  for inch obj) {}return key = = = Undefined | | Hasown.call (obj, key);

It says here that if the last property of an object is an instance of its own property, then all properties are instances of their own properties. This should not be true for low-version browsers. So jquery later added the following code fixes:

// support:ie<9 // Handle iteration over inherited properties before own properties. if (support.ownlast) {    for in  obj) {        return  hasown.call ( obj, key);}    }

Finally want to spit groove, generally do not add a custom method on the prototype; the loop of an array does not normally use the for in. Ha ha!

Talk about the Where in JS you need to be aware of