this는 실행컨텍스트 문맥에 직결되는 부분이기도 하다.실제 함수를 작성할때 꽤나 자주 사용하지만, this가 환경에 따라 참조값이 달라지는 부분이 있어 짚고 넘어가려 작성해본다.this에 대하여,this는 JavaScript 예약어다.this는 자신이 속한 객체 또는

Generator 함수는 ES6에 도입된 이터러블을 생성하는 함수이다.제네레이터를 사용하게 되면, 이터레이션 프로토콜을 준수해서 이터러블을 생성하는 방식보다 간편하게 이터러블이 구현 가능하다.이는 비동기 처리에 유용하게 사용되곤 한다.제네레이터 함수는 일반 함수와는 다

앞서 Scope(링크참조)에서 다룬 부분이지만, 자주 나오는 질문이기도 하고 확실하게 알고가는 느낌이기도 하면서,면접 단골질문인 var let const를 명확히 정리해놓고 가고자 따로 작성해보았다.var는 function-scoped let,const 는 block-

이터러블/이터레이션 프로토콜은 JavaScript 객체들이, 예를 들어 for..of 구조에서 어떠한 value 들이 loop 되는 것과 같은 iteration 동작을 정의하거나 사용자 정의하는 것을 허용한다.

every는 배열의 모든 원소가 조건에 맞는지 검사하기 유용한 함수다. 즉 모든 조건이 만족할때만 true를 뽑아준다. 꽤 쓸만한 일이 있을거 같아 따로 작성하게 되었다.소스코드

useContext 훅을 사용하면, 컴포넌트를 사용하지 않고도 부모 컴포넌트로부터 전달된 컨텍스트 데이터를 사용할 수 있다. 다만 Context는 꼭 필요할 때 사용해야한다. Context를 사용하면 컴포넌트를 재사용하기 어려워질수 있기 때문이다. Props Dril

useMemo는

useEffect는 함수 실행 시 함수 외부의 상태를 변경하는 연산하는 부수효과 기능을 해준다.useEffect로 전달되는 함수는 지연 이벤트 동안에 레이아웃 배치와 그리기를 완료한 후 발생을 한다. 대부분에 작업이 브라우저에서 화면을 업데이트 하는 것을 차단해서는 안

굉장히 당황한 질문이면서, 기본기에 대한 너무 날카로운 질문중 하나였다. setTimeOut에 대해 알고있는 지식에 대해 알고있다고 넘어가버린 경우가 꽤 있다.이렇게 하면 0초니까 자연스럽게 4가 들어갈줄 알았는데,답은 다음과 같았다.오잉.. 왜 setTimeout 0

면접을 보다가 CORS 에러에 대해 질문을 받았다.내가 실제로 현업에서 빌드할때는 JAVA 빌드 환경에서 탬플릿 작업을 하다보니 CORS에 대한 규약에 대해 고민해본적이 없는데, 실제로 출처가 다른 곳에서 리소스 전달을 하면 브라우저 렌더 과정에서 문제가 생긴다고 한다

모든 리액트 컴포넌트에 라이프사이클 컴포넌트의 수명은 페이지에 렌더링되기 전인 준비과정에서 시작하여 페이지에서 사라질 때 끝난다. 리액트 프로젝트를 진행하면, 컴포넌트를 처음으로 렌더링 할 때, 어떤 작업을 처리해야 하거나 컴포넌트를 업데이트하기 전 후로 어떤 작업을

웹 애플리케이션을 만들다보면 다음과 같이 반복되는 코드가 있기 마련이다.예를들면 다음 형태처럼 반복되는 리스트 코드같은 작업이 있다.만약 보여줘야할 데이터가 유동적이라면, 결코 효율적인 코드라 보기 어렵고, 관리하는 측면에서 어려움이 생긴다.이와 같은 Iteration

호출 스케쥴링은 함수를 명시적으로 호출하면 함수가 즉시 실행 되는데, 명시적으로 호출하지 않고 일정 시간이 경과된 이후에 호출되도록 함수 호출을 예약하려면 타이머 함수를 사용한다.JavaScript에서는 타이머를 생성할 수 있는 타이머 함수 setTimeout과 set

객체를 프로퍼티 값으로 갖는 객체의 경우 얕은 복사는 한단계 까지만 복사하는 것을 말한다.깊은 복사는 객체에 중첩되어 있는 객체까지 모두 복사하는것을 말한다.얕은 복사와 깊은 복사로 생성된 객체는 원본과는 다른 객체다.즉 원본과 복사본은 참조 값이 다른 별개의 객체다.

destucturing assginment 구조 분해 할당은 구조화된 배열과 같은 이터러블 또는 객체를 destructing(비구조화)하여 1개 이상의 변수에 개별적으로 할당하는 것을 말한다. 배열과 같은 이터러블 또는 객체 리터럴에서 필요한 값만 추출하여 변수에 할당

실무 웹 개발에서 날짜는 꽤나 자주 등장하는 케이스다.날짜를 단순히 띄우기 뿐만 아니라 시간을 계산하거나, 필요한 시간단위만 띄워야하는 경우가 종종 있는 편인데, 이를 정리해두면 좋을거 같다는 생각이 들었다. 표준 빌트인 객체인 Date는 날짜와 시간을 위한 메서드를

디자인패턴에 대해서 생각하게 된 계기는 자주 반복되는 코드의 양상이 보일때 효율성에 대해 고민하면서 부터였다.JavaScript Design Patterns우연히 디자인패턴에 관한 글을 보고 같이 일을 하고있는 백엔드 개발자와 공통적으로 하고있는 고민이라는 사실을 깨달

스코프의 종류를 볼때, 크게 코드를 전역과 지역으로 구분짓는다.전역은 코드의 가장 바깥 영역을 해당하고, 지역은 함수 몸체 내부에 해당한다.이때 변수는 자신이 선언된 위치에 의해 자신이 유효한 범위인 스코프가 결정된다.전역에 변수를 선언하면 전역 스코프를 갖는 전역변수

스코프(scope - 유효범위)의 이해가 필요한 경우가 실무에서 꽤나 있었다. 자바스크립트에서 스코프는 다른 언어의 스코프랑 구별되는 특징을 가지고 있다. var 키워드로 선언한 변수와 let 또는 const 키워드로 선언한 변수의 스코프도 다르게 동작하며, 변수 그

JSON은 클라이언트와 서버 간의 HTTP 통신을 위한 텍스트 데이터 포맷이다.JavaScript에 종속되지 않는 언어 독립형 데이터 포맷으로, 대부분의 프로그래밍 언어에서 사용할 수 있다.실제로 실무에서 데이터를 전송받을때 (ajax, axios 등) 제일 보편적으로