#2 자바스크립트(JavaScript) - 자료형(Data type) : 복합형(배열, 객체)

안녕하세요 여러분! 에이블디입니다!

오늘은 지난 시간에 이어 복합 자료형에 대해 알아보겠습니다!

복합형에는 배열과 객체가 있는데요! 하나하나씩 알아보도록 하겠습니다!

배열은 하나의 변수에 여러 값을 저장할 수 있는데요!

에이블디의 학생의 이름을 변수에 저장할 때 배열을 사용하지 않으면 다음과 같이 변수 선언을 하고 값을 할당할 수 밖에 없습니다.

var yama = "야마";
var charlie = "찰리";
var lucas = "루카스";
var kevin = "케빈";
var summer = "서머";

학생이 늘어나면 늘어날수록 변수선언을 계속해서 해야겠죠?

여기서 배열을 사용해 보겠습니다!

var student = ["야마", "찰리", "루카스", "케빈", "서머"];

5줄로 작성했던 코드가 1줄로 줄어들었네요!
배열은 저장할 자료를 대괄호([]) 안에 쉼표로 구분해서 넣어주면 됩니다!

var student[];

위와 같이 대괄호 안에 자료를 입력하지 않으면 빈 배열이 만들어지게 됩니다.

그럼 배열에 있는 값을 어떻게 가져올 수 있을까요?

배열은 배열 이름만 사용하면 배열 내용 전체를 가져오고, 배열 이름과 대괄호([])안에 주소 값(Index)을 넣어주면 해당 주소에 저장된 값만 가져오는데요, 주소 값은 0부터 시작하게 됩니다.
아래 예시를 보면서 이해해 보세요!

var student = ["야마", "찰리", "루카스", "케빈", "서머"];

student
-> ["야마", "찰리", "루카스", "케빈", "서머"]

student[0]
-> "야마"
student[1]
-> "찰리"
student[2]
-> "루카스"
student[3]
-> "케빈"
student[4]
-> "서버"

아래의 이미지는 실제로 코드를 작성하고 실행시켜 콘솔에 결괏값이 출력된 모습입니다.

객체(object)는 여러 자료를 중괄호({})안에 넣을 수 있는데요, 여러 자료를 하나의 변수에 넣을 수 있는 점은 배열과 비슷하지만 저장하는 값의 모양이 다릅니다.
키(key)와 값(value)을 콜론(:)을 사용하여 한 쌍을 만들어 주어야 합니다.

var yama = {
    name: "야마",
    position: "개발자",
    age: "34",
    phone: "010-1234-5678",
    email: "yama@yama.com"
}

위의 코드를 보시면 yama라는 변수에 여러 자료를 중괄호 안에 넣은 게 보이시죠?
여기서 중괄호 안에 있는 자료의 name는 키이고 "야마"는 값입니다.
그리고 쉼표(,)를 사용하여 자료를 구분해 준 것을 볼 수 있습니다.

조금 더 이해를 쉽게 하기 위하여 직접 코드를 작성해 실행시킨 후 콘솔에 출력해 보았습니다.

객체는 자바스크립트에서 아주 큰 비중을 차지하는 개념입니다.
이번 시간에는 객체의 구조만 간단하게 확인하고, 객체에 대해서는 따로 포스팅하여 풀어드리겠습니다.

오늘은 간단하게 배열과 객체에 대해 알아보았습니다!

그럼 여러분 다음 시간에 또 만나요!