30. 객체쓰기와 읽기

 

지금까지 배운 내용 중에서 정보의 양이 많아졌을때 서로 연관된 정보를 정리 정돈 하기 위한 도구가 무엇이었나요 ? 배열 이었습니다. 그리고 배열이란 순서에 따라 정리정돈한다는 특징이 있었습니다.

즉 , 배열이라는 도구는 정보를 담는 그릇이면서 동시에 정보가 순서대로 저장된다는 특징을 지니고 있습니다. 순서대로 저장될 수 있는 정보가 있다면 순서없이 저장할 수 있는 정보도 있지 않을까요 ? 그것이 객체입니다.

 

... 생략 ...
<h2>Create</h2>
<script>
    var coworkers = {
       "programmer" : "egoing",
       "designer" : "leezche"
    }
</script>
... 생략 ...

 

그러면 coworker라는 객체에 "egoing" 이라는 정보를 "programmer" 라는 딱지를 붙여서 저장한 것이며 ,

"leezche" 라는 정보는 "designer" 라는 딱지를 붙여 저장한 것입니다.

그럼 이러한 정보를 꺼낼땐 어떻게 해야 할까요 ?

 

... 생략 ...
<h2>Create</h2>
<script>
    var coworkers = {
       "programmer" : "egoing",
       "designer" : "leezche"
    }
  document.write("programmer : " + coworkers.programmer + "<br>");
</script>
... 생략 ...

 

즉 , coworkers 다음에 있는 점(.)은 객체 접근 연산자(object access operator) 라고 합니다.

즉, coworkers 라는 객체에 접근하는 연산자 라는 뜻입니다. "디자이너" 도 마찬가지

 

... 생략 ...
<h2>Create</h2>
<script>
    var coworkers = {
       "programmer" : "egoing",
       "designer" : "leezche"
    }

 document.write("programmer : " + coworkers.programmer + "<br>");
 document.write("programmer : " + coworkers.programmer + "<br>");
 coworkers.bookkeeper = "duru"; // 추가한 정보
document.write("bookkeeper : " + coworkers.bookkeeper + "<br>");
</script>
... 생략 ...

 

추가 한 정보도 가져올 수 있습니다.

 

 

이번엔 이름에 공백이 들어갔을 시 ! 처리하는 방법 .

대괄호를 써서 문자열 형태로 넣으면 똑같은 효과를 가져올 수 있습니다.

 

... 생략 ...
<h2>Create</h2>
<script>
    var coworkers = {
       "programmer" : "egoing",
       "designer" : "leezche"
    }
... 생략 ...
coworkers["data scientist"] = "taeho";
document.write("data scientist : " + coworkers["data scientist"] + "<br>"
</script>

 

데이터를 공백도 잘 가져오는 모습 !