Array_method 3

Yu Sang Min·약 5시간 전
0

JavaScript

목록 보기
36/36
post-thumbnail

📌arr.sort();

  • 배열 재정렬
  • 배열 자체가 변경되니 주의
let arr = [5, 2, 1, 3, 4];
arr.sort(); // [ 1, 2, 3, 4, 5]

let arr2 = [27, 8, 5, 13];
arr2.sort(); // [13, 27, 5, 8]
  • arr2가 뒤죽 박죽 정렬된다.
  • 이유는 문자열로 식별하여 앞에 13의 1과 27의 2를 앞쪽으로 보낸다.
  • 이를 개선하기 위해 정렬 로직을 담은 함수를 받아야한다.
let arr = [27, 8, 5, 13];

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

arr.sort(fn);

console.log(arr); // [5, 8, 13, 27]
  • 내부 로직은 return값이 음수가 나오면 a가 b보다 작다.
  • 그러면 a를 배열의 앞쪽으로 이동시킨다.
  • 반대의 경우 변경되지 않는다.
  • 이런식으로 각 요소를 비교하여 배열을 정렬한다

📌 Lodash

  • 보통 이렇게 함수를 만들어 사용하지는 않는다.
  • Lodash 같은 라이브러리를 많이 사용한다.
  • _.sortBy(arr);: 숫자든 문자든 관계없이 배열을 정렬한다.
  • 공식 사이트에서 추가적인 학습이 권고된다.

📌 arr.reduce()

  • 인수로 함수를 받는다.
  • (누적 계산값, 현재값) => { return 최종 계산값 }
  • 배열을 돌면서 원하는 함수로 작업 후 최종 값을 반환한다.
let arr = [ 1, 2 ,3 ,4 ,5 ];
let result = 0;

arr.forEach((num) => {
    result += num;
})
console.log(result); // 15
  • 위와같이 forEach를 사용해도 되지만 reduce 를 사용해보자
let arr = [ 1, 2, 3, 4, 5];

const result = arr.reduce((prev, cur) => {
   return prev += cur
}, 0)

console.log(result); // 15
  • reduce()의 첫번째 인자는 함수를 받는다.
  • 이 함수의 첫 번째 인자가 누적 계산값
  • 이 함수의 두 번째 인자가 현재값
  • reduce()의 두번째 인자는 초기값

💡계산 흐름

  1. 초깃값 0prev가 되어 이전 계산값이 된다
  2. prev 값에 cur 값을 더하고 그 값을 prev로 할당한다
  3. cur는 배열의 첫 번째 요소인 1이된다.
  4. prev는 1이 되고 그 다음 cur 값은 배열의 두 번째 요소인 2가 된다.
  5. prevcur을 더하고 결과값을 prev에 할당한다.
  6. 이 과정을 배열의 마지막 요소까지 반복하고 결과값을 return한다
profile
풀스택 개발자 지망생 (React, Node.js, AWS, Git, Github, Github Action, Docker)

0개의 댓글

관련 채용 정보