2023.02.27

Array

JavaScript Array 클래스는 리스트 형태의 고수준 객체인 배열을 생성할 때 사용하는 전역 객체이다.

✨ 배열은 참조 자료형 데이터 타입이다.

자바스크립트에서 기본 데이터 타입(원시 타입)으로는
string, number, null, undefined, symbol이 존재한다.

참조형 데이터 타입으로는 Array와 Object가 존재한다.

   [1, 2, 3, 4, 5]라는 배열이 있을 때

• 배열은 순서가 있는 값을 의미한다.
• 배열에 들어있는 값을 요소(element)라고 한다.
• 배열의 순서는 인덱스(index)라고 한다. [0]부터 시작한다.
• 배열의 길이는 배열.length 이다. 인덱스의 끝은 length-1 이다.
• 배열 안에 각각의 요소(elemet)는 쉼표(comma)로 구분한다.

---

JavaScript에서 배열은 객체(Object)이다.

✨ 그렇기에 typeof()로 배열과 객체를 구분할 수 없다.

let arr = []; // Array
let obj = {}; // Object
​
/* typeof는 배열인지 객체인지 구분 불가 */
typeof(arr) // "object"
typeof(obj) // "object"
typeof(arr) === type(obj) // true
​
/* Array.isArray()를 통한 분별 */
Array.isArray(arr); // true
Array.isArray(obj); // false
​
/* 객체는 length 사용 불가 */
arr.length // 0
obj.length // undefined

---

자주 사용하는 연산

배열 만들기

let fruits = ['사과', '바나나']

console.log(fruits.length)
// 2

인덱스로 배열의 항목에 접근하기

let first = fruits[0]
// 사과

let last = fruits[fruits.length - 1]
// 바나나

배열의 항목들을 순환하며 처리하기

fruits.forEach(function (item, index, array) {
  console.log(item, index)
})
// 사과 0
// 바나나 1

배열 끝에 항목 추가하기

let newLength = fruits.push('오렌지')
// ["사과", "바나나", "오렌지"]
Copy to Clipboard

배열 끝에서부터 항목 제거하기

let last = fruits.pop() // 끝에있던 '오렌지'를 제거
// ["사과", "바나나"]
Copy to Clipboard

배열 앞에서부터 항목 제거하기

let first = fruits.shift() // 제일 앞의 '사과'를 제거
// ["바나나"]

배열 앞에 항목 추가하기

let newLength = fruits.unshift('딸기') // 앞에 추가
// ["딸기", "바나나"]

배열 안 항목의 인덱스 찾기

fruits.push('망고')
// ["딸기", "바나나", "망고"]

let pos = fruits.indexOf("바나나")
// 1

인덱스 위치에 있는 항목 제거하기

let removedItem = fruits.splice(pos, 1) // 항목을 제거하는 방법

// ["딸기", "망고"]

인덱스 위치에서부터 여러개의 항목 제거하기

let vegetables = ['양배추', '순무', '무', '당근']
console.log(vegetables)
// ["양배추", "순무", "무", "당근"]

let pos = 1
let n = 2

let removedItems = vegetables.splice(pos, n)
// 배열에서 항목을 제거하는 방법
// pos 인덱스부터 n개의 항목을 제거함

console.log(vegetables)
// ["양배추", "당근"] (원 배열 vegetables의 값이 변함)
console.log(removedItems)
// ["순무", "무"]

배열 복사하기

let shallowCopySpread = [...fruits]

// ["딸기", "망고"]

---

🔥배열의 복사(중요!)는 다음 게시글에 이어서 정리해 볼 것이다!!🔥