JavaScript 객체(object)

yo·2020년 4월 26일
0

객체는 배열과 비슷하다.
배열은 아이템에 대한 식별자로 숫자를 사용했다.
데이터가 추가되면 배열 전체에서 중복되지 않는 인데스가 자동으로 만들어져서 추가된 데이터에 대한 식별자가 된다. 이 인덱스를 이용해서 데이터를 가져오게 되는 것이다. 만약 인덱스로 문자를 사용하고 싶다면 객체(dictionary)를 사용해야 한다. 다른 언어에서는 연관배열(associative array)또는 맵(map), 딕셔너리(Dictionary)라는 데이터 타입이 객체에 해당한다.

아래는 객체 만드는 법이다. kim, lee, park은 key고, 10, 20, 60은 value가 된다.
var grades = {'kim': 10, 'lee': 20, 'park': 60};

객체를 만드는 또다른 방법:

var grades = {};
grades['kim'] = 10;
grades['lee'] = 20;

혹은

var grades = new Object();
grades['kim'] = 10;
grades['lee'] = 20;

객체의 key값으로 value를 불러오는 방법은 몇가지가 있다. 아래 예시에선 모두 10이 출력된다.

var grades = {'kim': 10, 'lee': 20, 'park': 60};
grades['kim'];   혹은 grades['k'+'im']
var grades = {'kim': 10, 'lee': 20, 'park': 60};
grades.kim    (위처럼 플러스 연산자로 불러올 순 없다.)

객체와 반복문

var grades = {'kim': 10, 'lee': 20, 'park': 70};
for(tomato in grades){
	document.write("key: "+tomato+" value: "+grades[tomato]+" <br />");
}

위 코드의 결과
key: kim value: 10
key: lee value: 20
key: park value: 70

객체에 담을 수 있는 것들

객체에는 객체, 함수 등을 담을 수도 있다.
아래 코드엔 grades란 객체에 객체 list와 함수 show를 담았고, alert로 함수 show를 호출 했다.
결과는 Hello world가 된다.

var grades = {
	'list': {'kim':11, 'lee':22, 'park':33},
	'show': function(){
		alert("Hello world")
	}
}
alert(grades['show']());

아래 코드에서 this라는 개념이 중요하다. 여기서 this는 grades라는 부모 객체를 의미한다. this.list라 했으니 해당 코드가 속한 객체 grades에 잇는 list를 출력하겠다는 뜻이다. 그러므로 함수 show를 실행하면 결과는'kim':11, 'lee':22, 'park':33 이거다.

var grades = {
	'list': {'kim':11, 'lee':22, 'park':33},
	'show': function(){
		alert(this.list);
	}
}

var grades = {
'list': {'kim':11, 'lee':22, 'park':33},
'show': function(){
for(var name in this.list){
console.log(name, this.list[name]);
}
}
}
grades.show();

profile
Never stop asking why

0개의 댓글