자바스크립트 객체(object)

 

객체 ( Object )

객체는 키, 요소(속성), 메소드로 이루어져 있다.

객체는 {}(중괄호) 로 생성한다.

 

예제)

var car = { 	name : '소나타', 	displacement : '2000cc', 	type : '승용차', 	tire : 4, 	drive : function (){  		document.write("메서드 호출."); 	} };   

 

 

위 예제에서  키,요소(속성), 메서드는 아래와 같이 구분된다.

 

키 : name, displacement, type, tire

요소(속성) :  '소나타', '2000cc', '승용차',4

메소드 : drive

 

키 와 요쇼(속성)

객체를 대입한 변수에서 키를 이용하여 객체의 요소에 접근하는 방법을 알아보자.

 

객체변수['키'] => 요소(속성)

객체변수.키 => 요소(속성)

 

예제)

document.write("대괄호( [] )를 이용한 요소(속성)접근 : car['name'] => " + car['name'] + "
"); document.write("점( . )를 이용한 요소(속성)접근 : car.name => " + car.name + "
"); 

 

 

출력

대괄호( [] )를 이용한 요소(속성)접근 : car['name'] => 소나타

점( . )를 이용한 요소(속성)접근 : car.name => 소나타

 

메서드

객체안에 있는 함수(function)을 메서드라 한다.

 

// car 객체의 drive() 메서드 호출 car.drive();   

 

출력 

메서드 호출.

 

for in 반복문

객체의 요소에 일일이 키를 입력하여 접근하는 방법도 있지만, 우리는 개발자이므로 좀 더 개발자답게 접근해본다.

for in 반복문은 객체의 요소 만큼 반복문을 실행한다.

key 변수에 차례로 객체의 키가 대입된다.

 

 

 

// for in 반복문을 이용한 방법  for(var key in car){ 	document.write("car[" + key + "] : " + car[key] + "
"); }  

 

 

출력

car[name] : 소나타

car[displacement] : 2000cc

car[type] : 승용차

car[tire] : 4

car[drive] : function (){ document.write("메서드 호출."); }

 

객체 속성 동적 생성

아래와 같이 속성을 동적으로 추가한다.

객체.속성 = 속성값;

 

car.manufacturer  = '현대'; for(var key in car){ 	document.write("car[" + key + "] : " + car[key] + "
"); } 

 

 

출력

car[name] : 소나타

car[displacement] : 2000cc

car[type] : 승용차

car[tire] : 4

car[drive] : function (){ document.write("메서드 호출."); }

car[manufacturer] : 현대

 

*  manufacturer 속성이 추가되었다.  

 

객체 속성 동적 제거

아래와 같이 속성을 동적으로 제거한다.

delete(객체.속성)

 

delete(car.tire); for(var key in car){ 	document.write("car[" + key + "] : " + car[key] + "
"); }  

 

 

 

출력

car[name] : 소나타

car[displacement] : 2000cc

car[type] : 승용차

car[drive] : function (){ document.write("메서드 호출."); }

car[manufacturer] : 현대

 

* tire 속성이 삭제 되었다.