[자료구조 공부] 자바스크립트 배열(순차 리스트) #3

☘️ 배열

배열은 연관된 데이터를 연속적인 형태로 저장하는 복합 타입으로, 배열에 포함된 원소는 순서대로 인덱스가 붙는다.

또한 배열은 탐색이 유리한 자료구조이다.

 

만약 배열의 요소를 추가 및 삭제하면 O(n) 이 소요된다.

그래서 요소의 추가와 삭제가 반복되는 로직일 경우 배열을 사용하지 않는 것이 좋다.

☘️ 배열 생성

자바스크립트에서 배열은 다음과 같이 다양한 방법으로 배열을 생성할 수 있다.

또한 자바스크립트에서 배열은 크기가 고정되어 있지 않고, 필요에 따라 줄이거나 늘릴 수 있다.

코드 실행 결과

☘️ 배열 요소 추가, 삭제 - push, pop, splice

push와 pop을 사용할 경우 빅오 표기법이 O(1) 이다.

그러나 splice를 사용하여 중간에 값을 추가하거나, 제거하면 빅오 표기법이 O(n) 이나 소요된다.

코드 실행 결과

자바스크립트 splice 문법

배열 요소 삭제

arr.splice(2,1);

splice() 함수에 전달한 첫번째 인수 2는 인덱스 2번부터 요소를 제거하라는 의미이고,

두번째 인수 1은 1개만 제거하라는 의미이다.

즉, 인덱스 2번부터 요소 한 개만 제거된다.

 

배열 요소 추가

arr.splice(4,0,100);

splice() 함수에 두번째 인수로 0을 전달하면 삭제하지 않고 새 요소를 추가할 수 있다.

즉, 인덱스 4번에부터 요소를 삭제하지 않고 100 이라는 요소가 추가된다.

 

☘️ 배열 요소 추가, 삭제 - shift, unshift, slice

shift와 unshift 함수를 사용해서 맨 앞에 있는 요소를 삭제하거나, 추가할 수 있다.

또한 slice 함수를 사용하여 원하는 부분을 잘라 보여줄 수 있지만, 기존 배열에는 반영되지 않아 따로 저장하여 사용해야 한다.

코드 실행 결과

☘️ 배열의 편의성 함수

join 함수

join 함수는 배열을 문자열로 만들어주고, 인자를 전달하지 않을 경우 , 로 배열을 문자열로 만들어준다. EX) 1,2,3,4,5

만약 원하는 문자로 이어주고 싶으면 아래 코드와 같이 원하는 문자열을 입력한다.

코드 실행 결과

reverse 함수

reverse 함수는 배열의 값들을 거꾸로 뒤집어 준다.

그러나 뒤집은 후에 원래 배열을 출력하면 뒤집은 상태가 되기 때문에 reverse 함수를 사용할 때엔 유의해야 한다.

코드 실행 결과

concat 함수

두 배열을 합쳐주기 위해 concat 함수를 사용할 수 있다.

코드 실행 결과

 

☘️ 배열 요소 출력

for 문을 사용해서 배열의 모든 값들을 출력할 수 있다.

하지만 최신 자바스크립트 문법인 for-of 문을 활용하여 배열의 값들을 다음과 같이 출력할 수 있다.

코드 실행 결과

☘️ 배열 인덱스

자바스크립트 배열의 인덱스는 다른 언어와 다르게 숫자만 사용할 수 있는 것이 아니라

문자열이나 boolean값을 사용할 수 있다.

(그러나 이런식으로 배열을 사용하는 방법은 추천하지 않음)

코드 실행 결과

이렇게 인덱스로 문자열과 boolean값을 사용할 수 있는 이유는 바로 자바스크립트의 배열은 근본적으로 객체 타입이기 때문이다.

// 객체란? 여러 값들을 key-value 형태로 결합시킨 복합 타입
{ name: "짱잼", gender: "F" }

그래서 자바스크립트에서 배열의 타입을 출력해보면 object(객체)가 나온다.

코드 실행 결과

☘️ 객체

객체는 아래에 있는 코드처럼 생성할 수 있고, 요소를 추가 및 삭제를 할 수 있고 각각 key와 value들을 배열값으로 얻을 수 있다.

코드 실행 결과

 

---

 

해당 게시물은 프로그래머스 - 코딩테스트 광탈 방지 A to Z : JavaScript 강의를 참고하여 작성한 글입니다. (유료강의)

코딩테스트 광탈 방지 A to Z : JavaScript