객체 (Object)

생활코딩 javascript를 참고하여 공부하였습니다.

스스로 공부한 것을 정리하고 복습하기 위한 목적으로 작성하였습니다.

( 출처 :  https://opentutorials.org/course/743)

---

  객체 ( Object )  

배열에서 인덱스는 숫자를 사용하였으며, 데이터가 생성되면 자동으로 만들어져서 데이터에 대한 식별자가 된다.

객체도 배열과 비슷한 형태이지만, 객체는 인덱스를 문자로도 사용할 수 있다.

 

다른 언어에서는 연관 배열 또는 맵, 딕셔너리 라는 데이터 타입이 객체에 해당된다.

즉, 객체는 key와 value를 갖는다.

---

  객체 생성  

 객체는 중괄호에서 중괄호로 끝난다.

1. 첫번재 방식

즉, egoing은 key가 되고, 10은 value가 된다.

2. 두번째 방식

비어있는 객체를 만든 뒤, 값을 대입하는 것이다.

<script>
  var grades = {};
  grades['egoing'] = 10;
  grades['k8805'] = 6;
  grades['sorialgi'] = 80;
</script>

3. 세번째 방식

<script>
  var grades = new Object();
  grades['egoing'] = 10;
  grades['k8805'] = 6;
  grades['sorialgi'] = 80;
</script>

---

  객체에서 값 가져오기  

1. 첫번째 방식

대괄호 안에 key를 입력하면 된다.

2. 두번째 방식

객체.key를 입력하면 된다.

---

 반복문을 활용하여, 객체를 다루는 방법 

배열은 저장된 데이터들이 순서를 가지고 있다. 따라서, 들어간 순서대로 출력한다.

객체는 순서가 존재하지 않고, key와 value를 가지고 있다.

 

아래 예제를 통해서 알아보자.

<script>
  var grades = {'egoing': 10, 'k8805': 6, 'sorialgi': 80};

  for(key in grades) {
      document.write("key : "+key+" value : "+grades[key]+"<br />");
  }
</script>

for문은 in 뒤에 grades는 배열의 key값을 가져와서 in 앞의 변수인 key라는 곳에 담아서 반복문을 실행한다.

즉 반복문이 실행될 때, 변수 key의 값이 egoing, k8805, sorialgi가 순차적으로 할당되기 때문에 grdes[key]를 통해서 객체의 값을 알아낼 수 있는 소스코드이다.

 

아래는 key값을 가져오는 과정을 나타낸 코드이다.

 

---

 객체에 담길 수 있는 값은 무엇인가 

1. value에 또다른 객체를 생성할 수 있다.

<script>
var grades = {
            'list': {'egoing': 10, 'k8805': 6, 'sorialgi': 80}
            }
</script>

그렇다면, egoing이 갖고 있는 10을 출력하고 싶다면 어떻게 해야할까?

grades['list']['egoing']; 이라는 명령어를 사용하면 10을 출력할 수 있다.

 

2. value에 함수를 넣을 수 있다.

<script>
  var grades = {
                  'show' : function(){
                      alert('Hello world');
                   }
                }
</script>

선언된 함수를 호출할 때는 grades['show'](); 명령어로 출력할 수 있다.

---

 this 

자기 자신이 속한 곳을 가르킨다.

 

예제를 통해 살펴보자.

위 코드와 같이 this는 grades를 가르키고 this.list를 입력하면 grades안에 list가 갖고  있는 value를 의미한다.