[생활코딩] javascript - 객체

본 강의 학습은 [생활코딩]를 통하여 학습하고 있습니다.

JavaScript - 객체 (1/3) : 객체의 문법

지금까지 살펴본 배열은 아이템에 대한 식별자로 숫자를 사용

데이터가 추가되면 배열 전체에서 중복되지 않는 인덱스가 자동으로 만들어져서 추가된 데이터에 대한 식별자가 된다. 이 인덱스를 이용해서 데이터를 가져오게 되는 것이다. 

만약 인덱스로 문자를 사용하고 싶다면 객체(dictionary)를 사용해야 한다. 

다른 언어에서는 연관배열(associative array) 또는 맵( map), 딕셔너리(Dictionary)라는 데이터 타입이 객체에 해당한다.

- 객체의 생성

var grades = {'egoing': 10, 'k8805': 6, 'sorialgi': 80};

: egoing은 key가 되고, 10은 value가 된다

- 다른 객체 생성 방법

var grades = {};

grades['egoing'] = 10;

grades['k8805'] = 6;

grades['sorialgi'] = 80;

- 다른 객체 생성 방법

var grades = new Object();

grades['egoing'] = 10;

grades['k8805'] = 6;

grades['sorialgi'] = 80;

- 객체 출력

var grades = {'egoing': 10, 'k8805': 6, 'sorialgi': 80};

alert(grades['sorialgi']); // 80 출력

alert(grades.sorialgi); // 80 출력

JavaScript - 객체 (2/3) : 객체와 반복문의 조우

var grades = {'egoing': 10, 'k8805': 6, 'sorialgi': 80};

for(key in grades) {

    document.write("key : "+key+" value : "+grades[key]+"<br />");

}

- 실행 결과

key : egoing value : 10

key : k8805 value : 6

key : sorialgi value : 80

for 문은 in 뒤에 따라오는 배열의 key 값을 in 앞의 변수 name에 담아서 반복문을 실행한다. 

반복문이 실행될 때 변수 key의 값으로 egoing, k8805, sorialgi가 순차적으로 할당되기 때문에 grades[key]를 통해서 객체의 값을 알아낼 수 있다.

객체에는 객체를 담을수도 있고, 함수도 담을 수 있다

JavaScript - 객체 (3/3) : 객체지향 프로그래밍

var grades = {

    'list': {'egoing': 10, 'k8805': 6, 'sorialgi': 80}

};

alert(grades['list']['egoing']); // 10 출력

var grades = {

    'list': {'egoing': 10, 'k8805': 6, 'sorialgi': 80},

    'show' : function(){

        alert('Hello world');

};

alert(grades['show']()); // Hello world 출력

: 객체 안에는 함수도 포함 시킬 수 있다.

this 키워드 : 약속된 키워드(이미 정의된)

객체를 가리키는 변수, 함수가 소속 되어 있는 객체를 가리킨다.

var grades = {

    'list': {'egoing': 10, 'k8805': 6, 'sorialgi': 80},

    'show' : function(){

        for(var name in this.list){

            document.write(name+':'+this.list[name]+"<br />");

//this.list > grades['list']를 가리키는 것임

//console.log(name, this.list[name]);

        }

    }

};

grades.show(); //grades.['show'](); 이렇게 표현도 가능 하다.

- 실행 결과

egoing:10

k8805:6

sorialgi:80

grades는 list과 show 그룹핑한다. 서로 연관되어 있는 데이터를 묶어 놓는것

이것이 객체지향 프로그래밍이다.