이 내용은 '생활코딩'에서 공부한 내용을 정리한 글이다.
자세한 내용은 https://www.opentutorials.org/course/743 이곳에서 확인할 수 있다.
모든 내용의 출처는 이곳이다. 다른 언어를 알고있는 상태로 공부한 내용이다.
C++에서 객체라 하면 클래스, 인스턴스 그에따른 다형성, 오버라이딩 등의 객체지향적 개념들이 생각날 수 있다.
Javascript에서 객체라 하면 C++의 map컨테이너와 비슷하며 더 나아가 클래스라고 생각하면 이해하기 쉬울 수 있다.
-실습 코드-
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
|
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
<script>
var grades = { 'egodj': 10, 'k5': 6, 'kim': 80 }; // 객체생성
// C++의 map처럼 생각
var b = new Object();
var a = {}; // 객체 생성
document.write(grades.k5 + "<br />"); //접근 방법
for (var i in grades) {
document.write("<li>key : " + i + " value : " + grades[i] + "</li>");
} // 객체를 접근할때, 파이썬의 for문 처럼 생각 배열도 가능!!
//<li> 는 HTML문법 :
var ob = {// 마치 클래스처럼
'list': { 'Hur': 10, 'kim': 20, 'park': 30 }, // ob라는 객체안에 list라는 키가 있고 그 키안에 또다른 객체가 있다. 콤마(,)에 주의
'show' : function () {
alert("HI~~~, I'm object object");
},
't': function () {
}
document.write(this.list);
}// this란 함수가 속해있는 객체를 가리키는 변수
}
document.write(ob['list']['Hur'] + "<br />"); // ob객체의 list객체안의 hur접근
ob['show'](); // ob객체안의 show함수를 호출
//ob['t']();
ob.t(); // ob객체안의 함수 t호출
</script>
</body>
</html>
|
가장 처음의 코드는 C++의 map처럼 생각하면 편하다. 'kim'이라는 키는 80을 저장하고 있다고 생각하면 된다.
객체의 선언은 2가지이며 'new Object'를 쓰거나 '{}'으로 선언할 수 있다.
접근방법은 . 을 이용하여 접근한다. C/C++의 구조체나 클래스와 비슷하다.
'var ob' 객체가 어려울 수 있다. Javascript에서 객체는 배열도, 함수도, 또 다른 객체도 담을 수 있다.
list는 객체, 't', 'show'라는 함수가 ob객체안에 들어있다. 접근방법은 위의 주석을 참조해보자.
'JavaScript' 카테고리의 다른 글
| [JavaScript] arguments 객체 (0) | 2019.05.19 |
|---|---|
| [JavaScript] 변수의 유효범위 (0) | 2019.05.19 |
| [JavaScript] 함수, 배열 (0) | 2019.05.08 |
| [JavaScript] 조건문, 반복문 (0) | 2019.04.28 |
| [JavaScript] 변수 (0) | 2019.04.28 |