전체 글 63

클로저 (Closure)

클로저란, 사전에서 뜻을 찾아보면 폐쇄라는 뜻을 가지고 있습니다.함수가 선언될(생성될) 그 당시에 주변의 환경과 함께 갇히는 것을 말합니다.즉, 클로저는 함수와 그 함수가 선언된 렉시컬 환경과의 조합입니다.또 다른 말로, 함수가 속한 렉시컬 스코프를 기억하며, 함수가 렉시컬 스코프 밖에서 실행될 때도 이 스코프에 접근할 수 있게 해주는 기능입니다. 여기서 렉시컬 스코프란 함수가 선언이 되는 위치에 따라서 상위 스코프가 결정되는 스코프입니다. 결국, 내부함수는 외부함수의 지역변수에 접근할 수 있는데 외부함수의 실행이 끝나서 외부함수가 소멸된 이후에도 내부함수가 외부함수의 변수에 접근할 수 있는 것을 말합니다. 이제부터 다양한 예시를 통해 알아보겠습니다.const x = 1;function outerFunc..

JavaScript 2024.08.16

(CallBack)콜백 함수의 콜백 지옥과 비동기 제어

콜백 지옥이란 간단하게 말해서 남을 고려하지 않은 코드를 작성한 겁니다.즉, 그저 내가 표현하고 싶은 것을 위해 콜백을 이어붙여 가독성, 유지보수를 최악으로 만드는 것을 뜻합니다. 그렇다면, 콜백 지옥을 해결하기 위한 비동기 제어에 대해서 알아보겠습니다.비동기(asynchronous)란, 실행 중인 코드의 여부와 무관하게 즉시 다음 코드로 넘어가는 방식으로 setTimeout, addEventListener 등이 있습니다.또한, 별도의 요청, 실행 대기, 보류 등과 관련된 코드는 모두 비동기적 코드입니다. 동기(synchronous)란, 현재 실행중인 코드가 끝나야 다음 코드를 실행하는 방식을 말합니다. 비동기의 간단한 이해를 돕기 위해 예시를 들겠습니다.// 비동기적 코드의 이해!setTimeout(f..

JavaScript 2024.08.14

(CallBack)콜백 함수

1. CallBack 함수란 다른 코드의 인자로 넘겨주는 함수입니다.다른 코드의 인자로 넘겨준다는 뜻은 콜백함수를 넘겨받는 코드가 있다는 얘기로 대표적으로 forEach, setTimeout 등이 있습니다.예시로 밑을 보시면 되겠습니다.setTimeout(function() {    console.log("hello");}, 1000); const numbers = [1, 2, 3, 4, 5];numbers.forEach(function(number) {    console.log(number);}); 2. CallBack 함수는 action에 대한 제어권을 넘겨줄테니 너가 알고 있는 그 Logic으로 처리를 해달라는 뜻입니다.그럼 여기서 제어권에 대한 이야기를 해야겠죠?CallBack 함수는 어떤 제어..

JavaScript 2024.08.14