それぞれオブジェクトですか？

Question

可能性の重複：
Iterate over Object Literal Values

私はJavaScriptでのオブジェクトを持っている：

var object = someobject; 

Object { aaa=true, bbb=true, ccc=true } 

は、どのように私はこのためにそれぞれ使用することができますか？

object.each(function(index, value)) { 
     console.log(value); 
} 

動作しません。

Answer 1

javascriptオブジェクトには標準の.each関数がありません。 jQueryは関数を提供します。 http://api.jquery.com/jQuery.each/以下

$.each(object, function(index, value) { 
    console.log(value); 
}); 

別のオプションは、Object.keys()を使用してバニラJavascriptを使用することです。このような配列.map()機能

Object.keys(object).map(function(objectKey, index) { 
    var value = object[objectKey]; 
    console.log(value); 
}); 

がhttps://developer.mozilla.org/nl/docs/Web/JavaScript/Reference/Global_Objects/Object/keysとhttps://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map

これらは通常優れている参照してください動作するはず参照してください。バニラのJavascript for-loopを使用するよりも、通常のfor-loopを使用することの意味を理解していなければプロパティチェーンをループするような特性

通常、for-loopはjQueryまたはObject.keys().map()よりうまく機能しません。下のプレーンなfor-loopを使用することで、2つの潜在的な問題に取り掛かります。

---

右、そうも他の回答で指摘し、プレーンなJavascriptの選択肢は以下のようになり

for(var index in object) { 
    var attr = object[index]; 
} 

この2つの潜在的な問題があります。

1。見つかった属性がオブジェクト自体から来たものであり、プロトタイプチェーンからのものではないかどうかをチェックしたいとします。これには、

for(var index in object) { 
    if (object.hasOwnProperty(index)) { 
     var attr = object[index]; 
    } 
} 

は、より多くの情報のためhttps://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/hasOwnPropertyを参照してくださいのようなhasOwnProperty機能で確認することができます。

jQuery.eachとObject.keysの機能がこれを自動的に処理します。

2。プレーンなforループのもう1つの潜在的な問題は、スコープと非クロージャの問題です。これは少し複雑ですが、例えば次のコードを取ってください。私たちは、IDSのbutton0、ボタン1、ボタン2などとボタンの束を持っている、と我々はこのようなconsole.logそれらのonclickのを設定してやりたい：

<button id='button0'>click</button> 
<button id='button1'>click</button> 
<button id='button2'>click</button> 

var messagesByButtonId = {"button0" : "clicked first!", "button1" : "clicked middle!", "button2" : "clicked last!"]; 
for(var buttonId in messagesByButtonId) { 
    if (messagesByButtonId.hasOwnProperty(buttonId)) { 
     $('#'+buttonId).click(function() { 
      var message = messagesByButtonId[buttonId]; 
      console.log(message); 
     }); 
    } 
} 

場合は、いくつかの時間の後、我々はボタンのいずれかをクリックします私たちはいつも "最後にクリックされた"ようになるでしょう。コンソールで、そして決して "最初にクリックした！"または「クリックされた真中！どうして？onclick関数が実行される時点で、その時点でbuttonId変数を使用するmessagesByButtonId[buttonId]が表示されます。そしてそのループはその時点で終了しているので、buttonId変数は "button2"（最後のループ反復中に持っていた値）のままなので、messagesByButtonId[buttonId]はmessagesByButtonId["button2"]、つまり「最後にクリックされました！」になります。

クロージャの詳細については、https://developer.mozilla.org/en-US/docs/Web/JavaScript/Closuresを参照してください。特にこの例の最後の部分です。

ここでも、それはfunction(index, value)を提供してくれますのでjQuery.eachとObject.keys().map()は、私たちのために自動的にこの問題を解決する（つまり、閉鎖を持っている）ので、インデックスと値の両方を使用すると、彼らは我々が期待する価値を持っているので安心しても安全です。

Answer 2

for(var key in object) { 
    console.log(object[key]); 
} 

Answer 3

var object = { "a": 1, "b": 2}; 
 
$.each(object, function(key, value){ 
 
    console.log(key + ": " + object[key]); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>

//output 
a: 1 
b: 2