[JS] 정렬

array 정렬하기

• array 자료는 순서개념이 있어 정렬이 가능

• array에 자주 쓰는 함수들 → sort, map, filter 등

---

문자 가나다순으로 정렬할 때엔 .sort() 함수를 사용하지만,

숫자정렬은 아래처럼👇 쓰는 방식이 살짝 다르다.

let array = [10, 3, 8, 40, 25];
array.sort(function(a, b){
  return a - b
});

console.log(array);
// 3, 8, 10, 25, 40 

숫자정렬 했을 때 sort() 동작원리를 알아보면,

array.sort(function(a, b){
  return a - b
});

• a, b는 array 안의 자료들임
• return 값이 양수면 a를 오른쪽으로 정렬
• return 값이 음수면 b를 오른쪽으로 정렬
• array 안의 자료들을 계속 뽑아서 a, b에 넣어줌

ex) a, b가 10과 3일 경우, 10 - 3 은 7인 정수임으로 10을 3보다 오른쪽으로 정렬[3 , 10],
a, b가 3과 8일 경우, 3 - 8는 -5인 음수임으로 3을 8보다 왼쪽 으로 정렬[3, 8]

이런식으로 동작하기때문에 a - b 는 오름차순(123순) 정렬이 되는 것이다.

반대로 내림차순(321순)은?

var array = [10, 3, 8, 40, 25];
array.sort(function(a, b){
  return b - a
});

console.log(array)
// 40, 25, 10, 8, 3

그렇다면 문자역순정렬은?

*문자는 크기로 비교할 수 있다. (a < z, 가 < 하)

var array = ['다', '가', '나'];
array.sort(function(a, b){
  if (a > b) {
      return -1;
  } else {
      return 1;
  }
});
console.log(array); // 다 나 가

위처럼 sort() 메소드를 사용할 경우 저렇게 크기 비교하여 쓰는 법이 있지만,
문자내림차순 전용 메소드도 존재한다.

var array = ['다', '가', '나'];
array.reverse(); //문자내림차순
console.log(array); // 다 나 가

---

array에 자주 쓰는 filter 함수

• array자료에서 원하는 자료만 필터링하고 싶을 때 쓰는 함수

var array = [10, 3, 8, 40, 25];

var newArray = array.filter(function(a){
  return 조건식
});

• filter 콜백함수의 파라미터 a(작명)는 array 에 있던 데이터를 뜻함
• return 우측에 조건식을 넣으면 조건식에 맞는 a만 남겨줌
• filter는 *원본을 변형시키지 않는 함수이기 때문에 새로운 변수에 담아써야함

ex. 10 미만인 것만

var array = [10, 3, 8, 40, 25];

var newArray = array.filter(function(a){
  return a < 4
});

console.log(newArray);
// [3, 8]

---

array에 자주 쓰는 map 함수

• array안의 자료들을 전부 변형할 때 쓰는 함수

var array = [10, 3, 8, 40, 25];

var newArray = array.map(function(a){
  return 수식같은거
});

• map 콜백함수의 파라미터 a(작명)는 array 에 있던 데이터를 뜻함
• return 우측에 변경될 수식같은 걸 넣음
• map은 *원본을 변형시키지 않는 함수이기 때문에 새로운 변수에 담아써야함

ex. array 안의 숫자들에 전부 4를 곱해주고 싶다면

var array = [10, 3, 8, 40, 25];

var newArray = array.map(function(a){
  return a * 4
});

console.log(newArray);
// [40, 12, 32, 160, 100]

응용하면 달러 -> 원화로 변환하기 이런 기능도 가능할 듯.

array 안에 있는 숫자들을 달러 가격이라고 할 때, 전부 원화가격으로 변경하고 싶으면 map 써서 환율 곱해주는 식으로..

💡 (참고)
sort 함수는 원본을 변형시켜버림.
원본이 변형되면 나중에 복원안되는 문제가 생길 수 있어서
*array/object 자료 조작시엔 원본을 따로 복사해두고 조작하는 경우도 있다.

---

💡 코드 줄이고 싶으면 arrow function (화살표 함수)

함수에 파라미터가 1개면 소괄호 생략이 가능,
함수 { } 안에 return 한 줄 밖에 없으면 중괄호와 return 동시에 생략가능

//일반함수
var newArray = array.filter(function(a){
  return a < 4
});

//화살표함수
var newArray = array.filter(a => a < 4);

(근데 일반함수/화살표함수 에서 this 사용시, 의미 서로 다르니까 주의하자🤔)