배열이란?
배열은 여러 데이터를 순차적으로 저장하는 자료구조 입니다. 자바스크립트에서 배열은 객체의 특별한 형태로 다양한 타입의 요소를 포함할 수 있고 동적으로 크기가 조절됩니다.
1. 배열 생성
배열을 생성하는 두 가지 주요 방법이 있습니다.
- 배열 리터럴
- 대괄호를 사용하면 간단하게 배열 생성 가능
const number = [1 , 2 , 3];
- 대괄호를 사용하면 간단하게 배열 생성 가능
- Array() 생성자
- new Array() 구문을 사용하여 배열을 생성할 수 있습니다. 요소들을 전달하거나 숫자를 전달하여 빈 배열을 생성할 수 있습니다.
const number = new Array(1,2,3,4,5);
const numberlength = new Array(5);
- new Array() 구문을 사용하여 배열을 생성할 수 있습니다. 요소들을 전달하거나 숫자를 전달하여 빈 배열을 생성할 수 있습니다.
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. 배열 병합
스프레드 연산자를 사용하여 여러 배열을 쉽게 병합할 수 있습니다.
'Front-end > JavaScript' 카테고리의 다른 글
자바스크립트 에러 처리 (0) | 2024.08.01 |
---|---|
자바스크립트 표준 내장 객체(Standard Built-in Object) (6) | 2024.07.31 |
자바스크립트 호이스팅 (0) | 2024.07.24 |
자바스크립트의 실행 컨텍스트 / 스코프 / 클로저 (2) | 2024.07.24 |
자바스크립트 변수의 종류와 범위 (지역 변수 등) (0) | 2024.07.24 |