본문 바로가기

React

Class와 기본 문법

 

Class 

클래스는 객체지향을 생성하기 위해 변수와 메소드를 정의하는 일종의 틀로

객체를 정의하기 위한 상태와 함수로 구성된다.

 

우리가 여러 종류의 객체를 여러 개 만들고자 하는 경우가 생긴다. 이럴 때 우리는 new 연산자와 생성자 함수에서 배운

' new function ' 을 쓸 수 있다. 여기에 더해서 클래스(class)라는 문법을 사용하면 객체 지향 프로그래밍에서 사용되는 다양한 기능을 자바스크립트에서도 사용할 수 있습니다.

 

 

Class 기본 문법

class Obj{
    constructor(a,b,c,d){
        this.name = a
        this.key = b
        this.gender = c
        this.birth = d
    }
}

const ab = new Obj('1','2','3','4')


console.log(ab)

// Obj { name: '1', key: '2', gender: '3', birth: '4' }

 

Obj라는 클래스를 만들고 new Obj를 호출하면 내부에서 정의한 메서드가 들어있는 객체가 생성되는 것을 알 수 있습니다.  class 문법은 기본 함수와는 차이가 있는데 바로 매개변수를 넣는 공간이 따로 없다는 것이다.

 

그것을 해결해주기 위한 문법이 존재하는데 그것이 바로 ' constructor( ) ' 이다.

' constructor( ) '는 객체의 기본 상태를 설정해주는 생성자 메서드로 'new'에 의해 자동으로 호출된다.

 

 

React에서는 Class 문법을 사용할 때 ' constructor( ) ' 를 생략해서 사용할 수 있고, 호출할 때는 <App /> 으로 호출을 할 수 있다.

'React' 카테고리의 다른 글

React 댓글 구현하기  (0) 2022.04.24
틱택톡 게임 구현하기  (0) 2022.04.22
Webpack 소개, 설치법  (0) 2022.04.21
리스트와 key  (0) 2022.04.21
React Props, state  (0) 2022.04.13