[JavaScript] 배열과 객체

배열과 객체, 그리고 이를 다루는 각종 method는 JavaScript의 꽃이다. 어떤 상황에 어떤 메소드를 활용하느냐에 따라 코딩효율이 어마어마하게 차이가 난다!! 오늘은 객체와 배열에 대해 먼저 정리해보겠다. 내일은, 문제를 풀 때 사용했던 각종 method를 정리할 예정이다.

 

배열 ( Array )

배열은 쉽게 말해 변수 혹은 상수의 묶음이다. 아래의 예를 보자.

let array = [ 1,                      // typeof(1) === 'number'
              true,                   // typeof(true) === 'boolean'
              'gray',                 // typeof('gray') === 'string'
              undefined,              // typeof(undefined) === undefined
              { // object             // typeof(object) === 'object'
                 firstName: 'Gray', 
                 lastName: 'Park' 
              }, 
              function foo()          // typeof(foo()) === 'function'
            ]; // 배열은 변수로 선언 및 할당하기 때문에 마지막에 반드시 세미콜론(;)을 입력합니다.
            
typeof(array); // 'object'
Array.isArray(array) // true

배열에서 콤마( , )로 구분되는 하나의 변수를 '배열 요소' ( an element of array ) 라고 한다. 배열은 배열요소의 유한집합이며, 배열요소에는 모든 타입이 들어갈 수 있다. 배열 요소의 순서를 나타낼 때 우리는 인덱스 ( index )라는 표현을 사용한고, 인덱스는 항상 0부터 시작한다.

 

특이하게도 배열의 타입은 'array'가 아니라 'object'이다. object는 아래에서 다루므로 여기서는 건너뛰겠다. 대신, JavaScript의 타입이 정의된 MDN 링크를 공유하겠다.

 

typeof로 확인할 수 없는 배열은, Array.isArray() 메소드로 true/false 값을 반환받아 확인할 수 있다!

 

객체 ( object )

객체는 쉽게 말해 정보의 덩어리이다. 이름이 지정된 프로퍼티 ( property ) 의 모음이고, 키: 값 ( key: value )의 쌍으로 이루어져 있다. 배열과 마찬가지로 object 내에서도 모든 타입의 변수 혹은 값이 value로 들어갈 수 있다. key는 값을 찾기위한 열쇠인데, 아무래도 예시를 보는 게 이해가 가장 빠르다.

const object = { firstName: 'Gray', // key: value,
                 lastName: 'Park',  // key: value,
                 age: 28,           // key: value,
                 isMale: true,      // key: value,
                 isArray: false,    // key: value,
                 objects: {}        // key: value <<- 마지막에는 콤마(,)를 붙이지 않는다.
               };
console.log(object.firstName);   // 'Gray'
console.log(object['lastName']); // 'Park' // object.lastName === object['lastName']
console.log(object.age);         // 28
console.log(object.isMale);      // true
console.log(object.isArray);     // false
console.log(object.objects);     // {}

// 아래의 코드를 개발자 도구에서 실행해보자. (x, 2)의 표로 정리된 object를 확인할 수 있다.
console.table(object);

오브젝트는 key-value pair로 이루어진 덩어리이며, objectName.keyName 혹은 objectName['keyName'] 와 같이 두가지 방법으로 value에 접근할 수 있다. 배열과 마찬가지로 아주 많은 메소드를 가지고 있다.

typeof(object) // 'object'

 

오늘은 제법 피곤한 관계로 [JavaScript]를 꽃피운 객체와 오브젝트의 각종 메소드는 다음 블로깅에서 작성하겠다.