Front-end/JavaScript

자바스크립트 배열

NiceKHJ 2024. 7. 29. 12:49

배열이란?

 

배열은 여러 데이터를 순차적으로 저장하는 자료구조 입니다. 자바스크립트에서 배열은 객체의 특별한 형태로 다양한 타입의 요소를 포함할 수 있고 동적으로 크기가 조절됩니다.

 

1. 배열 생성

 

배열을 생성하는 두 가지 주요 방법이 있습니다.

 

  1. 배열 리터럴 
    • 대괄호를 사용하면 간단하게 배열 생성 가능
      const number = [1 , 2 , 3];
  2. Array() 생성자
    • new Array() 구문을 사용하여 배열을 생성할 수 있습니다. 요소들을 전달하거나 숫자를 전달하여 빈 배열을 생성할 수 있습니다.
      const number = new Array(1,2,3,4,5);
      const numberlength = new Array(5);

2. 배열 요소 접근 및 수정

 

배열의 요소에 접근하거나 수정할 때는 인덱스를 사용합니다. 인덱스는 0부터 시작합니다.

const color = ["skyblue","red","black"];

console.log(color[1]); // red

color[0] = "yellow";

console.log(color); // ["yellow","red","black"]

 

3. 배열 길이

 

length 속성을 사용하여 배열의 길이를 확인하거나 변경할 수 있습니다.

const number =[1,2,3,4,5];

console.log(number.length); // 5

 

number.length = 3;

console.log(number); // [1,2,3]

 

4. 배열 메서드

 

자바스크립트는 배열을 다루기 위한 다양한 내장 메서드를 제공합니다.

 

push() & pop()

 

push() : 배열의 끝에 요소를 추가합니다.pop() : 배열의 마지막 요소를 제거하고 반환합니다.

 

unshift() & shift()

 

unshift() : 배열의 시작에 요소를 추가합니다.

shift() : 배열의 첫 번째 요소를 제거하고 반환합니다.

 

join()

 

join() : 배열의 모든 요소를 문자열로 결합합니다.

 

slice()

 

slice() : 배열의 일부를 새로운 배열로 반환합니다.

 

splice()

 

splice() : 배열의 기존 요소를 제거하거나 새 요소를 추가합니다.

 

forEach()

 

forEach() : 배열의 각 요소에 대해 제공된 함수를 한번씩 실행하는 메서드 입니다.

 

 

value : 처리할 현재 요소

index(선택적) : 처리할 현재 요소의 인덱스

array(선택적) : forEach()를 호출한 배열

 

 

map()

 

map() : 배열의 모든 요소에 대해 주어진 함수를 호출한 결과로 새로운 배열을 만듭니다.

 

 

filter()

 

filter() : 특정 조건에 부합하는 값만 모아서 새로운 배열을 만들어서 리턴합니다.

 

 

reduce()

 

reduce() : 배열의 각 요소에 대해 주어진 리듀서 함수를 실행하고 하나의 결과값을 반환합니다.

 

find() & findIndex()

 

find() : 조건을 만족하는 첫 번째 요소를 반환합니다.

findIndex() : 조건에 만족하는 요소의 인덱스를 반환합니다.

 

 

some() & every()

 

some() :  배열의 1개 요소라도 특정 조건을 충족하는지 확인하는데 사용한다. (or)

every() : 배열의 모든 요소가 조건을 충족하는지 확인하는데 사용한다. (and)

 

 

6. 배열 순회

 

배열의 모든 요소를 순회하는 여러 방법이 있습니다.

 

for 루프

전통적인 for 루프를 사용하여 배열을 순회할 수 있습니다.

 

 

for...of 루프

ES6에서 도입된 for...of루프를 사용하면 더 간단하게 배열을 순회할 수 있습니다.

 

 

6. 다차원 배열

 

배열 안에 배열을 포함하여 다차원 배열을 만들 수 있습니다.

 

7. 배열 복사

 

배열을 복사하는 방법에는 얕은 복사깊은 복사가 있습니다.

 

 

얕은 복사

객체의 참조값 복사.

스프레드 연산자를 사용하여 배열을 얕게 복사할 수 있습니다.

 

깊은 복사

객체의 실제 값 복사.

중첩된 객체나 배열이 있는 경우 JSON메서드를 사용하여 깊은 복사를 할 수 있습니다.

 

8. 배열 병합

 

스프레드 연산자를 사용하여 여러 배열을 쉽게 병합할 수 있습니다.