jQuery - Array.filter()를 이용한 배열 처리 방법, 배열 필터링

Javascript에서 배열을 제어할 때 사용하는 함수로 filter가 있습니다.

 

각 요소의 값과 인덱스, 배열을 참고하여 배열을 제어할 수 있으며 기본 사용법은 다음과 같습니다.

 

기본 사용법

필요에 따라 function의 elem, index, array를 필요한 것만 사용해도 무방합니다.

Ex) function(elem) / function (elem, index)

 

Array.filter(function(elem, index, array)){
    elem - 0번째 index부터 마지막 index까지의 요소값
    index - 현재 요소의 위치값(index)
    array - 전체 배열값
    return true - 현재 배열을 return한다
    return false - 현재 배열을 continue처리(pass) 한다
}

 

 

기본 사용법(예시)

var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];

var result = arr.filter(function(elem, idx, arr){
    elem - 1부터 10까지의 각 요소배열을 루프를 돌면서 반환합니다
    idx - 배열의 위치값인 0부터 9를 순서대로 반환합니다
    arr - 전체 배열인 [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]를 항상 반환합니다
});

 

 

사용 예시1

elem는 각 배열의 요소이기 때문에 원하는 조건을 걸어서 배열을 필터링처리 할 수 있습니다.

var result = arr.filter(function(elem, idx, arr){
	var elem = elem;

	if (elem % 2 == 0){
		return false;
	} else{
		return true;
	}
})

// result = [1, 3, 5, 7, 9]

 

 

사용 예시2

elem는 각 배열의 인덱스이기 때문에 원하는 조건을 걸어서 배열을 필터링처리 할 수 있습니다.

var result = arr.filter(function(elem, idx, arr){
	var elem = elem;

	if (idx > 3){
		return false;
	} else{
		return true;
	}
})

// result = [1, 2, 3, 4]