1. 콜백 함수란?콜백 함수는 다른 코드의 인자로 넘겨주는 함수이다. 콜백 함수를 넘겨받은 코드는 이 콜백 함수를 필요에 따라 적절한 시점에 실행할 것이다. callback은 '부르다', '호출하다'는 의미인 call과, '되돌다'는 의미인 back의 합성어로, '되돌아 호출해 달라'는 명령이다. 즉, 어떤 함수 X를 호출하면서 '특정 조건일 때 함수 Y를 실행해서 나에게 알려달라'는 요청을 함께 보내는 것이다. 이. 요청을 받은 함수 X의 입장에서는 해당 조건이 갖춰졌는지 여부를 스스로 판단하고 Y를 직접 호출합니다. 결론적으로, 콜백 함수는 다른 코드(함수 또는 메서드)에게 인자로 넘겨줌으로써 그 제어권도 함께 위임한 함수이다. 콜백 함수를 위임받은 코드는 자체적인 내부 로직에 의해 이 콜백 함수를 ..

자바스크립트에서 this는 어디서든 사용할 수 있다. 그러나 상황에 따라 this가 바라보는 대상이 달라지게 된다.그래서 상황별로 this가 어떻게 달라지고, 왜 그렇게 되는지 알고 있어야 한다. 1. 상황에 따라 달라지는 this자바스크립트에서 this는 기본적으로 실행 컨텍스트가 생성될 때 함께 결정된다. 즉, this는 함수를 호출할 때 결정된다고 할 수 있고 함수를 어떤 방식으로 호출하느냐에 따라 값이 달라지는 것이다. 1-1. 전역 공간에서의 this전역 공간에서 this는 전역 객체를 가리킨다. 전역 컨텍스트를 생성하는 주체가 바로 전역 객체이기 때문이다. 참고로 브라우저에서 전역객체는 window이고, Node.js 환경에서는 global이다. 전역변수그래서 전역변수를 선언하면 자바스크립트 ..

1. 실행 컨텍스트란?실행 컨텍스트실행할 코드에 제공할 환경 정보들을 모아놓은 객체이다. 동일한 환경에 있는 코드들을 실행할 때 필요한 환경 정보들을 모아 컨텍스트를 구성하고, "콜스택"에 쌓아올렸다가, 가장 위에 쌓여있는 컨텍스와 관련 있는 코드들을 실행하는 식으로 전체 코드의 환경과 순서 보장한다. 실행 컨텍스트를 구성하는 방법은 "함수 실행"이다. 실행 컨텍스트 동작처음 자바스크립트 코드를 실행하는 순간 "전역 컨텍스트"가 콜스택에 담음.outer 함수를 호출하면서 outer에 대한 환경 정보를 수집해서 "outer 실행 컨텍스트"를 생성하여 콜스택에 담음.inner 함수를 호출하면서 inner에 대한 환경 정보를 수집해서 "inner 실행 컨텍스트"를 생성하여 콜스택에 담음.inner 함수의 실행..

Q. 질문JavaScript만 사용하는 것과 비교해 TypeScript를 사용하는 이유에 대해 설명해 주세요. (코드잇 스프린트 위클리 페이퍼 #12) A. 답변현재 상황요즘 채용 공고를 보면 대부분 타입스크립트를 할 수 있는 사람을 우대하는 것을 쉽게 볼 수 있다.그만큼 타입스크립트가 중요하고 대부분의 기업에서 프론트엔드 개발을 할 때 타입스크립트를 채택해 사용하고 있다는 것을 알 수 있다. 타입스크립트 사용 이유그렇다면 자바스크립트 대신 왜 귀찮게 타입스크립트를 사용하는 것일까? 바로 프로그램의 안정성 을 위한 것이다. 자바스크립트는 알다시피 동적 언어라서 고정된 타입 없이 자유롭게 변수를 선언하고 사용할 수 있다.이게 자바스크립트의 장점이 될 수 있지만 타입 오류가 코드를 실행하기 전까지 알 수 없..

시작하며...코드잇 스프린트 이전 팀원들과 함께 코어 자바스크립트를 읽고 자신이 맡은 부분을 정리해서 발표하는 테크톡 스터디를 하였다. 한 챕터에서 분량을 나눠 각자 내용을 공부하고 정리해서 10분 정도 설명하는 방식으로 진행하였으며, 내가 발표한 부분의 내용을 이해하고 다른 사람의 발표를 들으면서 내용을 이해하는 방식이었다. 총 7개의 챕터를 일주일에 1 챕터씩 진행하여 총 7주가 소요되었다. 스터디 내용 정리[챕터1 - 불변객체][챕터2 - environmentRecord][챕터3 - call & apply 메서드][챕터4 - 제어권 - 인자 & this][챕터5 - 부분 적용 함수][챕터6 - 메서드 오버라이드][챕터7 - ES6의 클래스 및 클래스 상속] 스터디 회고지금까지 한 번도 스터디를 진행..

시작하기 앞서기존 자바스크립트로 만든 프로젝트에서 새로운 프로젝트를 생성하지 않고 그 프로젝트에서 타입스크립트로 마이그레이션 하는 방법에 대해 알아볼 것이다. 마이그레이션 방법1. TypeScript 설치타입스크립트과 타입스크립트에 필요한 기타 모듈들을 설치한다.npm install --save typescript @types/node @types/react @types/react-dom @types/jest2. tsconfig.json 작성기존 자바스크립트에 있던 jsconfig.json 을 제거하고 tsconfig.json 파일을 작성한다.나는 아래 코드에 있는 내용을 작성했다.{ "compilerOptions": { "baseUrl": "src", "target": "es5", "..

☘️ 시작하며... 첫 번째 게시물로 자바스크립트 고차함수인 map에 대해 알아보았다. [자바스크립트/JavaScript] 고차 함수 map 사용 방법 #1 ☘️ 시작하며... 코딩 테스트 공부를 하려고 자료구조를 공부하고 있는데 문제를 풀다가 도중에 내가 자바스크립트 고차함수에 대해 잘 모르고 있다는 것을 알게 되어 글을 작성하면서 공부할 jjang-j.tistory.com 이번 게시물은 filter에 대해 알아볼 것이다. ☘️ Array.filter() filter는 무슨 역할을 할까? filter 배열을 for와 같이 돌면서, true에 해당하는 요소로 구성된 새로운 배열을 생성하여 반환 사용 예시 배열 numArr가 있을 때, 홀수로 된 배열을 반환받고 싶으면 아래처럼 코드를 작성한다. filte..

☘️ 시작하며... 코딩 테스트 공부를 하려고 자료구조를 공부하고 있는데 문제를 풀다가 도중에 내가 자바스크립트 고차함수에 대해 잘 모르고 있다는 것을 알게 되어 글을 작성하면서 공부할 겸 정보를 알려주기 위해 해당 글을 작성하게 되었다. 첫 번째 게시물은 map 에 대해 알아볼 것이다. ☘️ 고차 함수란? 고차 함수란? 함수를 파라미터(인자)로 받거나 결과로 반환해 주는 함수(메서드) ☘️ Array.map() map은 배열을 for와 같이 돌면서, 결과로 배열을 반환해 준다. 사용 예시 배열 array가 있을 때, 각 요소에 2를 곱한 배열을 반환받고 싶을 때, 아래처럼 코드를 작성한다. map의 첫 번째 인자인 item은 배열의 각 요소이다. (인자 이름은 사용자가 원하는 대로 작성할 수 있다.) ..