[JAVASCRIPT]2. JAVASCRIPT(자바스크립트) 의 객체

배열과 객체는 대단히 유사하다 !

 

차이점은,

배열은 인덱스가 0 부터 순서대로그냥 정해진다.

객체(object)는 인덱스에 문자열을 쓸 수 있음 -> 우리가 원하는 데이터를 인덱스(Key)로 정할 수 있음.

 

// 객체 만들기

var grades = {'david':10, 'sam':6 , 'pedro':30};
// david , sam, pedro 는 모두 key 값
// 10,6,30 은  value 값

 

// 객체 가져오기 

//만약 david 의 value 를 가져오고 싶으면,

  //첫번째 방법
  grades['david']       // 결과 : 10

  //두번째 방법
  grades.david          // 결과 : 10

 

↓반복문을 통해 객체를 다루는법

 

// 반복문을 통해 객체를 차례대로 읽는법

var grades = {'david':10, 'sam':6 , 'pedro':30};

for( key in grades ){  // 이 key 안에 david, sam ,pedro 가 순서대로 들어감
	console.log(key); // 결과 : dabvid, sam, pedro 순서대로 출력
	console.log("key : " +key+ ", value : " +grades[key]+ "<br />"); // 결과 :
    							  		// key : david ,value : 10 
                                                                     // key : sam ,value : 6 
                                                                     // key : pedro ,value : 30 
} 



// key 라는 이름은 바뀔 수 있다 => ex) name 으로

for( name in grades ){  
	console.log(name); 							  		
} 

 

↓객체에는 무엇이 담길 수 있는가?

 

// 객체에는 무엇을 담을 수 있는가?


//객체
var grades = {
	'list' : { 'david' :10 ,'sam':8 , 'pedro':30 }    // 객체안에 또다른 객체도 들어올 수 있음.
};

alert(grades['list']) // 결과 : { 'david' :10 ,'sam':8 , 'pedro':30 }
alert(grades['list']['david']) // 결과 : 10


//함수
var grades = {
	'show' : function(){ // 객체안에 함수도 들어올 수 있음.
    			alert("안녕~ 난 객체안에 들어있는 함수야 ");
    		 }
};

grades['show'](); // 결과 : 안녕~ 난 객체안에 들어있는 함수야 

 

↓this 라는 키워드는 무엇인가 ?

 

//this 라는 변수란 ?


var grades = {
	'list' : { 'david' :10 ,'sam':8 , 'pedro':30 },
	'show' : function(){ 
    			alert(this); // 이 this 라는 변수는 이 함수가 속해있는 객체 = grades 를 가르킨다.
                	alert(this.list); // 이 객체 grades 가 가지고 있는 list 를 가르킨다.
    		 }
};


//--------------------------------------------------------------------------------//

var grades = {
	'list' : { 'david' :10 ,'sam':8 , 'pedro':30 },
	'show' : function(){ 
    			for(var name in this.list){   
    				console.log(name , this.list[name]) 
                } 
    		 }
};

grades.show(); // 결과 :
		// david 10
               // sam 8
               // pedro 30