220510( Js, 배열)
배열메서드 중 기존의 배열을 수정하는 메서드 정리(헷갈려서)
고차함수는 제외함
기존의 배열을 수정하는 메서드
1. pop(), push()
pop() - 배열의 맨 뒤의 요소를 제거. 매개변수 필요x 제거된 요소를 반환
push(추가할 요소) - 맨 뒤에 다른 요소를 추가 추가할 요소를 매개변수로 받음 배열의 새로운 길이를 반환
2. unshift(), shift()
shift() - 배열의 맨 앞의 요소를 제거. 매개변수 필요x 제거된 요소를 반환
unshift(추가할 요소) -맨 앞에 다른 요소를 추가 추가할 요소를 매개변수로 받음 배열의 새로운 길이를 반환
3. splice()
splice() - 배열의 기존 요소를 삭제 or 교체// 삭제, 교체 없이 배열의 내용을 변경
splice(변경or삭제할 요소의 인덱스, 몇 개를 삭제할건지 그 갯수, 인덱스 위치에서 추가할 요소)
삭제된(or 교체된)부분이 배열로 반환
let arr = [1,2,3,4,5]
arr.splice(0,1,3) // 인덱스 0의 위치에서 1개의 요소 삭제, 그위치(인덱스 0)에서 3추가
console.log(arr) //[3, 2, 3, 4, 5]
arr.splice(0,1) //인덱스0의 위치에서 1개의 요소 삭제
console.log(arr) // [2, 3, 4, 5]
arr.splice(0,0,5) // 인덱스 0의 위치에서 0개의 요소 삭제(=>변경없음), 그 위치에서 5추가
console.log(arr) //[5, 2, 3, 4, 5]
4. sort(), reverse()
sort() - 기존의 배열을 정렬함(기존 배열 수정됨)
reverse() - 기존의 배열을 반대로(내림차순) 정렬함(기존 배열 수정)
기존의 배열을 수정하지 않고 새로운 배열을 반환하는 메서드
1. concat()
기존의 배열에 인자로 받은 배열(값)을 합쳐 새로운 배열 반환
let array1 =[2,3,4,5,6]
let array2 =[7,8,9,10,11]
let array3= array1.concat(array2) //기존의 array1에 array2를 추가한 새로운 배열 반환
console.log(array3) //[2, 3, 4, 5, 6, 7, 8, 9, 10, 11]
console.log(array3.concat(12)) //2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12]
2. slice()
기존의 배열의 시작 인덱스 부터 종료 인덱스 이전까지의 새로운 배열 반환(얕은 복사)
let array = [0,1,2,3,4,5,6,7,8,9]
// 시작 번호만 입력시
console.log(array.slice(2))// 2번째 인덱스 부터 끝까지 [2, 3, 4, 5, 6, 7, 8, 9]
// 시작번호만 입력시 (음수값)
console.log(array.slice(-2))// 뒤에서 2번째부터 끝까지 [8, 9]
// 시작번호, 끝번호 입력
console.log(array.slice(0,3))// 0번째 인덱스 부터 2번째까지 [0, 1, 2]
//끝번호가 음수일 때
console.log(array.slice(3,-2)) // 3번째 인덱스 부터 뒤에서 2번째 인덱스 이전까지 [3, 4, 5, 6, 7]
음수일 때를 주의해야 함!!
https://doesitmutate.xyz/<- 참고하기 코드스테이츠에서 알려줌
Does it mutate?
The lastIndexOf() method returns the last index at which a given element can be found in the array, or -1 if it is not present. The array is searched backwards, starting at fromIndex.Array.prototype.lastIndexOf ( searchElement [ , fromIndex ] )
doesitmutate.xyz
'Today I learned! > 오늘 하루 배운 것, 기억할 것' 카테고리의 다른 글
220622 (0) | 2022.06.22 |
---|---|
자바스크립트에서 빈 배열인 변수와 []가 비교가 안되는 이유 (0) | 2022.05.10 |
220428(html,css,js) (0) | 2022.04.28 |
220412(잡다) (0) | 2022.04.12 |
220411(css) (0) | 2022.04.11 |