Array 메소드에 대해서 새롭게 배우면 추가하겠습니다.
/m은 mutable, /im은 immutable입니다.
기존 배열이 변화하는지 안하는지에 대해서 보여줍니다.

.sort() /m

MDN 정의

sort() 메서드는 배열의 요소를 적절한 위치에 정렬한 후 그 배열을 반환합니다. 정렬은 stable sort가 아닐 수 있습니다. 기본 정렬 순서는 문자열의 유니코드 코드 포인트를 따릅니다.

const arr = [5,3,1,4,6]
arr.sort();
console.log (arr) // => Array [1,2,3,4,5,6] 

const arr = [e,d,c,a,b]
arr.sort();
console.log (arr) // => Array ['a', 'b', 'c', 'd', 'e']

만약 배열의 요소가 두자리 숫자 이상일때 sort()를 사용하게 되면
가장 맨 앞 자리 숫자를 기준으로 정렬된다.
이는 sort()의 기본값이 정렬하려는 요소를 문자열로 취급하기 때문이다.

const arr = [15,1233,5,322,47]
arr.sort();
console.log (arr) // => Array [ 1233, 15, 322, 47, 5 ]

이를 구현하기 위해서는 함수를 작성해서 sort()의 인자로 전달해야한다.

function fn (a,b){
  return a - b;
}

const arr = [15,1233,5,322,47]
arr.sort(fn);
console.log (arr) // => Array [ 5, 15, 47, 322, 1233 ]

sort()인자에 익명함수로 작성해도 작동한다.

내부에서는, a에서 b를 뺐을때 둘중 더 작은 요소를 앞으로 보내 정렬한다.

.map() /im

MDN 정의

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

const arr = [1, 4, 9, 16];

arr.map(x => x * 2); //=> Array [2, 8, 18, 32];

console.log(arr); // => Array [1, 4, 9, 16];

작성하는 함수의 내용에 따라 요소마다 연산을 할 수 있고, 다양한 시도가 가능하다.

map()에서 만약 각 index의 값으로 행동하길 원한다면,

underScore와, 매개변수 두가지를 인자로 받으면 index에 대한 행동을 실시한다.

const arr = ['a','n','v']

arr.map((_, a) => console.log(a)) // => [undefined, undefined, undefined] 
/*
=> outPut
	0
	1
	2
*/ 

.reduce() /im

MDN 정의

reduce() 메서드는 배열의 각 요소에 대해 주어진 리듀서(reducer) 함수를 실행하고, 하나의 결과값을 반환합니다.

let arr = [1, 2, 3]

arr.reduce((a, b) => a + b, 0);// => 6

console.log(arr)// => Array [1, 2, 3]

reduce()는 함수를 인자로 받는데, 인자로 받은 함수의 인자는 a, b
많으면 c까지 작성 가능하며, 첫번째 매개변수는 누적값, 두번째는 현재값이다.
세번째는 배열의 인덱스를 가져온다.

reduce()는 reduce(함수, 초기값)형태로 초기값을 설정할 수 있다.
초기값을 설정하지 않는다면 인자로 받은 함수의 첫번째 매개변수가 초기값이 된다.

단순히 계산뿐 아니라, 초기값과 함수 내용에 따라 다양한 작업이 가능하다.

.filter() /im

MDN 정의

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

const arr = [1, 2, 'a', 'b'];

arr.filter(x => typeof x === 'number'); // => [ 1, 2 ]

console.log(arr) //=> Array [1, 2, 'a', 'b'];

filter()는 문제를 쪼개서 해결할때 유용하다.
예를 들어서 전교생에서 여학생들의 성적의 평균을 구하는 문제라면
전교생중에 성별이 '여자'인 학생들을 먼저 구분해놓는다면, 문제 해결이 좀더 쉬워진다.

.flat() /im

MDN 정의

flat() 메서드는 모든 하위 배열 요소를 지정한 깊이까지 재귀적으로 이어붙인 새로운 배열을 생성합니다.

const arr1 = [1, 2, [3, 4]];
arr1.flat();
// [1, 2, 3, 4]

const arr2 = [1, 2, [3, 4, [5, 6]]];
arr2.flat();
// [1, 2, 3, 4, [5, 6]]

const arr3 = [1, 2, [3, 4, [5, 6]]];
arr3.flat(2);
// [1, 2, 3, 4, 5, 6]

const arr4 = [1, 2, [3, 4, [5, 6, [7, 8, [9, 10]]]]];
arr4.flat(Infinity);
// [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]

flat은 다중 중첩 배열을 평탄화 할때 사용한다.
인자로 숫자를 넣으면 해당 레벨만큼의 배열을 평탄화 해준다.
그리고 이 작업을 하면 빈값은 삭제를 해준다. (Infinity는 모든 레벨을 평탄화)