웹 프로그램

코스 전체목록

닫기

객체

객체(Object)

지금까지 살펴본 배열은 아이템에 대한 식별자로 숫자를 사용했다. 데이터가 추가되면 배열 전체에서 중복되지 않는 인덱스가 자동으로 만들어져서 추가된 데이터에 대한 식별자가 된다. 이 인덱스를 이용해서 데이터를 가져오게 되는 것이다. 만약 인덱스로 문자를 사용하고 싶다면 객체(dictionary)를 사용해야 한다. 다른 언어에서는 연관배열(associative array) 또는 맵( map), 딕셔너리(Dictionary)라는 데이터 타입이 객체에 해당한다.

객체의 생성

다음은 객체를 만드는 법이다.

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

위의 예제에서 egoing은 key가 되고, 10은 value가 된다. 아래는 객체를 만드는 다른 방법이다.

var grades = {};
grades['egoing'] = 10;
grades['k8805'] = 6;
grades['sorialgi'] = 80;

아래와 같은 방법으로 객체를 만들수도 있다.

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

객체를 만들었으니 이제는 객체에서 필요한 값을 가져와보자. 다음은 sorialgi라는 이름(key)으로 저장된 값을 가져오는 법이다. 결과는 80이다.

var grades = {'egoing': 10, 'k8805': 6, 'sorialgi': 80};
alert(grades['sorialgi']);

다음 방법으로도 객체의 속성에 접근 할 수 있다.

alert(grades.sorialgi);

다음은 객체에 저장된 데이터를 기준으로 반복작업을 하는 방법이다.

var grades = {'egoing': 10, 'k8805': 6, 'sorialgi': 80};
for(key in grades) {
    document.write("key : "+key+" value : "+grades[key]+"<br />");
}

결과는 아래와 같다.

key :   egoing value : 10
key :   k8805 value : 6
key :   sorialgi value : 80

for 문은 in 뒤에 따라오는 배열의 key 값을 in 앞의 변수 name에 담아서 반복문을 실행한다. 반복문이 실행될 때 변수 key의 값으로 egoing, k8805, sorialgi가 순차적으로 할당되기 때문에 grades[key]를 통해서 객체의 값을 알아낼 수 있다.

객체에는 객체를 담을수도 있고, 함수도 담을 수 있다. 

var grades = {
	'list': {'egoing': 10, 'k8805': 6, 'sorialgi': 80},
	'show' : function(){
		for(var name in this.list){
			document.write(name+':'+this.list[name]+"<br />");
		}
	}
};
grades.show();

이것은 자바스크립트를 이용한 객체 지향 프로그래밍 기법의 핵심이 되는 성질로 취지에 따라서 로직을 객체에 그룹핑해서 객체라는 부품을 조립해서 소프트웨어라는 완제품을 만들 수 있게 해준다. 객체 지향에 대해서는 뒤에서 자세히 살펴본다.

댓글

댓글 본문
  1. 헤밍웨이
    220824
    객체가 딕셔너리와 같은 뜻이었는지 몰랐네요..
    객체지향 프로그래밍, this에 대해서도 호기심이 가득합니다!
  2. gusxorla
    220810
  3. 손도로도로
    0707
  4. 요기효
    220604
  5. 진진리
    22.06.03
  6. 진진리
    22.04.27 완료
  7. Rachelcarson
    너무 잘 이해시켜주시네요. 이제 책봐도 다이해가고 그래요. 선생님 진짜 최고이십니다!!
  8. 너구리기린
    2022.04.11 재수강 필요!!
  9. mary5544
    객체 어렵지만 일단 완료!
  10. 2022.02.21. 수강완. 좋은 강의 감사합니다.
  11. 소설가
    2022-02-16 완료
    고맙습니다.
  12. 임앤강
    2022-02-06 수강완료 !! 감사합니다 !!
  13. 낀찐
    2022. 01. 18 완료
  14. tchaikovsky
    최고입니다
  15. 마스터하자
    2021.12.16 객체지향 들어가니까 많이 어렵네요 다시 한번 복습해야겠습니다.
  16. 2021.12.13 수강
  17. 드림보이
    2021.12.03. 객체 파트 수강완료
  18. GelandeWagen
    복습 ok
  19. 안녕,쨈
    21/10/27
  20. seaWater
    2021. 9. 14. 완료
  21. choi
    완료
  22. labis98
    20210819 good~~~!!!
  23. 2021.07.26 완
  24. 낭만고양이
    수강완료
  25. 20210619
    전보단 이해가 잘되군요
  26. GelandeWagen
    210604 ok
  27. Amousk
    좋은 강의 감사합니다.
  28. coding_prince
    감사합니다.
  29. yogg
    전보다는 이해하기 쉬운거 같아요!!!
  30. 짜rr
    수업은 들었는데너무 어렵네요 헷갈리기도 하고.. 다음에 또 들어야 겠습니다.
  31. 앙냥냥
    2021.03.26 봤숩니당 객체랑 배열 비슷하면서도 달라서 넘..나.. 헷갈리지만 잘 정리해 봐야게써요.. . . ㅇ<-<
  32. Asanagi
    2021. 03. 15 완료!
  33. 진돌
    2021. 03. 05 완료!
  34. 정재진
    완료
  35. 홍주호
    21.1.2
  36. 열심히
    20210102 완료
  37. 정상에 오르자가자고고
    완료
  38. Coen
    2020.12.22
  39. LEGEND
    쵸또.. 무즈카시꾸낫따,.크큭..
  40. 201209
  41. psyless
    20201130
  42. 강승
    사랑합니다
  43. 박병진
    2020.10.20완
  44. 당근조아
    201017 완
  45. 코딩지니어스
    20201010 완료
  46. 20201007 완료
  47. Yongbeom Kwon
    200911 완료
  48. switpotato
    20200815 완료
  49. 혀크크
    20.7.26 완료
  50. 김준석
    20.07.26. 학습완료
버전 관리
egoing
현재 버전
선택 버전
graphittie 자세히 보기