includus() 인척 하는 filter()

·2022년 3월 15일
0

메소드 공부

목록 보기
6/22
function solution(aisa, kanji) {
  return aisa.filter((it) => kanji.includes(it));
}

const aisa = ["대한민국", "러시아", "태국", "일본"];
const kanji = ["대한민국", "일본", "중국"];
const result = solution(aisa, kanji);
console.log("결과", result);

배열을 다루다보면 여러개의 배열에서 교집합을 찾아내는 과정을 거쳐야할 일이 존재한다.
1일차에 이러한 과제를 받았는데, 다른 사람들은 다양한 방법으로 풀었지만
나는 Array.filter()를 통해 해답을 찾아냈다.
그렇지만 단순하게는 이해하지만 필터라는 메소드를 자세하게 이해를 하지 못했기에 이것을 알아보려고 한다.

왜 삽질 태그에 있냐면 필터 메소드가 엄청 자주 쓰인다고 알고 있어서다.
많이 쓴다는 소리는 활용범위가 많다는 이야기니까,,,^^..,

직접 비쥬얼 코드에서 찍어서 화질이 영..

대충 요약을 하면 최대 3개의 인자를 받을 수 있고,
조건을 부여했을 때 참인 요소를 모아서 새로운 배열로 반환을 해주는 역할을 한다. 라고 적혀있다.

그리고 찾아보니 주의사항으로는 중복값을 제거해주지 않는다며 주의를 해야한다고 봤다.

사용법을 알아보면
arr.filter(callback(element[, index[, array]])[, thisArg])

이와 같은 구조를 가지고 있고 일반적으로는 값을 하나를 콕! 찍어서 사용을 많이 한다고 한다.


**includes()는 존재하는지 확인해주는 메소드다**

구조를 보았으니 그것을 대입하여 위에 적은 것을 한번 설명을 해보면
return aisa.filter((it) => kanji.includes(it));
aisa에 있는 배열 속 데이터 값을 it에 넣고
it = ["대한민국", "러시아", "태국", "일본"]
includes()를 통하여 kanji의 값과 일치할 경우,
조건이 참이 되었기에 새로운 배열을 형성해서 밖으로 내보내는 과정을 보여주고 있다.

뭔가 나는 얼핏 이해가 된 것 같은데 설명이 개떡같은 것을 보면 확실한 이해는 분명 못한 것 같다.


조금 더 단순한 예시가 있는게 좋을 것 같아서, 툭하면 반복문으로 만드는 홀수 찾기를 filter로 만들어봤다.
const numbers = [1,6,13,17,12,91,31,56,83,36,78]
const odd = numbers.filter((num) => num % 2));

console.log(odd);
[ 1, 13, 17, 91, 31, 83 ]

위의 코드는 numbers 라는 상수 속에 숫자가 담겨진 배열을 선언하고
numbers가 가지고 있는 배열 사이에 2로 나눠서 나머지가 존재하는 것을 odd라는 상수에 담고
콘솔로 odd를 불러온 것이다.

숫자를 2로 나눠서 나머지가 0이 될 경우에는 false가 되버리기에 홀수만 출력을 해주는 것이다.

반대로 짝수만 출력을 하고 싶다면 num % 2 === 0 을 적으면
숫자를 2로 나눈 것이 0이 되었을 때,
비교 연산자로 0은 0과 동일하게 되므로 true가 되서 짝수를 출력해줄 수 있다.


조금 더 완벽한 이해(?)와 element가 아닌 index나 array에 사용을 해본 후 추가적인 작성을 해야한 것 같다.

자주쓰고, 비슷한 함수로는 map()과 reduce() 가 존재한다고 알고 있는데....
공부를 역시나 더 많이 더 밀도있게 해야할 것 같다..^^ 기본부터 쌓고

끝!

profile
물류 서비스 Backend Software Developer

0개의 댓글

관련 채용 정보