본문 바로가기

카테고리 없음

array- sort, map, filter함수

sort() , map() , filter()

array 내 모든 요소를 반복해서 가공시키는 메소드임

 

👉sort()

array의 요소들을 sort 함수 내용대로 재정렬하여 반환함

 

 

기본 sort()

var array = ['a','c','b'];
array.sort();
console.log(array);
//[a,b,c]
var array = [1, 8, 100, 33, 5]
array.sort();
//[1,100,33,5,8]

sort()의 파라미터 값에 아무것도 넣지 않으면 문자열로 취급되어 유니코드 값 순서대로 아이템을 정렬

 

숫자도 맨 앞의 숫자를 기준으로 문자열처럼 반환함

 

 

 

파라미터를 활용한 오름차순 정렬

var array = [1, 8, 100, 33, 5]
array.sort(function(a,b) {
	return a-b;
});
//[1, 5, 8, 33, 100]

- a-b가 음수인 경우 a를 왼쪽에 정렬

- a-b가 양수인 경우 a를 오른쪽에 정렬

* 내림차순은 b-a

 

대소문자를 구분하지 않는 알파벳순으로 배열 정리

a=['ant', 'Bug', 'cat', 'Dog']
a.sort(); //['Bug', 'Dog', 'ant', 'cat'] 기본적으로 대소문자를 구분하여 정렬
a.sort(function(s,t) {
	var a = s.toLowerCase(); //문자열 s를 소문자로 변환한 값을 a에 저장
    var b = t.toLowerCase(); //문자열 t를 소문자로 변환한 값을 b에 저장
    if (a<b) return -1; 
    //문자열 a가 b보다 사전 순으로 앞에 온다면 -1을 반환 이렇게 하면 정렬함수는 a를 b보다 앞에 배치
    if (a>b) return 1;
    //문자열 a가 b보다 사전 순으로 뒤에 온다면 1을 반환하여 정렬 함수는 a를 b보다 뒤에 배치하게 됨
    return 0;
    //두 문자열이 사전 순으로 동일하다면 0을 반환
});//최종결과 ['ant', 'Bug', 'cat', 'Dog']

대소문자를 구분하지 않는 알파벳순으로 배열을 정리할 수 있음

 

이때, 비교함수는 전달인자들을 toLowerCase()메서드를 사용해 소문자로 바꾼후 비교 작업을 수행함

 

 

 

문자 배열 내림차순 정렬

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

return 양수면 a가 우측으로 이동

return 음수면 b가 우측으로 이동

 

a b가 

1. 가 , 다 일 경우 return 양수

2. 다 , 나 일 경우 return 음수

3. 가 , 나 일 경우 return 양수

 

 

array내에 있는 object 자료 정렬

var products =  [
    { id : 0 , price : 70000, title : 'Blossom Dress'},
    { id: 1, price : 50000, title : 'Springfield Shirt'},
    { id : 2, price : 60000, title : 'Black Monastery'}
];
product.sort(function(a,b){
	if(a.title > b.title) {
    	return 1;
    } else if(a. title < b.title) {
    	return -1;
    } else { return 0;}
 });

title의 data를 오름차순 정렬함( 내림차순은 부등호 방향만 바꿔주기 )

 

👉filter()

원하는 자료만 필터링해주는 함수임

var array = [7,3,5,2,40];
var newarray = array.filter(function(a){
	return a<4
});

array를 변형시키는 것이므로 새로 선언해서 써주어야함

 

👉map()

array자료 전부 변형하는 함수

var array = [7,3,5,2,40];
var newarray = array.map(function(a){
	return a*4
});
console.log(newarray);

마찬가지로 자료를 전부 변형시켜 새로운 array로 만들어 반환하기 때문에 새로 선언해서 써줘야함