JavaScript in operator.
in演算子は、主に2つの使い方があります。
in演算子は、上記のような使い方をすることができます。
基本的にオブジェクトに対して使われる演算子だと考えておくと良いようです。
まず、in演算子はオブジェクトにプロパティが存在するか判定する際に使われます。
例えば、以下のようなオブジェクトがあったとしましょう。
let object = {
name: '山田太郎',
age: 20,
gender: '男性'
};
このオブジェクトは、「name, age, gender」というプロパティを持ち、それぞれに値が指定されています。
そして、このオブジェクトの中に「name」というプロパティが存在するのかどうか、調べたいときがあるとします。
その際に「in演算子」を使うことで、簡単に判定することができるのです。
(プロパティ in オブジェクト)
in演算子の書き方は上記の通りです。
「プロパティ in オブジェクト」と指定することで、指定したプロパティがオブジェクト内にあるのかどうか、判定することができます。
その判定結果は、「true」または「false」が返されます。
では実際に、in演算子を使ってオブジェクトのプロパティの存在を判定してみましょう。
<script>
let object = {
name: '山田太郎',
age: 20,
gender: '男性'
};
console.log('name' in object);
</script>
先ほどと同じオブジェクトがあります。
このオブジェクトに「name」というプロパティが存在するか判定するために、console.logを使って「’name’ in object」と指定しましょう。
今回は「name」というプロパティが存在するので、結果は「true」と出力されるでしょう。
Google Chromeのデベロッパーツールにある「Console」で結果を確認すると、「true」と出力されました。
これは「object」に「name」というプロパティが存在しているからですね。
このように、in演算子は「プロパティ in オブジェクト」と指定することで、そのプロパティがオブジェクトに存在するのか判定することができます。
続いて、in演算子の２つ目の使い方である、for-inでオブジェクトの繰り返し処理を行う方法について見ていきましょう。
まず、for-inの書き方は以下の通りです。
for (変数 in オブジェクト)
本来、for文は「初期値、条件式、増減式」を指定して繰り返し処理を行いますが、for-inの場合は「変数 in オブジェクト」とするだけでオブジェクトの繰り返し処理を行うことができます。
では、実際にオブジェクトを使って、繰り返し処理を実装してみましょう。
for-inで「変数 in オブジェクト」と指定した場合、変数にはオブジェクトのプロパティが格納されます。
<script>
let object = {
name: '山田太郎',
age: 20,
gender: '男性'
};
for (let i in object) {
console.log(i);
}
</script>
上記のように「name, age, gender」というプロパティを持つオブジェクト「object」があります。
このオブジェクトに対して、for-inを使って「for (let i in object)」と指定します。
「let i」の部分は変数を表していて、この変数に「object」のプロパティが格納されます。
for文の中で、console.logを使って「console.log(i)」と指定してみましょう。
結果を表示すると、次のようになります。
Consoleで確認すると、「name, age, gender」が順に出力されました。
この結果から、for-inによってオブジェクトのプロパティが繰り返し処理されたことがわかりますね。
このように、for-inに「変数 in オブジェクト」と指定することで簡単にオブジェクトのプロパティを繰り返し処理することができます。
for-inを使ってオブジェクトのプロパティを繰り返し処理することができましたが、プロパティの値を繰り返し処理することはできるのでしょうか。
プロパティの値を繰り返し処理するには、結果を出力する際に「オブジェクト[変数]」と指定することで実装可能です。
以下のコードを見てみましょう。
<script>
let object = {
name: '山田太郎',
age: 20,
gender: '男性'
};
for (let i in object) {
console.log(object[i]);
}
</script>
先ほどと同じオブジェクトがあります。
そして、for-inを使って「for (let i in object)」と指定します。
これで変数「i」にプロパティが格納されました。
あとは、console.logを使って「console.log(object[i])」と指定することで、プロパティの値を出力することができます。
結果を表示すると、次のようになるでしょう。
Consoleで結果を確認すると、「山田太郎, 20, 男性」の順に値が出力されました。
この結果から、プロパティの値を繰り返し処理できているのがわかりますね。
このように、「オブジェクト[変数]」と指定することで、プロパティの値を出力することができるので、覚えておきましょう。