728x90
반응형
<Object의 구성>
- 메서드: 기능정의
- 속성: 객체 내부 데이터
- this: 객체 내부 메서드나 속성을 정의할 때 사용
- 프로토타입: 객체의 확장
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
// 객체 작성 1 (class처럼 생겼지만 class가 아니다.)
function qClass(){
// 외부에서 접근 가능
this.name = "kh정보교육원";
// 외부에서 접근 불가
var classname = "빅데이터 전문가 과정";
this.getClassname=function(){
return classname;
}
}
// 객체 작성2
var qClass2 = { //얘는 객체
name: "kh정보교육원",
print: function(){
alert(qClass2.name + " 빅데이터 전문 개발자 과정 - 오후반");
}
}
qClass.prototype.printName = function(){
alert(this.name + this.getClassname() + " 최고!!!");
}
function objTest(){
var cls = new qClass();
alert(cls.name);
alert(cls.classname + " : " + typeof cls.classname); //undefined
alert(cls.getClassname() + " : " + typeof cls.getClassname); //빅데이터 전문가과정
alert(qClass2.name);// 객체.name = kh정보교육원
qClass2.print(); // kh정보교육원 빅데이터 전문 개발자 과정 - 오후반
cls.printName(); // kh정보교육원 빅데이터 전문 개발자 과정 최고!!! -- prototype을 통한 확장
}
</script>
</head>
<body>
<pre><!-- <pre>태그: 내가 써주는거 그대로 화면에 표현 -->
객체의 구성
- 메서드: 기능정의
- 속성: 객체 내부 데이터
- this: 객체 내부 메서드나 속성을 정의할 때 사용
- 프로토타입: 객체의 확장
</pre>
<button onclick="objTest();">객체</button>
</body>
</html>728x90
반응형
'Web > JavaScript' 카테고리의 다른 글
| [JS]형변환 (0) | 2020.07.28 |
|---|---|
| [JS]number (0) | 2020.07.28 |
| [JS]node, nodelist (0) | 2020.07.28 |
| [JS]node, nodelist (0) | 2020.07.28 |
| [JS]rolling (0) | 2020.07.28 |
