Use the for in loop in Javascript with hasOwnProperty

Compared with the in operator, for in traverses the prototype chain during the attributes of the loop object. for in does not read non-enumeration attributes, such as The length attribute of an array. Summary when detecting whether an object has a certain attribute, hasOwnProperty is the only method that can complete this task. in the for in loop, we recommend that you add hasOwnProperty for determination, it can effectively avoid errors caused by expanding the local prototype.

Compared with the in operator, for in traverses the prototype chain during the attributes of the loop object. for in does not read non-enumeration attributes, such as The length attribute of an array.

Copy codeThe Code is as follows: // extend Object. prototype
Object. prototype. bar = 1;
Var foo = {moo: 2 };
For (var I in foo ){
Console. log (I); // output bar and moo
}

We cannot change the behavior of the for in loop. When we need to filter some attributes in the loop body, we can use the hasOwnProperty method of Object. prototype to accomplish this.

Tip: Because the for in loop always traverses the entire prototype chain, the validity rate of objects that traverse multiple inheritance is low.

Use hasOwnProperty for filtering

Copy codeThe Code is as follows: // It still targets the foo object in the previous example.
For (var I in foo ){
If (foo. hasOwnProperty (I )){
Console. log (I );
}
}

In this example, because hasOwnProperty is used, moo is finally output. If hasOwnProperty is ignored, the code will output unexpected results because the local prototype (such as Object. prototype) has been extended.

The Prototype framework is a class library that extends the original Javascript Object and is widely used. Its disadvantages are also obvious. After the framework is introduced, if hasOwnProperty is not used for filtering and judgment, the output result is not what you want.

Best practices

We recommend that you always use hasOwnProperty to judge for in. No one can ensure that the running code environment is contaminated.

HasOwnProperty
To check whether an Object has custom attributes not on the prototype chain, it is necessary to use the hasOwnProperty method. Any Object has this method, which inherits from Object. prototype.

Tip: we cannot fully check whether an attribute is undefined because it may exist but its value is undefined. HasOwnProperty is the only method in Javascript that can process object attributes without traversing the prototype chain.

Copy codeThe Code is as follows: // extend Object. prototype
Object. prototype. bar = 1;
Var foo = {goo: undefined };

Foo. bar; // 1
'Bar' in foo; // true

Foo. hasOwnProperty ('bar'); // false
Foo. hasOwnProperty ('goo'); // true

Only hasOwnProperty provides the correct expected results. It is necessary to traverse the attributes of an object. There is no other way to exclude attributes defined on the object prototype chain.

HasOwnProperty as a property

Javascript does not protect hasOwnProperty as a keyword or reserved word. Therefore, if an object has an attribute of the same name, it is necessary to use the extended hasOwnProperty to obtain the correct result.

Copy codeCode: var foo = {
HasOwnProperty: function (){
Return false;
},
Bar: 'Here be dragons'
};
Foo. hasOwnProperty ('bar'); // always returns false
// Use another hasOwnProperty and set this to foo to call it
{}. HasOwnProperty. call (foo, 'bar'); // true

Summary
HasOwnProperty is the only method that can complete this task when detecting whether an object has a certain attribute. in the for in loop, we recommend that you add hasOwnProperty for determination, it can effectively avoid errors caused by expanding the local prototype.