자바스크립트 객체 object 에 값 넣는 방법과 가져오는 방법, 반복문으로 객체의 값 모두 가져오는 방법

객체 object는 코드에서 사용된 다양한 함수와 변수를 연관된 것끼리 모아 정돈하는 기능을 합니다.

 

객체에 속해 있는 함수는 "함수"라고 하지 않고 "메서드"라고 합니다. 객체를 만들 때 사용하는 기호는 object literal이라고 합니다. 객체는 중괄호 { }에 값을 저장합니다. 객체에 값을 저장할 때는 데이터 값을 설명하는 별도의 이름을 붙여주어야 합니다. 이 별도의 이름은 라벨과 같은 기능을 하며 데이터 값이 어떤 내용인지 확인할 수 있도록 돕습니다. 아래 예시에서 chan이라는 데이터 값에 doctor라는 라벨과 같은 기능을 하는 key를 붙였습니다. 그리고 { } 중괄호 안에 객체의 값으로서 저장하였습니다.

 

<script>

var people = {

"doctor" : "chan",

"singer" : "brian"

};

</script>

 

객체에 저장된 값을 가져올 때는 오브젝트 access operator 로서 period를 사용합니다.

people이라는 객체에서 doctor라는 key 값(property)을 붙인 데이터 값 chan을 출력합니다. 마찬가지로 people 객체에서 singer로 key를 붙인 값 brian을 출력하게 됩니다.

 

<script>

var people = {

"doctor" : "chan",

"singer" : "brian"

};

document.write("doctor : " + people.doctor+"<br>");

document.write("singer : " + people.singer + "<br>");

</script>

 

객체에 값을 추가하고 싶을 때는 아래 코드를 같이 추가합니다.

people.salesman = "kevin";

document.write("salesman : " + people.salesman +"<br>");

 

만일 객체가 추가하고 싶은 값에 띄어쓰기가 있다면, period 대신 대괄호 [ ]를 이용합니다.

people ["music artist"] = "betoto";

document.write("music artist : " + people ["music artist"] + "<br>");

 

 

객체 people에 있는 property (key 값)을 가져오는 반복문을 만들 때 for 키워드를 사용합니다.

 

key 값은 우리가 실제로 가져오고자 하는 정보로 통하는 문을 열어주는 열쇠와도 같습니다. 배열에서 순서대로 정렬되는 index와 유사한 기능을 합니다. 코드가 한번 실행되면 객체 people에 있는 property (key 값)을 가져오도록 document.write(key+'<br>');을 적으면, people에 있는 key 값을 가져와 한 줄씩 띄우는 동작을 합니다. 이 코드는 people에 있는 모든 값을 다 불러올 때까지 반복됩니다. 결국 people에 있는 모든 key값이 출력됩니다.

 

<script>

for(var key in people) {

document.write(key+'<br>');

}

 

key값과 함께 객체 people에 있는 데이터 값을 가져오는 반복문을 만들 때는 아래와 같이 코드를 작성합니다.

<script>

for(var key in people) {

document.write(key+' : '+people [key]+'<br>');

}

 

이와 같은 방식으로 작성한 값 모두를 출력해 봄으로써 누락된 값은 없는지 확인할 수 있습니다.