728x90 FrontEnd81 업데이트 (Updating) What ? Updating컴포넌트가 업데이트되는 과정 입니다.생성 ( Mounting) 다음 단계로 컴포넌트가 업데이트 하는 시점 을 의미합니다.state (상태) 나 props 가 변경될 때마다 실행됩니다. 매서드 1. getDerivedStateFromProps업데이트 (Update) 과정에서 가장 먼저 호출되는 메서드로 초기 props에 기반한 state (상태)가 저장 되는 곳입니다.getDerivedStateFromProps(props, state) {...} 2. shouldComponentUpdate컴포넌트의 리렌더링 유무를 불리언 ( true / false ) 값으로 결정합니다. true 반환 시 생명주기 를 진행하고, false를 반환할 경우 중지 합니다. shouldComponent.. 2022. 11. 27. null 타입 어떤 값이 의도적으로 비어있음 을 표현하는 값입니다. null은 변수를 선언하고 빈 값(빈 객체) 을 할당한 상태입니다. 불리언 연산에서는 거짓 으로 취급합니다. console.log(null) //false 주의 ) JS는 대소문자를 구별하므로 Null, NULL은 식별자로 인식합니다. 특징 변수에 null 값을 할당해 이전에 참조하던 값을 더 이상 참조하지 않을 수 있습니다. null은 원시타입 이지만 객체 이며 , 객체타입 입니다. ex) var nullType = null; console.log(typeof null); // object 이전에 할당되어 있는 값을 제거하므로, 메모리 공간에 대한 가비지 콜렉션 을 수행할 수 있습니다. 함수에 유효한 값을 반환할 수 없는 경우 , null 값을 반환.. 2022. 11. 25. undefined 아무 값도 할당받지 않은 상태입니다. 변수 선언에 의해 메모리 공간이 만들어졌지만, 할당 이 이뤄지기 전의 빈 상태의 값입니다. JS 엔진은 선언 후 할당이 없을 시, undefined 를 반환시킵니다. ex) var a; console.log(a); // undefined console.log(typeof a); // undefined 할당 된 값을 초기화하고 싶을 때는 null 값 을 할당하는 것을 권장합니다. 2022. 11. 25. 가비지 콜렉션 프로그램에서 더 이상 사용하지 않는 메모리 를 자동으로 정리합니다. 메모리 공간을 꽉 채우면, 메모리 누수 로 인해 문제 (속도 저하, 예기치 못한 종료, 느린 응답속도 etc) 가 발생합니다. 프로그래머라면 방지하고 버그가 있을 시, 잡아야 합니다. " 가비지 콜렉션 은 대신 해줍니다. " managed language unmanaged language How? 1. 트레이싱 (mark and sweep) 객체에 flag 를 표시하고, 사이클마다 메모리 관리자가 객체를 추적해 사용 여부를 확인해 mark (표시)를 합니다. 이후 표시되지 않은 객체는 sweep (삭제) 해 메모리를 해체합니다. 2. 래퍼런스 카운팅 방법 객체를 참조하는 변수의 수를 추적하는 방법입니다. 변수의 래퍼런스가 복사.. 2022. 11. 25. 불리언 타입 논리적 참 , 거짓을 나타내는 데이터 타입입니다. true , false 두 가지 값 만 존재합니다. 진리 값 이라고도 명명합니다. 참과 거짓을 구분하는 조건에 의해 프로그램의 흐름을 제어하므로 조건문 에서 자주 사용됩니다. 다른 타입을 불리언 값으로 변환 1. 이중 부정을 통해 값을 boolean 타입으로 변환할 수 있습니다. ex) !!'hello'; // true 2. Boolean 함수를 사용해도 됩니다. ex) Boolean('hello'); // true cf ) 1번이 편리해 자주 사용됩니다. 2022. 11. 25. 생성 ( Mounting ) DOM이 생성되어 브라우저에 나타나는 과정입니다. 컴포넌트를 만들고 브라우저에 표시되게 하는 것 까지의 시점 입니다. 메서드(method) 1. consturctor constructor(props) { ... } 컴포넌트 가 만들어지는 과정에서 가장 먼저 생성되는 함수이며, 생성할 때 마다 호출이 되는 클래스 생성자 메서드 입니다. 컴포넌트가 가지고 있는 요소들 (state, props etc)의 초기 설정을 해 반환합니다. setState를 사용할 수 없으며, DOM에 접근해선 안된다. 2. getDerivedStateFromProps getDerivedStateFromProps(props, state) { ... } props 로 전달된 값을 state 에 넣을 때 이용하는.. 2022. 11. 25. 이전 1 ··· 4 5 6 7 8 9 10 ··· 14 다음 728x90
