[JS] javascript ES6에서의 Class에 대해서.. ( Class 생성과 함수 호출 )

 

java를 배웠다면 Class를 많이 썼을텐데.. javascript에서는 Class를 사용해본 적이 없다.

그래서 오늘 한번 정리해보려고 한다..

 

ES6에서 Class문법이 추가되었고, 덕분에 기존의 prototype 기반으로 클래스를 만드는 것보다 명료하게 클래스를

만들 수 있게 되었다고 한다.

 

Class

============================================================================

 

기본문법

-- Class 생성
-- Class안에 여러 메서드를 정의 할 수 있음
class MyClass {
  constructor() {}
  method1() { ... }
  method2() { ... }
  method3() { ... }
  ...
}

// Class를 생성자로 하여 객체 선언
let myClass = new MyClass();

 

예제

<script>

    let hello = ''; // 전역 변수 선언
	let name = '';
    class MyClass { // 클래스 생성
    	constructor(name) { // 생성자가 생성되면 자동으로 호출됨..
        	this.name = name; 
        }
        setHello = () =>{ // 이름을 인자로 받아 텍스트를 만들어주는 함수 생성
            this.hello = 'hello my name is ' + this.name;
        }
        sayHello = () => { // 콘솔로 텍스트를 찍어주는 함수 생성
            console.log(this.hello);
        } 
    }

    let introduce = new MyClass('bome'); //MyClass를 introduce객체에 넣음
    introduce.setHello(); //introduce를 통해 함수 호출이 가능해짐
    introduce.sayHello();
// 결과 : hello my name is bome
</script>

 

 

여기서 MyClass 클래스안에 constructor이라는 녀석은 생성자가 호출되면 자동으로 호출된다.

각 Class에서 constructor(생성자)는 하나여야 한다.

여기서는 this.name에 'bome'이라는 값을 넣어주는 역할을 한다.

 

ex) 객체명 = new 클래스명()

 

이렇게 간단하게 Class를 생성하는 방법과 호출하는 방법에 대해서 알아보았다. 

java에서도 마찬가지 이지만, 같은 동작을 많이 하는 로직에 대해서 이렇게 클래스를 만들어놓고,

new를 통해 생성자를 만들고, 필요한 함수를 호출하면 되지 않을까 싶다.

 

다음에 시간이 되면 getter와 setter, 객체와의 차이, Class가 정확히 무엇인지에 대해 정리해야겠다..