JS | ES6 문법 - class

class 

일반 HTML에서는 굳이 class를 사용하진 않습니다. 

React의 class컴포넌트를 사용한다면 알아두세요.

 

1. 클래스의 멤버변수를 선언할 때는 키워드를 사용하지 않습니다. (구형브라우저에서는 지원불가 할 수 있음)

 class Person {
            //멤버변수
            name = "홍길동";
            age = 20;
            //객체변수
            state = {a:1};
            //생성자는 js에서 반드시 1개입니다.
            //JS는 this키워드를 지칭하면 멤버변수가 자동생성 됩니다.
            constructor(addr){
                this.addr = addr;
            }
            //함수
            func = () => {
                console.log("func 실행");
            }
        }
        //객체로 생성 - 허용됩니다.
        let p = new Person();
        console.log(p.name); //멤버변수 접근
        console.log(p.age);
        console.log(p.state.a);

        p.func();

        //객체 생성
        let p2 = new Person("서울");
        console.log(p2.addr);

class 상속

 class Shape {
            constructor(){

            }
            func = () => [
                console.log("func호출")
            ]
        }

        class Rect extends Shape {
            //프로그래머가 생성자를 직접 만들게 되면 super()를 통해 연결해야 합니다.
            constructor(w, h) {
                super(); //부모의 생성자 연결
                this.w = w; //멤버변수에 w저장
                this.h = h;
            }

            //set 
            setW = (w) => {
                this.w = w;
            }
            //get
            getW = () => {
                return this.w;
            }

            //set, get, static 같은 키워드들로 함수를 성정 할 수 있습니다.
        }

        //객체 생성
        let rect = new Rect();
        rect.func(); //물려받음 //func호출

        //객체 생성 2 
        let rect2 = new Rect(10,20);
        console.log(rect2.w); //10
        console.log(rect2.h); //20

        rect2.setW(30);
        console.log(rect2.getW()); //30