티스토리 뷰

JAVASCRIPT

[Javascript] 생성자와 클래스 구문

jeongah story 2020. 8. 17. 19:03

- 생성자를 다른 생성자에 상속하는 방법과 ECMAScript6추가된 클래스 구문

 

[모던자바스크립트] 18.1 생성자 

 

18.1.1 생성자를 정의하는 방법

: 생성자는 new연산자와 함께 사용하여 객체를 생성하는(초기화해서 구축하는) 함수 입니다. 

생성자를 사용하면 이름이 같은 메서드와 프로퍼티를 가진 객체를 효율저으로 여러개 생성할 수 잇씁니다.

이때 메서드를 생성자의 프로토타입 객체에 추가해 두면 메로리 낭비를 피핼 수 있으며, 그 메서드를 다른 생성자에게 상속할 수 있습니다.

 

 

1. 함수 선언문으로 정의하는 방법

 

See the Pen [Javascript] 생성자를 정의하는 방법 by jeongahlee (@jeongahlee) on CodePen.

 

18.1.2 생성자로 접근자 프로퍼티 정의하기

; 접근자 프로퍼티를 활용하면 외부에서 그 프로퍼티를 읽고 쓸 수 없게 막고, 특정 방법으로만 읽고 쓰도록 할 수 있습니다.

접근자 프로퍼티 하나에 읽을때의 처리를 담다하는 게터(getter)와 쓸때의 처리를 담당하는 세터(setter)함수를 정의 할 수 있습니다.

 

See the Pen [Javascript] 생성자로 접근자 프로퍼티 정의하기 by jeongahlee (@jeongahlee) on CodePen.

 

 

 

18.2 생성자 상속

 

: 자바스크립트 생성자가 클래스 역할을 대신합니다.

생서자 또한 객체 이므로 객체의 프로토 타입 상속을 활용하면 생성자 상속을 구현 할 수 있습니다.

이 책에서는 상속하는 생성자를 슈퍼 타입생성자, 상속을 받은 생성자를 서브 타입 생성자라고 부릅니다.

 

 

See the Pen [Javascript] 생성자의 상속 by jeongahlee (@jeongahlee) on CodePen.

 

 

 

 

 

<참고 출처 예시> 

 

See the Pen [Javascript] 생성자의 상속의 필요성 by jeongahlee (@jeongahlee) on CodePen.

 

 

18.3.1 ECMAScript 6 클래스 구문

: 생성자 정의문의 문법 설탕 입니다.

: 클래스 구문을 사용하면 다양한 종류의 새엇ㅇ자 정의문과 생성자 상속 방법을 통일된 문ㄴ법으로 간결하게 표현할 수 있습니다.

 

18.3.1 클래스 구문의 기본

구문종류에는 클래스 선언문, 클래스 표현식이 있습니다.

 

 

 

 

 

 

 

 

참고 출처 : https://www.zerocho.com/category/JavaScript/post/573c2acf91575c17008ad2fc , https://developer.mozilla.org/ko/docs/Web/JavaScript/Guide/Inheritance_and_the_prototype_chain

 

(JavaScript) 객체 지향 프로그래밍(생성자와 프로토타입)

이번 시간에는 자바스크립트식 객체 지향 프로그래밍(OOP, Object Oriented Programming)에 대해 알아보겠습니다. 생성자 지난 시간에 Date 객체를 new Date()로 만들었던 것 기억하시나요? Date는 분명 객체라

www.zerocho.com

https://img1.daumcdn.net/thumb/R800x0/?scode=mtistory2&fname=https%3A%2F%2Ft1.daumcdn.net%2Fcfile%2Ftistory%2F99508F3B5BAA636B30

'JAVASCRIPT' 카테고리의 다른 글

[Javascript] checkbox  (0) 2021.04.13
[Javascript] Heart Button  (0) 2021.03.31
[JavaScript] HTTP제어(Ajax)  (0) 2020.07.19
[Javascript] 커스텀 이벤트, 비동기 처리 Promise  (0) 2020.07.19
[Javascript ] falsy truthy  (0) 2020.07.01
댓글
© 2018 eh2world