본문 바로가기
Programming Languages/Javascript

Javascript의 Class 활용법

by Calvin H. 2022. 5. 30.

선결론 : 나는 ES6의 class 문법을 선호한다.

 

자바스크립트에서 class은 크게 두 가지 방법으로 나눌 수 있다.

 

첫번째 방법은 :

 

 

function Person(firstName, lastName, age) {
    this.firstName = firstName;
    this.lastName = lastName;
    this.age = age;
}

Person.prototype.greeting = function() {
	return "Hello, " + this.firstName
}

 

 

인데 위처럼 실행하게 되면 Person이라는 클래스를 생성하게 되고 그 함수 내에 있는 것들을 생성자 함수라고 부른다.

만약에 method를 추가하고 싶다면 해당 클래스의 prototype을 접근 후 새로운 method를 추가해주면 된다.

 

두 번째 방법은 ES6부터 사용이 가능해진 class를 실제로 이용하는거다:

 

 

class Person {
    constructor (firstName, lastName, age) {
      this.firstName = firstName;
      this.lastName = lastName;
      this.age = age;
    }
    
    greeting() {
    	return "Hello, " + this.firstName
    }
}

 

 

위처럼 작성을 하게 되면 전과 마찬가지로 Person 이라는 class를 생성하게 된다.

 

이렇게 class를 생성했는데, instance를 만들기 위해서는 new라는 단어가 필요하다.

 

 

let snape = new Person("Severus", "Snape", 53);

 

 

이렇게 생성된 instance는

 

 

console.log(snape.firstName); // "Severus"
console.log(snape.lastName); // "Snape"
console.log(snape.age); // 53

 

 

의 속성들이 생기고 만약에 method를 사용한다면

 

 

console.log(snape.greeting()); // "Hello, Severus"

 

 

이 반환된다.

 

다음 글은 class를 inherit하는 class와 그랬을 경우에 사용되는 extends 와 super의 활용법에 대한 설명이다

'Programming Languages > Javascript' 카테고리의 다른 글

비동기적 호출 - [setTimeout, setInterval]  (0) 2022.05.30
super()를 이용한 class 상속 방법 (ES6)  (0) 2022.05.30
Const, Var, Let  (0) 2022.05.30
Switch Cases  (0) 2022.05.30
Rest 파라미터  (0) 2022.05.30