배열이란? (array)

배열은 여러개의 값을 순차적으로 나열한 자료구조다. 배열이 가지고 있는 값을 요소(element)라고 부르며, 자바스크립트의 원시값과 객체, 함수, 배열 등, 즉 모든 값이 배열의 요소가 될 수 있다.
대부분의 프로그래밍 언어에서 배열 요소의 인덱스(index)는 맨 앞의 요소에서 0부터 시작한다. 배열의 요소는 배열에서 자신의 위치를 나타내는 0이상의 정수인 인덱스를 갖으며, 인덱스는 배열의 요소에 접근 할때 사용한다.

• 인덱스(index) : 배열의 순서, 위치를 나타내며 1이 아닌 0부터 시작한다.
  즉, 문자열에서의 해당 순서(인덱스)에 있는 문자를 조회하는 것 처럼, 배열에서는 배열의 해당 순서(인덱스)에 있는 요소를 찾는 데 사용한다.

arr[index] : 배열의 값(요소)를 조회

대괄호 내에는 접근하고 싶은 요소의 인덱스를 지정한다.
배열의 값(요소)는 인덱스로 조회하거나 변경할 수 있다.
배열에 없는 인덱스를 조회할 경우, undefined라는 값을 반환한다.

// fruits 배열의 2번째 인덱스의 값은?
let fruits = ['banana', 'apple', 'pineapple'];
console.log(fruits[2]) // 'pineapple'

// fruits 배열의 3번째 인덱스의 값은?
console.log(fruits[3]) // undefined // 배열의 인덱스에 없는 인덱스를 조회할 경우! 

인덱스 [index] : 배열의 값을 변경

변수처럼 해당 배열의 인덱스에 값을 할당해주면, 해당 인덱스의 배열의 값이 변경된다.

// 배열의 3번째 인덱스의 값을 변경하려면?
let myNumber = [73, 98, 86, 61, 96];  
myNumber[3] = 200;
console.iog(myNumber) // [73, 98, 86, 200, 96] 3번째 인덱스의 61이 200으로 변경됨.

이중배열(이차원배열)

자바스크립트의 2차원 배열은 1차원 배열 안에 또 다른 배열이 중첩한 것 (추가한 것)을 2차원 배열이라고 한다.

// myNumber의 1번째 인덱스 값은? 
let myNumber = [[13, 30], [73, 8], [44, 17]];
console.log(myNumber[1]) // [73, 8]

// 1번째 인덱스 값의 0번째 인덱스 값은?
console.log(myNumber[1][0]) // 73

length 프로퍼티

length 프로퍼티를 이용해서 배열의 요소의 개수, 즉 배열의 길이를 알아 낼 수 있다.

.length 온점(dot)을 이용해서 변수가 가지고 있는 속성(property)에 접근할 수 있다.

// familyName라는 배열의 길이를 알아내려면? 
let familyName = [ys, mh, hk, yj];

console.iog(familtName.length) // 4 

배열과 반복문의 조합

배열과 반복문은 조합되어 많이 사용된다. 기본적인 문제를 풀어보며 어떻게 사용되는지 알아볼 수 있다.

예제1) 반복문을 이용해 배열의 요소를 한번씩 출력하려면?
배열 myNum의 n번째 인덱스를 출력하자 → console.log(myNum[n]) (배열의 값은 인덱스로 조회할 수 있다)

조건1) 숫자(n)은 0부터 시작된다.→ let n = 0; 초기화
(인덱스는 0부터 시작한다.)
조건 3) 숫자(n)은 배열의 길이보다 작을 때까지 반복한다. → n < myNum.length; 조건문
(배열의 인덱스는 배열의 길이보다 항상 작기때문)
조건 4) 숫자 (n)은 1씩 증가한다. → n++; ( n = n+1 랑 같음) 증감문
(모든 배열을 출력해야해서 1씩 증가하며 배열을 다 조회한다.)

let myNum = [73, 98, 86, 61];  
for(let n = 0; n < myNum.length; n++) {
  console.log(myNumber[n]) // 
}

예제 2) myNum의 모든 요소를 누적해서 더하기 위해 필요한 조건과, 반복할 구문을 생각해서 적어보기

조건 1) 숫자(n)은 0부터 시작한다. → let n = 0
조건 2) 숫자(n)은 배열의 길이보다 작을 때 까지 반복한다.→ n < myNum.lenght
조건 3) 숫자(n)은 1씩 증가한다. → n ++
내용 4) 인덱스를 통해 구한 모든 배열요소를 누적해서 더한다 → sum = sum + myNum[n]

let myNum = [10, 20, 40, 10];  
let sum = 0
for(let n = 0; n < myNum.length; n++) {
    sum = sum + myNum;
}  // 0 + 10 -> sum + myNum[0]  
   // 10 + 20 -> sum + myNum[1]
   // 30 + 40 -> sum + myNum[2] 
   // 70 + 10 -> sum + myNum[3] 
  console.log(sum) // 80;

tip.

console.table(arr)

콘솔로그로 배열을 볼 수 있지만, 테이블을 이용하면 표로 한 눈에 볼 수 있다.

let arr = ['young', 'seo']
console.log(arr) // ["young", "seo"]
console.log(console.table(arr))

✏️ 추가 학습

• 배열 메서드를 활용한 코플릿 문제풀이를 통해 각각의 메서드를 어떤 코드에 사용해야하는지 파악한다.

  출처
  MDN
  코드스테이츠