JavaScript 배열(2)

다음은 자바스크립트의 배열을 사용할 때 많이 쓰는 메서드에 대해서 알아보려고 한다.

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

https://duyaan.tistory.com/46

JavaScript 배열

 

우선 지난 시간에 봤던 push()와 pop(), forEach()는 넘어갈 예정이다.

일단 많은 메서드 중에

" shift(), unshift(), splice(), slice(), concat(), indexOf(), lastIndexOf(), includes() "

에 대해 알아볼 것이다.

 

shift()

배열의 앞에서 요소를 제거하는 메서드이다.

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

pop()은 배열의 맨 뒤에서 요소를 제거했다면, shift()는 배열의 맨 앞에서 요소를 제거한다.

 

unshift()

배열의 앞에 하나 이상의 요소를 추가할 수 있는 메서드이다.

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

unshift()에는 배열의 앞에 넣고 싶은 요소를 하나 이상 넣을 수 있다.

인자로 넣은 순서대로 배열의 제일 앞부분에 추가된다.

 

splice()

배열의 특정 위치에서 요소를 추가하거나 제거할 수 있는 메서드이다.

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

splice의 가장 첫 번째 인자부터 시작해서 마지막 인자까지

해당 index(첫 번째 인자)로 부터 특정 개수(두 번째 인자)만큼 삭제한 후,

그 자리에 새로운 요소(세 번째 인자 ~ 마지막 인자)를 추가한다.

 

slice()

배열의 일부를 새로운 배열로 추출하는 메서드이다.

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

arr배열을 참조하여 slice()를 이용해 arr2배열이 새로 만들어진다.

이때, 해당 index(첫 번째 인자)로부터 마지막 index(두 번째 인자)의 직전까지를 추출한다.

즉, 위의 예제에서는 arr배열의 0번째 인덱스부터 2번째 인덱스 직전까지를 추출하는 것이다.

 

concat()

두 개 이상의 배열을 결합하여 하나의 배열을 생성하는 메서드이다.

let arr = [1, 2, 3];
let arr2 = [4, 5, 6];
let arr3 = arr.concat(arr2);
console.log(arr); // [1, 2, 3]
console.log(arr2); // [4, 5, 6]
console.log(arr3); // [1, 2, 3, 4, 5, 6]

concat()을 이용해 두 개의 배열을 결합하는 것이다.

concat()의 인자로 들어가 있는 하나 이상의 배열을 모두 결합한다.

 

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를 반환한다.

 

 

 

 

 

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

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