들어가며자바스크립트의 고급 개념인 클로저에 대해서 학습한 내용이다.클로저를 처음 학습했을 때 가장 와닿지 않았던 이유는 클로저라는 개념이 동작하는 방식은 알겠으나, 이걸 실제로 어떻게 활용해야할 지를 몰랐기 때문이었다. 그러나 최근에 React의 useState를 포함한 다양한 hooks들의 내부가 클로저로 구현되었다는 것을 알게 되었다.따라서 해당 포스팅에서는 클로저의 정의와 원리를 알아보고 React의 hooks들은 왜 클로저로 구현되어야 했는지, 그 이유에 대해서도 알아보자. 참고로 해당 글은 실행 컨텍스트와 스코프에 대한 어느정도 지식이 있다는 가정 하에 읽을 수 있도록 작성되었다. 들어가기 전 Quiz !우선 클로저의 개념에 들어가기에 앞서 퀴즈를 하나 내겠다.아래에서 inner 함수를 실행했을..

Javascript의 주요 개념 중 콜백 함수의 개념을 학습하면서 정리한 글이다. 들어가며자바스크립트를 통해 프로그래밍 하다보면 map이나 forEach와 같은 배열 메서드들을 사용하는 경우가 많다.이때 첫 번째 인자로 콜백함수를 넣게 되는데, 대게 이 파라미터들은 순서와 의미가 정해져 있다. 그러다 문득, 왜 배열 메서드들은 모두 콜백 함수를 인자로 넘기도록 구현이 되어 있는지, 콜백 함수를 넘겨주면 어떤 방식으로 동작하는 것인지에 대한 의문이 들어 학습한 내용을 작성해보았다.  콜백 함수란?함수의 매개변수를 통해 다른 함수의 내부로 전달되는 함수 즉, 함수 A의 매개변수로 함수 B를 전달할 때 B가 콜백 함수가 되는 것이다. 예시를 통해 알아보자.function sayHi() { console..

Javascript의 주요 개념 중 this의 개념을 학습하면서 정리한 글이다.모던 자바스크립트 딥 다이브 22장을 참고했다. 들어가며java와 c++에서 this는 인스턴스를 가리키는 키워드로 동작한다.하지만 javascript에서의 this는 함수를 호출하는 방법에 따라 this의 의미가 달라진다.이때문에 초보자들이 이해하기 어려운 개념 중 하나이기는 하나, 이러한 유연성은 javascript만의 강력한 특징이다. 따라서 이번 글에서는 javascript에서 this는 어떻게 사용하는지에 대해 알아보도록 한다.🧐 Quiz설명에 앞서 this와 관련된 퀴즈를 작성했다.코드 내의 this에는 어떤 값이 할당되는지 생각하면서 답을 유추해보자.const person = { name: "amy", ..

Javascript의 주요 개념 중 실행 컨텍스트의 개념을 학습하면서 정리한 글이다.모던 자바스크립트 딥 다이브 23장을 참고했으며 ES6 문법을 기준으로 작성했다. 들어가며자바스크립트를 어느정도 공부하다보면 실행 컨텍스트라는 개념을 자주 접할 수 있다.하지만 계속 겉핥기 식으로 이해하고 있다는 생각이 들어, 이번 기회에 다시 정리해보고자 한다.  실행 컨텍스트란소스코드를 실행하는데 필요한 환경을 제공하고 코드의 실행 결과를 실제로 관리하는 영역이다. 이렇게 말하면 처음 접하는 사람들은 쉽게 이해하지 못할 것이다.하지만 전체 글을 읽은 이후에 다시 돌아와 읽는다면 이보다 더 적합한 정의는 없을 것이라고 생각한다. 실행 컨텍스트를 알아야 하는 이유우선 개념에 들어가기 앞서 실행 컨텍스트를 알아야 하는 이유..