【JavaScript】オブジェクトを格納した配列から特定のオブジェクトを取得する

Array.prototype.find()を使用する

【構文】
arr.find(callback(element[, index[, array]])[, thisArg])

Array.prototype.find() - JavaScript | MDN
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Array/find

// 下記の配列から特定のidを持つ要素（オブジェクト）を取り出す。
const members = [
  {id: 1, name: "tanaka", age: 30},
  {id: 2, name: "suzuki", age: 28},
  {id: 3, name: "sato", age: 24},
];

const getMemberById = (id) => {
  return members.find(member => member.id === id);
};

console.log(getMemberById(1)); // {id: 1, name: "tanaka", age: 30}
console.log(getMemberById(2)); // {id: 2, name: "suzuki", age: 28}
console.log(getMemberById(3)); // {id: 3, name: "sato", age: 24}

構文についての補足

構文内のcallback関数には配列の要素一つ一つが引数に渡るので、マッチさせたい条件を記述します。
上記サンプルの場合、callback関数の引数には各オブジェクトが渡され、指定したgetMemberById(n)で渡した数値と、各オブジェクトのidプロパティの値がマッチするまで、callback関数を繰り返し実行します。

戻り値

Array.prototype.find()の戻り値は最初に条件にマッチした要素なので、同じ条件の要素が２つ以上あった場合、以降は無視されます。条件に一致した要素がなければ、undefinedを返します。

まとめ

ReactやVue.jsでは、最初に述べたオブジェクトが格納された配列を扱う機会が多いと思いますので、
Array.prototype.find()の使用頻度も高いのではと思います。