[JS] 자바스크립트 - 배열

📌 배열(array)

배열은 여러 자료를 묶어서 활용할 수 있는 특수한 자료다.

 

📌 배열 만들기

[요소, 요소, 요소, 요소, ... , 요소]

배열은 여러 개의 변수를 한 번에 선언해 다룰 수 있는 자료형이다.

대괄호[...]를 사용해 생성하고 내부의 값을 쉼표(,)로 구분해 입력한다.

배열 내부에 들어 있는 값을 요소(element)라고 한다.

어떠한 종류의 자료형도 요소가 될 수 있다.

 

const arr = [176, 'String', true, function () { }, {}, [123, 456]]

 

📌 배열 요소에 접근하기

배열[인덱스]

배열의 기본적인 조작은 문자열과 비슷하다. → 인덱스(index)를 사용하여 접근할 수 있다.

 

 

const array = [279, 1013, 'SSAFY', 'AI', true, false]

console.log(array[0]); // 279
console.log(array[1]); // 1013
console.log(array[2]); // 'SSAFY'
console.log(array[3]); // 'AI'
console.log(array[4]); // true
console.log(array[5]); // false

 

배열이 요소에 접근하여 값을 변경할 수 있다.

 

array[0] = 0;
console.log(array[0]); // 0

 

📌 배열 요소 개수 확인하기

배열.length

 

const name = ['Kim', 'Park', 'Lee', 'Choi']

name.length // 4

name[name.length - 1] // 'Choi'

 

※ 배열의 마지막 요소를 선택할 때 자주 사용하는 패턴 : arr.length - 1

cf) 파이썬 : arr[-1]

📌 배열 뒷부분에 요소 추가하기

배열.push(요소)

 

const fruits = ['apple', 'banana', 'graph']

fruits.push('tomato')

console.log(fruits) // ['apple', 'banana', 'graph', 'tomato']

 

cf) 파이썬 : arr.append(value)

 

(주의)인덱스를 사용해 배열 뒷부분에 요소 추가하기

 

자바스크립트에서 배열의 길이는 고정이 아니기 때문에 길이 이상의 인덱스로 요소를 추가하면 중간에 빈 자리는 empty가 된다.

const temp = ['A', 'B', 'C']

temp[10] = 'Z'

console.log(temp) // ['A', 'B', 'C', empty x 7, 'Z']

 

📌 배열 요소 제거하기

배열의 요소를 제거하는 일반적인 방법은 2가지가 있다.

1. 인덱스를 기반으로 제거
2. 값을 기반으로 제거

1. 인덱스를 기반으로 제거

배열.splice(인덱스, 제거할 요소의 개수)
하나의 값을 제거하려면 두 번째 매개변수에 1을 지정하면 된다.

const brand = ['Samsung', 'LG', 'Apple']

brand.splice(2, 1) // 'Apple'

console.log(brand) // ['Samsung', 'LG']

cf) 파이썬 : del arr[index]

 

2. 값을 기반으로 제거

const index = arr.indexOf(element)
arr.splice(index, 1)

indexOf() 메소드는 배열 내부에 요소가 있을 경우 해당 인덱스를 리턴하지만, 찾고자 하는 요소가 없을 경우 -1을 리턴한다.

 

const alpha = ['A', 'B', 'C']

const index = alpha.indexOf('B')

index // 1

alpha.splice(index, 1) // 'B'

console.log(alpha) // ['A', 'C']

alpha.indexOf('B') // -1

 

※ splice() 메소드는 배열 내부 요소를 하나만 제거할 수 있다. 만약, 배열 내부에서 특정 값을 모두 제거하고 싶으면 '반복문' 또는 'filter()' 메소드를 사용하면 된다.

const alpha = ['A', 'B', 'C', 'C', 'C']

alpha.filter((item) => item !== 'C')

alpha // ['A', 'B']

 

📌 배열의 특정 위치에 요소 추가하기

arr.splice(index, 0, element)

splice() 메소드는 배열의 특정 위치에 요소를 추가할 때도 사용하고, 제거할 때도 사용한다.

 

const alpha = ['A','C']

alpha.splice(1, 0, 'B')

alpha // ['A', 'B', 'C']

 

---

※ 참고도서 : 혼자 공부하는 자바스크립트(혼공스)