관리 메뉴

거니의 velog

(7) Modern JavaScript 입문 7 본문

JS_Modern JS(ES6 이후)

(7) Modern JavaScript 입문 7

Unlimited00 2023. 11. 1. 08:41

7. 배열

* 이번에는 배열을 배워보자. 이전에 배운 객체는 한 변수 혹은 상수에 여러 가지 정보를 담기 위함이었다면, 배열은 여러 개의 항목들이 들어 있는 리스트와 같다.

* 예를 들어서 숫자 배열을 선언해 보자.

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

* 배열을 선언할 떄는 이렇게 [ ] 안에 감싸주면 된다.

* 또한 배열 안에는 어떤 값이던지 넣을 수 있다.
   예를 들어서, 객체 배열을 만들어 보자.

const objects = [{ name: '멍멍이' }, { name: '야옹이' }];

* 배열을 선언하고 나서, n 번째 항목을 조회하고 싶을 땐 다음과 같이 할 수 있다.

objects[n];

* 한 번 다음의 코드를 입력해 보자.

const objects = [{ name: '멍멍이' }, { name: '야옹이' }];

console.log(objects);
console.log(objects[0]);
console.log(objects[1]);

* 여기서 주의할 점은, 첫번째 항목이 objects[1] 이 아니라 objects[0] 이라는 것이다. 즉, 인덱스 넘버(index number)는 0부터 시작한다는 사실을 알 수 있다.
  여기서 objects[1] 이 두번째 항목입니다.


(1) 배열에 새 항목 추가하기

* 배열에 새로운 항목을 추가 할 때에는 배열이 지니고 있는 내장 함수인 push 함수를 사용한다.

const objects = [{ name: '멍멍이' }, { name: '야옹이' }];

objects.push({
  name: '멍뭉이'
});

console.log(objects);

* 멍뭉이가 object[2] 에 잘 추가된 모습을 볼 수 있다.


(2) 배열의 크기 알아내기

* 배열의 크기를 알아낼 때에는 배열의 length 값을 확인한다.

const objects = [{ name: '멍멍이' }, { name: '야옹이' }];

console.log(objects.length);

objects.push({
  name: '멍뭉이'
});

console.log(objects.length);

* length가 2에서 push 함수 이후에 3으로 증가한 모습을 볼 수 있다.

* 배열이 push와 length 말고도 다양한 기능을 가지고 있다. 이에 대해선 나중에 다시 알아보자.

'JS_Modern JS(ES6 이후)' 카테고리의 다른 글

(9) Modern JavaScript 입문 9  (0) 2023.11.01
(8) Modern JavaScript 입문 8  (0) 2023.11.01
(6) Modern JavaScript 입문 6  (0) 2023.10.31
(5) Modern JavaScript 입문 5  (0) 2023.10.31
(4) Modern JavaScript 입문 4  (0) 2023.10.31