JavaScript 배열(3)

JavaScript 배열을 사용할 때 많이 쓰는 메서드

" shift(), unshift(), splice(), slice(), concat() "

(https://duyaan.tistory.com/47)

에 대해서 저번 페이지에서 알아봤다.

 

이번에는

" sort(), reverse(), indexOf(), lastIndexOf(), includes(), find() "

에 대해서 알아볼 예정이다.

 

 

자바스크립트의 배열에 대해서 알고 싶으면 다음 링크로 가면 된다.

https://duyaan.tistory.com/46

JavaScript 배열

 

 

배열 정렬

sort()

배열을 정렬하는 메서드이다.

let arr = [1, 3, 2];
arr.sort();
console.log(arr); // [1, 2, 3]

보통 sort()를 쓸 때는 compareFunction함수를 같이 사용한다.

형식은 array.sort(compareFunction)으로 쓰인다.

 

compareFunction함수가 생략이 되면,

유니코드 코드 포인트를 기준으로 정렬이 된다. (일반적인 sort랑은 다른 결과가 나올지도 모른다.)

 

일반적으로 compareFunction함수는 오름차순 정렬을 시켜주는데, 다음과 같은 형식을 따른다.

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

compareFunction함수의 반환값을 가지고 sort()는 정렬을 실시한다.

만약 반환값이 양수라면( a > b ) a가 b보다 뒤에 위치하게 되는 것이고,

만약 반환값이 음수라면( a < b) a가 b보다 앞에 위치하게 되는 것이고,

만약 반환값이 0이라면( a == b ) 아무 일도 일어나지 않게 되는 것이다.

 

즉, 위의 compareFunction을 쓰게 되면 오름차순 정렬이 되는 것이다.

let arr = [1, 3, 2];
arr.sort(compareFunction);
console.log(arr); // [1, 2, 3]

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

 

(추가)

만약 return값을 반대로 하면 내림차순 정렬이 만들어진다.

 

reverse()

배열의 요소 순서를 뒤집는 메서드이다.

let arr = [1, 2, 3];
arr.reverse();
console.log(arr); // [3, 2, 1]

reverse()를 통해 배열의 요소를 180도로 뒤집는다.

 

 

 

배열 검색 및 필터링

indexOf()

배열에서 특정 요소의 인덱스를 검색하는 메서드이다.

let arr = [1, 2, 3];
let index = arr.indexOf(2);
console.log(arr); // [1, 2, 3]
console.log(index); // 1

배열 내에서 indexOf()의 인자로 있는 요소를 검색한 다음, 해당 인덱스를 반환한 것이다.

이때, 배열 내에서 해당 요소를 검색하지 못하면 ( = 배열 내에 해당 요소가 존재하지 않으면)

-1을 반환한다.

또한, 배열 내에 해당 요소가 많아도 가장 처음 발견한 인덱스가 반환된다.

 

lastIndexOf()

배열에서 특정 요소의 마지막 인덱스를 검색하는 메서드이다.

let arr = [1, 2, 3, 3];
let index = arr.lastIndexOf(3);
console.log(arr); // [1, 2, 3]
console.log(index); // 3

indexOf()와 비슷하다.

다만 찾으려는 요소가 배열 내에 여러 개가 존재한다면

indexOf()는 여러 개 중 가장 첫 번째 인덱스를 반환하지만

lastIndexOf()는 여러 개 중 가장 마지막 인덱스를 반환한다.

 

includes()

배열에 특정 요소가 포함되어 있는지 여부를 검사하는 메서드이다.

let arr = [1, 2, 3];
let index = arr.includes(3);
console.log(arr); // [1, 2, 3]
console.log(index); // true

배열 내에서 includes()의 인자로 있는 요소를 검색한 다음,

해당 요소가 배열 내에 존재한다면 true를 반환하고,

해당 요소가 배열 내에 존재하지 않는다면 false를 반환한다.

 

find()

배열에서 특정 조건을 만족하는 첫 번째 요소의 값 추출하는 메서드이다.

let arr = [1, 2, 3];
let result = arr.find(findNum);
console.log(result); // 2

function findNum(element){
  return element > 1;
}

find()에 인자로 들어가 있는 콜백 함수를 통해 원하는 요소를 추출할 수 있다.

콜백 함수의 인자에는 element, index, array가 들어갈 수 있다.

element는 배열의 현재 요소를 뜻하고,

index는 배열의 현재 요소의 인덱스를 뜻하는데, 이 인자는 선택 사항이다.

array는 find()를 호출한 배열을 뜻하며, index와 마찬가지로 선택 사항이다.

 

콜백 함수의 반환값이 참이라면 해당 요소를 반환한다.

만약 반환값이 참이 된다면, 그 즉시 실행을 중지한다.

(첫 번째로 조건을 만족하는 요소를 찾는 것이 목적이기 때문이다.)

 

 

 

 

 

글 내용 중, 잘못됐거나 더 알아야 하는 지식이 있다면 댓글로 남겨주시면 감사하겠습니다!

모두 좋은 하루 보내세요:)