Javascript

Class 클래스

아이티프로 2023. 1. 24.
반응형

class 클래스명 {}로 선언

class Person {
    constructor(name) {
        this.name = name;
    }
    greet() {
        console.log(`Hello, my name is ${this.name}.`);
    }
}

let person = new Person("John");
person.greet();  // Output: "Hello, my name is John."

생성자 생성 : `constructor`를 사용하여 생성


let person = new Person("John");

new문을 사용하여 Person클래스로 부터 person 객체를 생성한 뒤

person.greet(); 와 같이 person객체의 greet()메서드를 사용한다.

 

class Person {
    static species = "Homo Sapien";
    static getSpecies() {
        return Person.species;
    }
    constructor(name) {
        this.name = name;
    }
    greet() {
        console.log(`Hello, my name is ${this.name}.`);
    }
}
console.log(Person.getSpecies()); // Output: "Homo Sapien"

Person.species = "Homo A.I";
console.log(Person.getSpecies()); // Output: "Homo A.I"

Person.newProperty = 100;
console.log(Person.newProperty); // Output:100

`console.log(Person.getSpecies())`와 같이 static으로 선언된 getSpecies()메서드는

new문을 이용한 객체생성과정없이 사용할 수 있다.

 

`Person`클래스는 getSpecies()라는 메서드와 species라는 프로퍼티를 갖고 있다.

 

person객체에 Person.newProperty = 100;와 같이 프로퍼티를 추가할 수 있다.

추가된 프로퍼티는 바로 사용된다.
console.log(Person.newProperty); // Output:100

 

 

 

class 상속

class Person {
    constructor(name) {
        this.name = name;
    }
    greet() {
        console.log(`안녕 나는 ${this.name}이야.`);
    }
}

class Student extends Person {
    constructor(name, major) {
        super(name);
        this.major = major;
    }
    info() {
        console.log(`내 이름은 ${this.name}이고 전공은 ${this.major}이야.`);
    }
}

let student = new Student("Jane", "Computer Science");
student.greet();  // "안녕 나는 Jane이야."
student.info();  //"내 이름은 Jane이고 전공은 Computer Science이야."

Student클래스는 Person클래스를 상속받았으며 new문을 사용해 student객체가 된 뒤 

Person클래스의 greet()를 사용할 수 있다. 부모클래스 접근은 super키워드를 사용하고 자기 자신은 this키워드로 참조한다.

 

 

반응형

'Javascript' 카테고리의 다른 글

에러 처리 & 디버깅  (0) 2023.01.24
Arrow function 화살표함수  (0) 2023.01.24
JSON Object  (0) 2023.01.24
Cookie  (0) 2023.01.24
window 객체  (0) 2023.01.23

댓글