sort()
- 배열의 요소를 정렬하는 함수.
- 배열의 요소들을 문자열로 취급하여 기본적으로 오름차순 정렬을 한다.
- 원본 배열을 변경한다.
[숫자]
var array = [7, 3, 5, 2, 40];
array.sort();
console.log(array); // [2, 3, 40, 5, 7] 출력▲ 오름차순 정렬인데 위와 같이 결과가 나오는 위유는 sort()는 배열의 요소를 문자로 취급해서 정렬하기 때문이다.
var array = [7, 3, 5, 2, 40];
// 숫자를 올바르게 정렬하려면 비교 함수를 사용
array.sort(function(a, b){
return a - b // 오름차순
console.log(array); // [2, 3, 5, 7, 40] 출력
});
array.sort(function(a, b){
return b - a // 내림차순
console.log(array); // [40, 7, 5, 3, 2] 출력
});▲ 숫자순으로 정렬하려면 비교함수를 사용하여 정렬해야 한다.
(+) 왜 비교함수를 사용하면 숫자 정렬이 되는지 sort()의 동작 원리를 알아보자.
array.sort(function(a, b){
return a - b
});1. a, b는 array 안의 자료들이다.
2. return 우측이 양수이면 a를 오른쪽으로 정렬해 준다.
3. return 우측이 음수이면 b를 오른쪽으로 정렬해 준다.
4. 그리고 array 안의 자료들을 계속 뽑아서 a, b에 넣어 준다.
이렇게 동작해서 a - b라고 쓰면 숫자순 정렬이 되는 것이다.
예를 들어 a, b가 7과 3일 경우 7 - 3 하면 4이 남는다. 4는 양수이기 때문에 7을 3보다 오른쪽으로 보내 준다. 그래서 숫자 오름차 정렬이 완성되는 것이다.
[문자]
var array = ['가','다','나'];
array.sort();
console.log(array); // ['가', '나', '다'] 출력▲ 문자는 가나다순(오름차순)으로 정렬하려면 .sort()를 붙이면 된다.
var array = ['가','다','나'];
array.sort(function(a, b){
if (a < b){
return 1
} else if (a > b){
return -1
}
});
console.log(array); // ['다', '나', '가'] 출력▲ 문자는 다나가순(내림차순)으로 정렬하려면 위와 같이 비교함수를 사용하여 정렬해야 한다.
(+) 왜 그런지 sort()의 동작 원리를 알아보자.
1. a, b는 array 안의 자료들이다.
2. return 우측이 양수이면 a를 오른쪽으로 정렬해 준다.
3. return 우측이 음수이면 b를 오른쪽으로 정렬해 준다.
4. 그리고 array 안의 자료들을 계속 뽑아서 a, b에 넣어 준다.
이렇게 동작해서 a - b라고 쓰면 숫자순 정렬이 되는 것이다.
위 코드에서 중요한 건 return 우측에 뭘 집어넣냐는 것인데 예를 들어
(1) a, b가 '가', '다'일 경우 return 우측에 양수가 들어가야 a를 오른쪽으로 정렬해서 다나가순 정렬이 된다.
(2) a, b가 '다', '나'일 경우 return 우측에 음수가 들어가야 다나가순 정렬이 된다.
(3) a, b가 '가', '나'일 경우 return 우측에 양수가 들어가야 다나가순 정렬이 된다.
...
이렇게 하나하나 대입해서 보면 규칙이 보이는데,
a < b 일 경우 return 우측에 양수가 들어가면 되고
a > b 일 경우 return 우측에 음수가 들어가면 된다.
(자바스크립트는 문자끼리 부등호 비교가 가능하다. ㄱ보다 ㅎ이 더 크다)
var array = ['가','다','나', '가'];
array.sort(function(a, b){
if (a < b){
return 1
} else if (a == b ) {
return 0
} else if (a > b) {
return -1
}
});
console.log(array);▲ 만약 같은 글자가 배열 안에 있다면 조작이 필요없기 때문에 return 0을 하면 된다.
fiilter()
- 배열에서 주어진 조건을 만족하는 요소들만 걸러내는 함수.
- 주어진 조건 함수에 따라 배열의 요소들을 평가하고, 조건을 true로 평가하는 요소들만 반환한다.
- 새로운 배열을 반환하며 원본 배열은 수정되지 않는다.
var array = [7,3,5,2,40];
var newArray = array.filter(function(a){
return a < 4
});
console.log(newArray); // [3, 2] 출력
▲ filter()는 원본을 변형시키지 않는 함수이기 때문에 새로운 변수에 담아서 써야 한다.
map()
- 배열의 각 요소에 주어진 함수를 적용해 새로운 배열을 생성하는 함수.
- 배열의 각 요소에 대해 전달된 함수를 적용하고, 그 결과를 모아서 새로운 배열을 반환한다.
- 원본 배열은 수정되지 않는다.
var array = [7,3,5,2,40];
var newArray = array.map(function(a){
return a * 4
});
console.log(newArray); // [28, 12, 20, 8, 160] 출력▲ map()은 원본을 변형시키지 않는 함수이기 때문에 새로운 변수에 담아서 써야 한다.
* 이 포스팅은 코딩애플 강의를 토대로 작성하였습니다.
