본문 바로가기
프로그래밍/Javascript & React

[React] 21/11/07 TIL

by Dean30 2021. 11. 5.
728x90

[React] 21/11/07 TIL

 

useState 

컴포넌트에서 보여줘야 하는 내용이 동적으로 바뀔 때 'Hooks'란 기능을 이용할 수 있다.

useState는 React 내장함수로서 Hooks 중 하나이다.

 

데이터는 변수와 state에 저장할 수 있는데, state에 굳이 저장해 놓는 이유는

웹이 App처럼 동작할 수 있게 만들기 때문이다.

즉 state가 변경되면 html이 자동으로 재랜더링이 된다 !!

 

state 데이터를 수정할 때에는 원래 데이터를 놔두고 array deep copy를 통해 수정하는 방식이 바람직하다.

참고고 데이터는 primitive data type 과 Reference data type 2 종류가 있으며

React에서 array 는 Reference data type이다. 즉 데이터가 생성된 주소를 참조하는 타입이다.

 

모달창

모달창(modal window) : 사용자 인터페이스 디자인 개념에서 자식 윈도우에서 부모 윈도우로 돌아가기 전에 사용자의 상호동작을 요구하는 창을 의미

 

순차적 실행을 위한 개념

Callback 함수

promise

async await

 

클래스 vs 객체 vs 인스턴스

클래스(Class) : 객체를 만들어내기 위한 설계도(틀). 연관되어 있는 변수와 메서드의 집합

객체(Object) : 클래스에 선언된 모양 그대로 생성된 실체

인스턴스(Instance) : 소프트웨어 세계에 구현된 구체적인 실체. 메모리에 할당된다.

 

  • 클래스의 타입으로 선언되었을 때 객체라고 부르고, 그 객체가 메모리에 할당되어 실제 사용될 때 인스턴스라고 부른다.
  • 객체는 현실 세계에 가깝고, 인스턴스는 소프트웨어 세계에 가깝다.

 

/* 클래스 */
public class Animal {
  ...
}
/* 객체와 인스턴스 */
public class Main {
  public static void main(String[] args) {
    Animal cat, dog; // '객체'

    // 인스턴스화
    cat = new Animal(); // cat은 Animal 클래스의 '인스턴스'(객체를 메모리에 할당)
    dog = new Animal(); // dog은 Animal 클래스의 '인스턴스'(객체를 메모리에 할당)
  }
}
https://gmlwjd9405.github.io/2018/09/17/class-object-instance.html

 

 

728x90

댓글