[JavaScript] 자바스크립트 - 배열 선언 및 초기화하기

안녕하세요. 이번 포스팅에서는 자바 스크립트에서 배열 객체를 생성하고 값을 초기화하는 방식에 대해서 알아보겠습니다.

 

변수는 데이터 한 개를 저장하는 저장소입니다. 데이터가 5개면 변수는 5개가 필요한 셈이죠. 반면에 배열의 경우는 하나의 저장소에 여러 개의 데이터를 저장하는 것이 가능합니다. 자바스크립트에서 배열을 생성하고 값을 초기화하는 다양한 방식에 대해 알아보고 배열의 데이터값에 접근하는 방법에 대해서도 알아보도록 하겠습니다.

---

1. 배열 생성 방법 #1

var 참조 변수 이름 = new Array();

참조변수[0] = 값1; 참조변수 [1] = 값2 ... 참조변수[n] = 값n

 

▼ 첫 번째 방식은 new 키워드를 통해 생성하는 방법입니다. 각 index 배열 요소에 접근하여 값을 초기화하기 위해 참조변수[n] = 값 n과 같은 방식을 사용합니다. 주의해야 할 점은 배열 Index는 0부터 시작한다는 점입니다. 아래 샘플예제는 위와 같은 방식으로 배열을 생성하고 값을 초기화하는 코드입니다. 

<script>
  var numbers = new Array();
  numbers[0] = 1; numbers[1] = 2; numbers[2] = 3; numbers[3] = 4; numbers[4] = 5;
</script>

▼ numbers 배열을 생성하고 각 배열의 Index 요소에 값을 할당합니다. 

 

배열 초기화 된 모습

---

2. 배열 생성 방법 #2

var 참조변수이름 = new Array(값1, 값2, 값3 ... 값n);

 

▼ 두 번째 방식은 new 키워드를 통해 객체를 생성하면서 초기화할 값들도 같이 설정하는 방식입니다. 실제 샘플예제를 통해 객체를 생성하는 방식을 보겠습니다.

<script>
  var numbers = new Array(1,2,3,4,5);
</script>

---

3. 배열 생성 방법 #3

var 참조변수이름 = [값1, 값2, 값3 ... 값n];

 

▼ 마지막 방법은 new 연산자를 사용하지 않고 배열 객체를 생성하는 방식입니다. [] 구문 안에 해당 배열 객체에 초기화할 값들을 넣어줍니다. 아래 샘플예제를 통해 실제 배열을 생성해보겠습니다.

<script>
  var numbers = [1,2,3,4,5];
  var strings = ['나무', '산', '바다'];
</script>

---

4. 배열 요소 출력하기

<script>
  var strings = ['나무', '산', '바다'];

  console.log(strings[0]);  // 나무 
      
  for(var i = 0; i < strings.length; i++)
  {
    console.log(strings[i]); // 나무 산 바다
  }
</script>

▼ 배열 객체의 Index를 통해 해당 위치의 값에 접근할 수 있습니다. 배열의 전체 요소에 대하여 출력하고 싶다면 위 코드와 같이 for 문을 통해서 처리할 수 있습니다.