분류 전체보기

@InputType과 @ObjectType을 동시에 데코레이터 사용 시 주의할 점

import { InputType, ObjectType } from 'type-graphql';@InputType()@ObjectType()class Episode { // class fields and methods}위 코드에 Episode 클래스는 동시에 @InputType()과 @ObjectType() 데코레이터가 적용되어 있다.이 경우, 자동으로 생성되는 SDL(Schema Definition Language)에서 이름 충돌이 발생할 수 있다.  type Episode { # fields defined by @ObjectType()}input Episode { # fields defined by @InputType()}SDL로 변환하면 자동으로 클래스 이름으로 type 또는 input 등의 ..

React에서 렌더링이 발생하는 조건과 렌더링 성능 최적화 방법

🧐 렌더링이 발생하는 조건1. 컴포넌트의 state가 변경되었을 때2. 컴포넌트가 상속받은 props가 변경되었을 때 3. 부모 컴포넌트가 리렌더링이 된 경우 자식 컴포넌트는 모두 리렌더링🧐렌더링 성능 최적화 방법1. hook (useMemo, useCallback)useMemo - 계산의 재실행을 방지useCallback - 함수의 재생성을 방지2. ContextAPI, 기타 상태 관리툴ContextAPI - 컴포넌트 간에 값을 공유, 주로 전역적으로 필요한 값을 다룰 때 사용- 해당 값이 필요한 컴포넌트에만 전달하여 리렌더링 시키고 다른 컴포넌트는 리렌더링 되지 않게 하기recoil - 전역 상태를 관리하기 위한 상태 관리 라이브러리3. windowning - 현재 화면에 보이는 항목만 렌더링 하..

렉시컬 스코핑

💡 렉시컬 스코핑 : 변수의 유효 범위를 결정하는 규칙 중 하나이다.- 스코프는 함수를 호출할 때가 아닌 선언할 때 생긴다.- 함수 외부에서는 함수 내부에서 선언된 변수에 접근할 수 없다.- 정적 스코프라고도 불린다.  렉시컬 스코핑(lexical scoping) 많이들 헷갈리는 개념인데 스코프는 함수를 호출할 때가 아니라 선언할 때 생긴다.호출이 아니라 선언! 정적 스코프라고도 불린다.  다음 코드에서 console이 어떻게 찍힐지 예상해 보기var name = 'zero';function log() { console.log(name);}function wrapper() { var name = 'nero'; log();}wrapper();  정답: zero스코프는 함수를 선언할 때 생긴다.log..

스코프 체인

💡 스코프 체인 : 꼬리를 물고 계속 범위를 넓히면서 찾는 관계를 스코프 체인이라 한다. 💡내부 함수에서는 외부 함수의 변수에 접근 가능하지만 외부 함수에서는 내부 함수의 변수에 접근할 수 없다.  전역변수와 지역변수의 관계에서 스코프 체인(scope chain)이란 개념이 나온다.내부 함수에서는 외부 함수의 변수에 접근 가능하지만 외부 함수에서는 내부 함수의 변수에 접근할 수 없다.  모든 함수들은 전역 객체에 접근할 수 있다.var name = 'zero';function outer() { console.log('외부', name); // zero function inner() { var enemy = 'nero'; console.log('내부', name); // zero } ..