[Javascript / 자바스크립트] 배열(array) 사용 방법과 예제

 

배열은 데이터들을 저장할 수 있는 리스트와 비슷한 객체입니다. 

인덱스(index)를 통해 배열의 원소에 접근할 수 있기 때문에 데이터들을 순차적으로 저장하거나 접근할 때 유용합니다. 

 

배열 생성 및 원소 접근 방법

 

• var arr = [];
  // 길이가 0인 배열 arr 생성
• var arr = [1, 2, 3];
  // 길이가 3인 배열 arr를 생성하고 원소를 1, 2, 3으로 초기화
• arr.length;
  // 배열 arr의 길이 반환
• arr[i];
  // 배열 arr의 i번째 원소 접근
  // 배열의 인덱스는 0부터 시작함 => 첫번째 원소: arr[0]

 

<사용 예시>

 

// 배열 생성
var colors = ['빨강', '파랑', '노랑'];
 
// 배열의 길이
var len = colors.length;    // len = 3
 
// 배열의 첫번째 원소 접근
colors[0];    // '빨강'
 
 
// 배열의 마지막 원소 접근
colors[len-1];    // '노랑'

배열의 원소 추가 및 삭제 방법

 

• arr.push(x);
  // arr의 맨 끝에 원소 x 추가
• arr.pop();
  // 마지막 원소를 제거한 arr 반환
• arr.shift();
  // 첫번째 원소를 제거한 arr 반환
• arr.unshift(x);
  // arr의 맨 앞에 원소 x 추가

 

<사용 예시>

 

var colors = ['빨강', '파랑', '노랑'];
 
// 배열의 마지막 원소 삭제
colors.pop();    // ['빨강', '파랑']
 
// 배열의 마지막에 원소 추가
colors.push('검정');    // ['빨강', '파랑', '검정']
 
// 배열의 첫번째 원소 삭제
colors.shift();        // ['파랑', '검정']
 
// 배열의 맨 앞에 원소 추가
colors.unshift('보라');        // ['보라', '파랑', '검정']

 

다른 자주 쓰는 메서드

• arr.indexOf(x);
  // arr 내에서 원소 x의 index 반환
• arr.slice(start, end);
  // arr의 start부터 end-1번째 원소까지를 부분배열로 반환
  // start의 디폴트 값은 0, end의 디폴트 값은 배열의 길이
• arr1.conat(arr2);
  // arr1과 arr2를 연결한 배열을 반환
• arr.sort();
  // arr의 원소를 오름차순으로 정렬

 

<사용 예시>

 

var arr1 = [1, 2, 3, 4];
 
// 원소의 인덱스 찾기
arr1.indexOf(1);        // 0
 
// arr1의 부분 배열 만들기
var arr2 = arr1.slice(0, 2);    // arr2 = [1, 2]
 
// arr1과 arr2를 연결하기
var arr3 = arr1.conat(arr2);    // arr3 = [1, 2, 3, 4, 1, 2]
 
// arr3 정렬하기
arr3.sort();    // arr3 = [1, 1, 2, 2, 3, 4]

 

 

 

 

공부한 것을 정리한 내용입니다. 수정할 부분이 있다면 알려주시면 감사하겠습니다 :)