配列の中に特定の要素があるかチェックする方法はいくつかあります。
ここではpersonsというオブジェクト要素を複数もつ配列で考えてみます。
まずは、まあよくある書き方
##例1
sample.js
const persons = [
{name: 'takada'},
{name: 'yamada'},
{name: 'tanaka'},
]
const target = 'takada'
let hasTargetName = false
persons.map((person) => {
if (person.name === target) {
hasTargetName = true
}
})
console.log(hasTargetName) //trueが表示される
for文でもいいですが、mapを使って配列の要素を見ていって、targetと一致するものがあるかを調べています。でもなんか、すごく原始的な感じがして嫌だ。。。
##例2
調べてみるとincludesというのがあった。使い方はどれどれ・・・
const array = ['a' , 'b', 'c']
const target = 'a'
console.log(array.includes(target)) //trueが表示される
なるほど、簡単ですね。でも今回は配列の中身がオブジェクトだからこう書けばいいのか?
const persons = [
{name: 'takada'},
{name: 'yamada'},
{name: 'tanaka'},
]
const target = 'takada'
const hasTargetName = persons.includes({name: target})
console.log(hasTargetName) //falseが表示される
おいおいおい、falseになったぞ!!
どうやらincludesはオブジェクト比較のときは参照元が一致しているかを見てるようです。
試しにこう書いたらtrueになった。ふーん。
const persons = [
{name: 'takada'},
{name: 'yamada'},
{name: 'tanaka'},
]
const target = persons[0] //ここを変えてみた
const hasTargetName = persons.includes(target)
console.log(hasTargetName) //trueが表示される
とりあえず、includesはこの場合には使えないってのは分かりました。
##例3 じゃあどうするの!
どうやら、someというナイスガイがいるらしい。使い方は、ほぼincludesと同じだが比較する値を渡すのではなく、booleanを返す関数を渡してあげればいいようだ。
const persons = [
{name: 'takada'},
{name: 'yamada'},
{name: 'tanaka'},
]
const target = 'takada'
const hasTargetName = persons.some((person) => {return person.name === target})
console.log(hasTargetName) //trueが表示される
いいじゃないか!!!使いやすい!!!
ついでに、冗長な書き方を修正して・・・
const persons = [
{name: 'takada'},
{name: 'yamada'},
{name: 'tanaka'},
]
const target = 'takada'
const hasTargetName = persons.some(person => person.name === target)
console.log(hasTargetName) //trueが表示される
はい、スッキリです☆彡
今後使っていこう~!