-
[JavaScript] 자바스크립트의 클래스비전공자 공부일기/:: WEB & Front-End 2020. 6. 19. 17:50
자바를 배워 본 사람이라면 '클래스'라는 개념을 알 것이다.
처음에는 그저 코드가 실행되는 한 파일 단위라고 생각하다가,
객체지향을 배우게 되면서 클래스라는 개념이 빛을 발하게 된다.
함수가 특정 기능을 하는 변수와 구문을 감싸는 것이라면
클래스는 연관있는 변수와 함수를 감싸는 기능을 한다.
그런데 자바스크립트는 클래스 기반이 아닌 '프로토타입 기반'의 언어이다.
따라서 이전에는 자바스크립트에서 객체의 개념의 희박했지만,
ECMAscript5 이후로 '클래스'라는 개념이 도입되게 되었다.
그러나 자바스크립트의 클래스는 자바의 클래스와는 조금 다르다.
자바스크립트에서 클래스란, 생성자 함수를 뜻한다!!!
다시말하면, 자바스크립트는 내부적으로는 모두 함수로 이루어져 있다.
그런데 많은 변수와 함수들을 묶은 개념인 클래스의 개념을 이용하기 위해
역시 특정 기능을 가진 함수를 통해 그 기능을 구현하는 것이다.(다른 언어와 달리!)
자바스크립트에서 함수를 선언하는 방식은 다음 세 가지 방법이 있다.
1) 리터럴 방식의 클래스
var 인스턴스 = { 프로퍼티1 : 초기값, 프로퍼티2 : 초기값, 메서드1 : function() { }, 메서드2 : function() { } }
2) 함수 방식의 클래스
function 클래스이름() { this.프로퍼티1 = 초기값; this.프로퍼티2 = 초기값; this.메서드1 = function() { } this.메서드2 = function() { } } var 인스턴스 = new 클래스이름();
3) 프로토타입 방식의 클래스
function 클래스이름() { this.프로퍼티1 = 초기값; this.프로퍼티2 = 초기값; } 클래스이름.prototype.메서드1 = function() { } 클래스이름.prototype.메서드2 = function() { }
내용참고 블로그 : https://webclub.tistory.com/136
'비전공자 공부일기 > :: WEB & Front-End' 카테고리의 다른 글
[JavaScript] HTML DOM 객체 (Document Object Model) (0) 2020.06.21 [JavaScript] 콜백함수 Callback Function (0) 2020.06.20 [JavaScript] 이벤트 속성 (0) 2020.06.19 [JavaScript] 자바스크립트의 객체 모델 DOM, BOM (0) 2020.06.19 [JavaScript] 객체의 생성 - 생성자 함수 (0) 2020.06.18