JavascriptのforEachメソッドでオブジェクトの中身を<li>タグの中に1つずつ出力する方法

  • このエントリーをはてなブックマークに追加

前回の記事ではforEachを使って配列の中身を<li>の中に1つずつ出力するやり方を紹介しました。
今回はオブジェクトのキーや値を出力するやり方をまとめます。

エラーになる書き方

配列と同じような下記の書き方だとエラーが出てしまいます。

var obj = {
  a:'エー',
  b:'ビー',
  c:'シー',
}
obj.forEach(function(data,index){
	console.log(index+':'+data);
});
//Uncaught TypeError: obj.forEach is not a function

Object.keys() メソッドを使用することでエラーを回避

javascriptのオブジェクトの構造は上記の例でいうと、a、b、cが「キー」、エー、ビー、シーが「値」となり、それぞれついになって変数objに格納されています。この1セットのことを「プロパティ」と呼びます。

var obj = {
a:'エー',
b:'ビー',
c:'シー',
};
Object.keys(obj).forEach(function(key) {
console.log(key, obj[key]);
});
//a エー
//b ビー
//c シー

Object.keyメソッドを使用することで、値を取得することができました。

  • このエントリーをはてなブックマークに追加

SNSでもご購読できます。

コメントを残す

*

CAPTCHA