1. 배열(Array)이란?

자바스크립트에서 배열(array)은 이름과 인덱스로 참조되는 정렬된 값의 집합으로 정의됩니다. 배열을 구성하는 각각의 값을 배열 요소(element)라고 하며, 배열에서의 위치를 가리키는 숫자를 인덱스(index)라고 합니다. tcpschool - 배열의 기초

1-1. map()

map() 메서드는 배열 내의 모든 요소 각각에 대하여 주어진 함수를 호출한 결과를 모아 새로운 배열을 반환합니다. MDN - map

구문

const arr = [1,2,3]

arr.map(callback(currentValue[, index[, array]])[, thisArg])

• currentValue = 현재 처리하는 요소
• index = 현재 처리하는 요소의 인덱스 번호
• array = map을 호출한 배열
• thisArg = callback을 실행할 때 this로 사용되는 값.

map 함수 사용법

const classMate = ['짱구' , '철수' , '유리'];
const childs = classMate.map(cur => cur+'어린이')

console.log(childs) // ['짱구어린이' , '철수어린이' , '유리어린이']

배열의 내용을 객체로 변환

예를 들어 이름순으로 출석부를 만들 때 (index 사용)

const classMate = ['신짱구' , '김철수' , '이유리' , '김수한무거북이와두루미' , '이국어' , '박정무'].sort();
const childs = classMate.map((cur , idx) => {
	return {number : idx + 1, name : cur}
})

console.log(childs) //
[
  {number: 1, name: '김수한무거북이와두루미'}
  {number: 2, name: '김철수'}
  {number: 3, name: '박정무'}
  {number: 4, name: '신짱구'}
  {number: 5, name: '이국어'}
  {number: 6, name: '이유리'}
]

1-2. filter()

filter() 메서드는 주어진 함수의 테스트를 통과하는 모든 요소를 모아 새로운 배열로 반환합니다. MDN - filter

구문

const arr = [1,2,3]

 arr.filter(callback(element[, index[, array]])[, thisArg])

• element = 현재 처리하는 요소
• index = 현재 처리하는 요소의 인덱스 번호
• array = filter를 호출한 배열
• thisArg = callback을 실행할 때 this로 사용되는 값.

map과 비슷하지만, map은 기존 배열과 같은 길이의 새 배열을 반환하고 filter는 조건을 만족하는 값만 모아 새 배열을 반환합니다.

간단한 알고리즘 문제로 예시를 들어 보겠습니다.

프로그래머스 - 제일 작은 수 제거하기

문제 설명 정수를 저장한 배열, arr 에서 가장 작은 수를 제거한 배열을 리턴하는 함수, solution을 완성해주세요. 단, 리턴하려는 배열이 빈 배열인 경우엔 배열에 -1을 채워 리턴하세요. 예를들어 arr이 [4,3,2,1]인 경우는 [4,3,2]를 리턴 하고, [10]면 [-1]을 리턴 합니다.
제한 조건 arr은 길이 1 이상인 배열입니다. 인덱스 i, j에 대해 i ≠ j이면 arr[i] ≠ arr[j] 입니다.

arr	return
[4,3,2,1]	[4,3,2]
[10]	[-1]

Math.min으로 가장 작은 값을 구하고, filter로 그 값을 제외한 나머지를 새 배열로 반환했습니다.

function solution(arr) {
    const minNum = Math.min(...arr); 			// 배열의 최솟값 구하기
  	const answer = arr.filter(cur => {			
    	return cur !== minNum && cur			// arr의 배열만큼 반복하며 현재값이 최소값이랑 같지 않을때 현재값을 반환
  	})
    return answer.length !== 0 ? answer : [-1];	// 배열의 길이가 0이 아니면 배열을 반환 0이면 -1을 배열에 담아서 반환
}

solution([4,3,2,1]) // [4,3,2]
solution([10]) 		// [-1]

만약 map으로 풀었다면

function solution(arr) {
    const minNum = Math.min(...arr); 			
  	const answer = arr.map(cur => {				
    	return cur !== minNum && cur			
  	})
    return answer.length !== 0 ? answer : [-1];	
}

solution([4,3,2,1]) // [4,3,2,undefined]
solution([10]) 		// [undefined]

undefined가 반환되어 이를 제거하는 로직이 추가로 필요합니다. 그래서 조건에 맞는 값만 모아 주는 filter가 더 적합하다고 판단했습니다.

1-3. every()

every() 메서드는 배열 안의 모든 요소가 주어진 판별 함수를 통과하는지 테스트합니다. Boolean 값을 반환합니다. MDN - every

every는 배열의 모든 요소가 조건을 만족해야만 true를 반환합니다.

const arr = [0,1,2,3,4]

let isCheckNum = arr.every(cur => cur < 4);
console.log(isCheckNum) // false

let isCheckNum = arr.every(cur => cur < 5);
console.log(isCheckNum) // true