리액트(2)

 

 

클래스(class) 이해하기

 : 객체를 위한 핵심 청사진 같은 것

 

* 자바스크립트 객체가 되는 경우

 : class키워드로 정의되고, 프로퍼티(name, call)와 메소드('Max', 함수)를 가질 수 있다.

class Person{
        name='Max'
        call = ()=>{...}

 

 

* 프로퍼티와 메소드 추가

 : new 키워드 사용

const myPerson = new Person()
        myPerson.call()
 console.log(myPerson.name)

 

* 프로토타입

class Human { 
  constructor() {
    this.gender = 'female';
  }
  
  printGender() {
    consol.log(this.gender);
  }
}  





class Person extends Human { 
   construrtor() {
     super();
     this.name='Max';
     this.gender = 'female';
   }
   
   printMyName() { 
     console.log(this.name)
 }  
 
 const person = new Person();
 person.printMyName();
 person.printGender();

 

신세대 (뉴~)클래스. 프로퍼티와 메소드

 

*프로퍼티 : 클래스와 객체에 추가되는 변수같은 것

*메소드 : 클래스와 객체에 추가되는 함수같은 것

 

*신세대 클래스에 프로퍼티 할당법 : myProperty = 'value'

 (장점: 생성자 함수 호출 필요없음)

*신세대 클레스에 메소드 할당법 : myMethod = () => {...}

 (메소드는 값으로 함수를 저장하는 프로퍼티라고 생각하면 된다.)

 (장점 : this 키워드를 사용하지 않아도 된다.)

class Human {
  gender = 'male';
  
  printGender = () => {
    console.log(this.gender);
    }
  }
  
  class Person extends Human {
      name ='Max';
      gender = 'female';
      
    printMyName = () => {
     console.log(this.name);
    }
}

const person = new Person();
person.printMyname();
person.printGender();

 

 

 

새로운 거다 오예

 

* 스프레드 & 레스트

- 문법 : 점 3개

- 사용 : 어디에 사용하는지에 따라 스프레드 또는 레스트라고 부른다.

 

-- 스프레드 : 배열의 원소나 객체의 프로퍼티를 나누는 데 사용됨.

-- 레스트 : 

 

 

 

 

------------------------------------------------------------------------------------------------------------------------

 

내일 더 해야지.

아직 자바스크립트 ing 같은데

드디어 레스트랑 스프레드 나오면서

리액트 하는 느낌이 든다.

아니 근데 

클래스랑 프로퍼티랑 메소드랑

왜이렇게 새로운지.

손으로 그려가면서 하나하나 하니까

겨우 이해했다.

소리없이 유데미 강의 듣는데

5분짜리 4번인가 5번 반복하면서 30분 걸린 듯 ㅋㅋㅋ

신문 읽어야 되는데...

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

'React' 카테고리의 다른 글

리액트(7)  (0) 2023.01.18
리액트(6)  (0) 2023.01.17
리액트(5)  (1) 2023.01.17
리액트(4)  (0) 2023.01.16
리액트(3)  (0) 2023.01.16