현인

문제 요격시스템 https://school.programmers.co.kr/learn/courses/30/lessons/181188?language=javascript 소요시간 30분 풀이 계획 풀이 방법 (s,e) 구간이 여러 개 주어지는 배열을 s를 기준으로 오름차순 정렬 첫 번째 원소의 e 값을 기록 두 번째 원소 부터 순차적으로 접근 현재 타겟의 s 값이 기록된 e 값 보다 크거나 같은 경우 answer 1 증가시킨다. (새로운 구간을 발견 했기에 요격할 미사일이 하나 더 필요해짐) 기록된 e 값을 현재 타겟의 e 값으로 갱신 현재 타겟의 s 값이 기록된 e 값 보다 작은 경우 현재 타겟의 e 값이 기록된 e 값 보다 작으면 e 값을 현재 타겟의 e 값으로 갱신 (기록하고 있는 구간안에 포함되는 ..

※ 제 글은 리액트를 처음 접하시거나 아직 Hook에 대해 익숙하지 않으신 분들이 빠르게 Hook에 대해 이해하실 수 있도록 핵심만 정리했습니다. 조금 더 상세한 내용은 React Hook 공식 문서를 통해서 이해하시면 좋을 것 같습니다. 참고 자료 : 김민준. 『리액트를 다루는 기술』. 길벗, 2019. useEffect useEffect는 리액트 컴포넌트가 렌더링 될 때마다 특정 작업을 수행하도록 설정할 수 있는 Hook입니다. 클래스형 컴포넌트의 componentDidMount와 componentDidUpdate를 합친 형태로 보아도 무방합니다. useEffect 적용 예시 useState 글에서 만들었던 Info 컴포넌트에 useEffect를 한 번 적용해 보겠습니다. import React, {..

※ 제 글은 리액트를 처음 접하시거나 아직 Hook에 대해 익숙하지 않으신 분들이 빠르게 Hook에 대해 이해하실 수 있도록 핵심만 정리했습니다. 조금 더 상세한 내용은 React Hook 공식 문서를 통해서 이해하시면 좋을 것 같습니다. 참고 자료 : 김민준. 『리액트를 다루는 기술』. 길벗, 2019. useState uesState는 함수형 컴포넌트에서도 가변적인 상태를 지닐 수 있게 해줍니다. 만약 함수형 컴포넌트에서 상태를 관리해야 한다면 이 Hook을 사용하면 됩니다. useState 활용 예제 useState 훅을 사용한 숫자 카운터 예제를 보겠습니다. import { useState } from 'react' const Counter = () => { const [value, setValu..

클래스는 프로토타입의 문법적 설탕인가? 자바스크립트는 프로토타입 기반 객체지향 언어다. 비록 다른 객체지향 언어와의 차이점에 대한 논쟁이 있긴 하지만 자바스크립트는 강력한 객체지향 프로그래밍 능력을 지니고 있다. ES6에서 도입된 클래스는 기존 프로토타입 기반 객체 지향 프로그래밍보다 클래스 기반 객체지향 프로그래밍에 익숙한 프로그래머가 더욱 빠르게 학습할 수 있도록 클래스 기반 객체지향 프로그래밍 언어와 매우 흡사한 새로운 객체 생성 메커니즘을 제시한다. 그렇다고 ES6의 클래스가 기존의 프로토타입 기반 객체지향 모델을 폐지하고 새롭게 클래스 기반 객체지향 모델을 제공하는 것은 아니다. 사실 클래스는 함수이며 기존 프로토타입 기반 패턴을 클래스 기반 패턴처럼 사용할 수 있도록 하는 문법적 설탕이라고 볼..

클로저는 자바스크립트 고유의 개념이 아니다. 함수를 일급 객체로 취급하는 함수형 프로그래밍 언어에서 사용되는 중요한 특성이다. 클로저는 자바스크립트 고유의 개념이 아니므로 클로저의 정의가 ECMAScript 사양에 등장하지 않는다. MDN에서는 클로저에 대해 다음과 같이 정의하고 있다. 클로저는 함수와 그 함수가 선언된 렉시컬 환경과의 조합이다. 렉시컬 스코프 자바스크립트 엔진은 함수를 어디서 호출했는지가 아니라 함수를 어디에 정의 했는지에 따라 상위 스코프를 결정한다. 이를 렉시컬 스코프라 한다. 스코프의 실체는 실행 컨텍스트의 렉시컬 환경이다. 렉시컬 환경은 자신의 외부 렉시컬 환경에 대한 참조를 통해 상위 렉시컬 환경과 연결된다. 이것이 바로 스코프 체인이다. 정리하면, 렉시컬 환경의 “외부 렉시컬..