배열을 다룰 때 특정 조건을 만족하는 바로 그 요소를 반환 받고 싶을 때가 있었는데 이때 유용한 메서드가 바로 .find()이다. .filter()는 새 배열을 반환하지만 .find()는 인자나 undefined를 반환한다. 키 밸류가 저장되어 있는 myobj 객체에서 myvalue 값에 해당하는 키를 찾고자 할 떄 아래와 같이 사용할 수 있다.

const key = Object.keys(myobj).find(arr => myobj[arr] === myvalue)

MDN의 .find() 메서드 설명을 보면 .findIndex(), .indexOf(), .includes()도 같이 설명하고 있는데 이 .includes()는 텍스트 필터를 만들 때도 유용하게 사용할 수 있다. 인풋으로 keyword 문자열을 받고 이 문자열을 포함하고 있는 목록만 보여주고 싶다면 아래와 같이 문자열을 배열처럼 다뤄서 간단하게 처리할 수 있다.

const filteredList = this.longList.filter(item => this.keyword.length === 0 || item.name.includes(this.keyword));

마지막으로 2차원 배열을 1차원 배열로 풀어주는 .flat()이 있다. 아래처럼 하면 새 1차원 배열이 반환 된다. 얼마나 배열을 깊게 들어가 풀어줄지도 설정할 수 있다.

[[1], [2, 3], 4, [5, 6], [7, 8, 9]].flat()    // [1, 2, 3, 4, 5, 6, 7, 8, 9]

객체의 항목들이 배열을 값으로 가지고 있고 이 배열들만 싹 가지고와서 새로운 배열을 만들고 싶다면 아래와 같이 할 수 있다.

/*
category = {
  category1: [category2, category2, category2, ...],
  category1: [category2, category2, category2, ...],
  ...
}
이런 객체에서 category2를 뽑고 싶을 때,
*/
const category2 = Object.keys(category).map(category1 => category[category1]).flat();