[Javascript] Array Method

코딩앙마님의 youtube Javascript 강좌를 보고 정리한 Method 정리노트

splice

특정 요소를 지우고 해당 자리에 새로운 요소를 추가하고 삭제된 요소들로 이루어진 새로운 배열을 반환하는 Method

arr.splite(n,m,x) : n부터 m개 삭제하고 x를 추가

let arr = [1,2,3,4,5]

const result = arr.splice(1,2,10,20)

console.log(arr)  // [1,10,20,4,5]
console.log(result)  // [2,3]

---

slice

연속된 요소를 반환하는 Method

arr.slice(n,m) : n번째 인덱스부터 m-1번째 인덱스까지 반환 (m이 없으면 끝까지 반환)

let arr = [1,2,3,4,5]

console.log(arr.slice(1,3))  // [2,3]
console.log(arr.slice(2,4))  // [3,4]
console.log(arr.slice(2))  // [3,4,5]

---

concat

두 배열을 하나의 배열로 합치는 Method

arr1.concat(arr2) : arr1의 요소 뒤에 arr2의 요소를 추가하여 새로운 배열 반환

let arr1 = [1,2,3]
let arr2 = [4,5]

const result = arr1.concat(arr2)

console.log(arr1)  // [1,2,3]
console.log(result)  // [1,2,3,4,5]

---

forEach

배열의 반복

---

indexOf / lastIndexOf

요소의 인덱스 값을 가져오는 Method
배열에 찾는 요소가 존재하지 않으면 -1을 반환한다.

arr.indexOf(n,m) : m번째 인덱스에서부터 탐색하여 요소 n의 인덱스 값을 반환 (m의 default는 0)

arr.lastIndexOf(n) : 뒤에서부터 탐색하여 n 요소의 인덱스 값을 반환

let arr = [1,2,3,1,2,3]

console.log(arr.indexOf(2))  // 1
console.log(arr.indexOf(2,2))  // 1
console.log(arr.lastIndexOf(2))  // 4

---

includes

요소가 포함되어 있는지 확인하는 Method

let arr = [1,2,3,4,5]

console.log(arr.includes(1))  // true
console.log(arr.includes(6))  // false

---

find / findIndex

함수를 이용해 조건에 맞는 요소를 찾는 Methed

arr.find(fn) : 조건에 맞는 요소를 찾으면 반환하고 함수 종료

let arr = [1,2,3,4,5]

const result = arr.find((item)=>{
    return item % 2 === 0
})

console.log(result)  // 2

arr.findindex(fn) : 조건에 맞는 요소를 찾아 해당 인덱스를 반환하고 함수 종료

let arr = [1,2,3,4,5]

const result = arr.findindex((item)=>{
    return item % 2 === 0
})

console.log(result)  // 1

---

filter

함수를 이용해 조건에 맞는 요소를 모두 찾는 Method

arr.filter(fn) : 조건에 맞는 요소를 모두 반환

let arr = [1,2,3,4,5,6,7]

const result = arr.filter((item)=>{
    return item % 2 === 0
})

console.log(result)  // [2,4,6]

---

reverse

배열의 요소들을 역순으로 정렬하는 Method

arr.reverse() : 배열의 요소를 역순으로 정렬

arr = [1,2,3,4,5]

console.log(arr.reverse())  // [5,4,3,2,1]

---

map

---

join / split

---

isArray

배열이 맞는지 확인하는 Method

Array.isArray(arr) : arr가 배열이 맞는지 확인하여 Boolean 값으로 반환

let arr = [1,2,3,4,5]
let obj = {name: "짱구", age: 5, school: "떡잎유치원" }

console.log(typeof arr)  // object
console.log(typeof obf)  // object

배열과 객체 모두 typeof로 확인 시 object로 출력된다.

let arr = [1,2,3,4,5]
let obj = {name: "짱구", age: 5, school: "떡잎유치원" }

console.log(Array.isArray(arr))  // true
console.log(Array.isArray(obj))  // false

---

sort

배열을 재정렬하는 Method (오름차순,내림차순)

arr.sort() : arr 배열을 재정렬 (문자열도 ASCII를 기준으로 정렬 가능하다)

let arr1 = [1,3,5,4,2]
let arr2 = [1,2,3,10,20]

let result1 = arr1.sort()
let result2 = arr2.sort()

console.log(result1)  // [1,2,3,4,5]
console.log(result2)  // [1,10,2,20,3] 

result2의 값이 [1,10,2,20,3]으로 출력된건 정렬할때 요소를 문자열로 인식하기 때문이다.

아래의 방법을 이용하면 오름차순과 내림차순으로 정렬 가능하다.

let arr = [1,20,3,4,100,2]

const ACS = arr.sort((a,b) => {
	return a - b	
})

const DESC = arr.sort((a,b) => {
	return b - a	
})

console.log(ACS)  // [1,2,3,4,20,100]
console.log(DESC)  // [100,20,4,3,2,1]

---

reduce