배열의 메서드별 원본 변경여부 / 반환값 / 매개변수

배열에는 정말 다양한 메서드들이 존재하고, 이것은 JavaScript에서 굉장히 유용하고 중요한 존재이다.
각각의 개념들은 그렇게 어렵지는 않다. 하지만 코딩을 하다보면 직면하게 되는 사소한 오류들을 만나게 된다. 나는 그 이유를 이 메서드들에 대해 애매하게 알기 때문에 발생한다고 생각한다.

다음은 각 메서드 특징에 대해서 정리를 해놓은 것이다. 메서드의 역할에 대해서는 각색하고, 헷갈리시 쉬운 원본 변경 여부 반환되는 값 매개변수 들을 비교해보겠다.

(불린타입을 반환하거나하는 헷갈리지 않는 메서드들은 제외하였다.)

메서드	원본 변경 여부	반환되는 값	매개변수	콜백함수 인자
pop	○	제거된 요소	(null)	-
push	○	변경된 배열 길이	(맨뒤에 추가할 요소)	-
shift	○	제거된 요소	(null)	-
unshift	○	변경된 배열 길이	(맨앞에 추가할 요소)	-
concat	X	변경된 배열	(맨뒤에 추가할 요소)	-
splice	○	제거된 요소 배열	(제거시작할 인덱스, 제거할 요소 개수, 삽입할 요소)	-
slice	X	복사한 요소 배열	(복사 시작 인덱스, 복사 종료 인덱스 + 1)	-
join	X	연결한 문자열	(구분자)	-
reverse	○	변경된 배열	(null)	-
fill	○	변경된 배열	(채울 값, 채우기 시작할 인덱스, 멈출 인덱스 + 1)	-
flat	X	평탄화 된 배열	(평탄화 깊이)	-
sort	○	정렬된 배열	(null) 또는 (비교함수)	-
forEach	X *(○)	undefined	(콜백함수, this로 사용할 객체)	(배열의 요소값, 인덱스, this)
map	X	콜백함수의 반환값 배열	(콜백함수, this로 사용할 객체)	(배열의 요소값, 인덱스, this)
filter	X	콜백함수의 반환값이 true 요소 배열	(콜백함수, this로 사용할 객체)	(배열의 요소값, 인덱스, this)
reduce	X	누적된 값	(콜백함수,초기값)	(초기값or이전 반환값,배열의 요소값, 인덱스, this)
find	X	true인 첫번째 요소	(콜백함수, this로 사용할 객체)	(배열의 요소값, 인덱스, this)
findIndex	X	true인 첫번째 요소의 인덱스	(콜백함수, this로 사용할 객체)	(배열의 요소값, 인덱스, this)
flatMap	X	1단계 평탄화된 배열	(콜백함수)	-

*(○)는 콜백함 수에 의해서는 원본이 변경될 수 있음을 의미한다