JavaScript

レシピ

オブジェクト

オブジェクトの各キーごとに処理を実行する

オブジェクトの各プロパティごとに処理を実行する方法について解説します。

この記事のポイント

  • オブジェクトにfor...in文を使うとプロパティ名を1つずつ取り出すことができる
  • オブジェクト自身のプロパティのみ対象にしたいときはhasOwnPropertyメソッドを使う

オブジェクトのプロパティの数だけループを実行する

オブジェクトが持つ全てのプロパティに対して何らかの処理を実行したいときはfor…in文を使います。
オブジェクトに対してfor…in文を使うと、そのオブジェクトが持つプロパティを1つずつ取り出してプロパティ名を参照することができます。

以下の例ではPersonオブジェクトを定義してからインスタンス「John」を作成して、for…in文で全てのプロパティ名と値をconsole.logメソッドで出力します。

コード例

// 雛形になるオブジェクト「Person」を定義
var Person = function( id, name, job){
  this.id = id;
  this.name = name;
  this.job = job;
};
Person.prototype.id = 0;
Person.prototype.name = null;
Person.prototype.job = null;
Person.prototype.getId = function(){
  return this.id;
};
Person.prototype.getName = function(){
  return this.name;
};
Person.prototype.getJob = function(){
  return this.job;
};

var John = new Person( 15001, 'John', 'Fisherman');

for(var property_name in John) {
  console.log(property_name, John[property_name]);
}
// id 15001
// name John
// job Fisherman
// getId ƒ (){
//	return this.id;
// }
// getName ƒ (){
//	return this.name;
// }
// getJob ƒ (){
//	return this.job;
// }

上記の例はプロトタイプチェーンで継承した全てのプロパティを参照しますが、もしJohnオブジェクトが単体で持つプロパティのみを対象にしたい場合は、hasOwnPropertyメソッドを使って自身のプロパティかどうかを確認することで実現できます。

コード例

// 雛形になるオブジェクト「Person」を定義
var Person = function( id, name, job){
  this.id = id;
  this.name = name;
  this.job = job;
};
Person.prototype.id = 0;
Person.prototype.name = null;
Person.prototype.job = null;
Person.prototype.getId = function(){
  return this.id;
};
Person.prototype.getName = function(){
  return this.name;
};
Person.prototype.getJob = function(){
  return this.job;
};

var John = new Person( 15001, 'John', 'Fisherman');

for(var property_name in John) {
  if( John.hasOwnProperty(property_name) ) {
    console.log(property_name, John[property_name]);
  }
}
// id 15001
// name John
// job Fisherman

こちらの例ではPersonオブジェクトのインスタンスを作成するときにコンストラクタで設定した3つのプロパティ(idnamejob)のみ出力します。
これはインスタンス作成のタイミングで自身のプロパティとして設定されるためです。

一方で、プロトタイプチェーンで継承したメソッド(getIdgetNamegetJob)については自身のプロパティではないため出力しません。

今回はシンプルな出力処理のみ行いましたが、このループ処理をベースとすることでプロパティ1つ1つに対して値のチェック処理など必要な処理を実行することができます。

こちらの記事は役に立ちましたか?

ありがとうございます。
もしよろしければ、あわせてフィードバックや要望などをご入力ください。

コメントありがとうございます!
運営の参考にさせていただきます。