가희의자기개발블로그

오브젝트 리터럴 방식으로 클래스 만들기(1_사용법) 본문

프론트엔드/JavaScript+JQuery

오브젝트 리터럴 방식으로 클래스 만들기(1_사용법)

가희gahui 2020. 7. 31. 12:53
반응형

클래스를 만드는 방법에는 세 가지가 있는데, 가장 간단한 방식인 오브젝트 리터럴 방식으로 클래스를 만들어 보자. 

 

01_ 사용법

오브젝트 리터럴 방식으로 클래스 만드는 방법을 다음가 같은 순서로 나눠 진행하겠다. 단계는 크게 클래스 설계 단계와 설계한 클래스를 사용하는 단계인 객체 사용 단계로 나눠진다. 

구분 진행 순서
클래스 설계 단계 1. 문법
2.생성자 정의 방법
3.프로퍼티 정의 방법
4. 메서드 정의 방법
객체 사용 단계 5. 인스턴스 생성 방법
6.객체 외부에서 프로퍼티와 메서드 접근 방법
7.객체 내부에서 프로퍼티와 메서드 접근 방법

 

우선 가장 첫번째 방법인 문법부터 살펴 보자

1 _ 문법

var 인스턴스 = {
프로터티: 초깃값,
...
메서드:function(){
...
},
...
}

리터럴 방식은 객체 리터럴을 의미하는 {}내부에 프로퍼티와 메서드를 정의(포장)하는 구조이다. 예를 들어 사용자 이름과 나이를 프로퍼티로 가지고 있고 이 정보를 출력하는 showInfo()라는 메서드를 가질 클래스를 만든다면 다음과 같이 만들 수 있다. 

 

//클래스 정의및 인스턴스 생성
var user={
	name:"gahuiyeom",
    age:10,
    showInfo:function(){
    	document.write("name =" +this.name+", age = "+this.age);
    
    }

}
//메서드 접근하기
user.showInfo();

 

반응형
Comments