JavaScript

【5分で理解④ (配列編)】JavaScriptの配列のsomeメソッドで配列内に”存在確認”

こんにちは。
大阪でフロントエンド兼マネージャー兼Webチームの採用担当をしている筆者です👽

配列はJavaScript(以下JS)を理解する上では必須の項目です。
JavaScriptの配列で使うメソッド多くあります。

それらのメソッドは便利でコードの可読性を上げてくれるのですが、覚えるのが大変です。
そこで重要なメソッドだけにスポットをあて短くまとめてシリーズにして紹介しています。

第4弾の今回はsomeメソッドを紹介します。

ちなみに第3弾の記事はこちらから!
【5分で理解③ (配列編)】JavaScriptの配列のmapメソッドで繰り返し計算や指定要素だけ抽出


some()の基本文法

const scores = [10, 20, 40, 30, 60];

const someGrammer = scores.some((cur) => cur > 50)
console.log(someGrammer) //👉 true

curには配列内の数字が順番に入り、条件(cur > 50)を満たす値があるかチェックし、trueかfalseで返します

最初は10で🙅‍♂️
次に20で🙅‍♂️
次に40で🙅‍♂️
次に30で🙅‍♂️
最後の60で条件を満たし🙆‍♂️となり、この配列には50以上の値がある。つまりtrueを返します。


some()は何をしてくれる?

someメソッドは条件に満たす値が指定の配列内にあるかをチェックし、true or falseで返してくれます。

const members = [
  { name: 'Natsumi', old: 21, gender: 'female', height: 158 },
  { name: 'Takashi', old: 18, gender: 'male', height: 180 },
  { name: 'Hitomi', old: 17, gender: 'female', height: 163 },
  { name: 'Jun', old: 32, gender: 'male', height: 165 },
];

const someMember = members.some((member) => member.height > 170);
console.log(someMember) //👉 true

実施結果は、
True
となります。

これは、members配列の中にある一部のオブジェクトのheightが170以上になっているのでtrueが返ってきています。
someメソッドはif文とかで結果の出しわけに使うときに効果を発揮しそうですね。


参考:includes()との違い

配列内の存在の有無を確認することに関しては、includesメソッドでもできます。
しかし、includesメソッドは条件分ではなく、ピンポイントで値の有無のチェックをします。

const scores = [10, 20, 40, 30, 60];

const testIncludes = scores.includes(60)
console.log(testIncludes) //👉 true

someメソッドのように条件に当てはまるかのチェックはできないということです。
ちなみにsomeメソッドをincludesメソッドのように書くことはできます。

const scores = [10, 20, 40, 30, 60];
const testSome = scores.some((score) => score === 60);
console.log(testSome) //👉 true

あまり意味があると思いませんが、、一応知っておいてもらうと良いのではないでしょうか😅



今回は以上となります。
皆さんのJSの理解に繋がっていれば幸いです。
次回も楽しみにしていてください。




▼▼あわせて読みたいの記事▼▼

【5分で理解③】JavaScriptの配列のmapメソッドで繰り返し計算や指定要素だけ抽出

-JavaScript
-, , , , ,