JavaScript の for..in ループの落とし穴

R JavaScript の for..in サイクル トラップ

JavaScript には 2 つの方法があることは誰もが知っています:

(1) for ループ

(2) for..in サイクル;配列オブジェクトを反復するための for ループは誰にとっても一般的なものでなければなりません。ただし、for..in ループを使用する場合は、誰もが注意する必要があります。なぜそう言えるのでしょうか。皆さん、私の話を聞いてください...

javascript は、オブジェクトのプロパティまたは配列の各要素、for.. のプロパティを反復するために使用される特別なループ (つまり、for..in ループ) を提供します。 in ループ内のループ カウンタは数値ではなく文字列です。これには、現在のプロパティの名前または現在の配列要素のインデックスが含まれます。

ケース 1:

               //使用for..in循环遍历对象属性
 
               varperson={
 
                       name: "Admin",
 
                       age: 21,
 
                       address:"shandong"
 
               };
 
              
 
               for(vari in person){
 
                       console.log(i);
 
               }

実行結果は次のとおりです:

名前

年齢

住所

オブジェクトの走査 When 、変数 i (ループ) counter、オブジェクトの属性名

               //使用for..in循环遍历数组
 
               vararray = ["admin","manager","db"]
 
               for(vari in array){
 
                       console.log(i);
 
               }

実行結果:

0

1

2

配列を走査するとき、変数 i はループ数は現在の配列要素のインデックス

ケース 2:

しかし、for.. in ループは非常に使いやすいようですが、すぐに満足しすぎないでください。次の例:

                 var array =["admin","manager","db"];
 
                 //给Array的原型添加一个name属性
 
                 Array.prototype.name= "zhangsan";
 
                 for(var i in array){
 
                    alert(array[i]);
 
                 }

実行結果:

admin

manager

db

zhangsan

すごいですね、なぜ突然チャンサンが現れたのでしょうか

さて、もう一度 for ループを使用すると何が起こるでしょうか?

               vararray = ["admin","manager","db"];
 
                //给Array的原型添加一个name属性
 
               Array.prototype.name = "zhangsan";
 
               for(var i =0 ; i<array.length; i++){
 
                      alert(array[i]);
               };

実行結果:

admin

manager

db

ああ、理解できました、for..inループは特定の型のプロトタイプにメソッドを配置しますプロパティが反復処理されるため、コード内で予期しないエラーが発生する可能性があります。この問題を回避するには、オブジェクトの hasOwnProperty() メソッドを使用します。オブジェクトのプロパティまたはメソッドが継承されていない場合、hasOwnProperty() メソッドは true を返します。つまり、ここでのチェックには他のオブジェクトから継承されたプロパティやメソッドは含まれず、特定のオブジェクト自体で直接作成されたプロパティのみが含まれます。

ケース 3:

               vararray = ["admin","manager","db"];
 
               Array.prototype.name= "zhangshan";
 
               for(vari in array){
 
                      //如果不是该对象自身直接创建的属性（也就是该属//性是原型中的属性），则跳过显示
 
                       if(!array.hasOwnProperty(i)){
 
                               continue;
 
                        }
 
                        alert(array[i]);
 
               }

実行結果:

admin

manager

db

また来ます 相変わらずいいですね、ねえ、わかりません、同志の皆さん、これを読んでどう思いますか？「雲を追い払って晴れた空を見た」という気持ちはありますか？