본문 바로가기

언어/자바스크립트6

클로저(Closures) 클로저란? 함수와 그 함수의 렉시컬 환경과의 조합이다. 렉시컬 환경이란 뭘까요? 이전에 살펴보았듯이 함수는 실행되기전 실행 컨텍스트를 생성합니다. 실행 컨텍스트는 렉시컬 환경에다가 해당 함수의 변수, 함수 식별자들을 정의하고 값을 저장하며, 외부 렉시컬환경에 참조할수 있도록 외부 렉시컬 환경도 저장해 둡니다. 이로써 함수는 자신의 필요한 변수나, 함수, 클래스 들을 찾을 수 있었죠. 그럼 왜 클로저랑 관련이 있을까요? 한번 예시를 봐봅시다. 아래 코드는 어떤 값을 출력할까요? const x = 999999; function outerFun() { const x = 1; function innerFun() { console.log(x); } return innerFun; } const innerFun = .. 2024. 2. 21.
실행 컨텍스트(렉시컬 스코프, 렉시컬 환경, 스코프 체인, 호이스팅) 이 글로 끝내버리기 이 글은 실행 컨텍스트와 렉시컬 스코프, 렉시컬 환경, 호이스팅, 스코프 체인을 이야기 진행 방식으로 작성하였으니 천천히 커피 한잔 마시면서 이야기를 들어주시면 감사하겠습니다. 실행 컨텍스트 실행 컨텍스트는 식별자를 등록하고 관리하는 스코프와 실행 순서 관리를 구현한 내부 메커니즘으로, 모든 코드는 실행 컨텍스트를 통해 실행되고 관리된다. 흠.. 말은 어렵지만 한번 풀어보면 코드를 실행하는데 재료를 준비해 주고 실행 순서를 관리해 주는 것 같네요. 이 실행 컨텍스트를 이해하면 호이스팅, 렉시컬 환경, 스코프 체인을 알게 됩니다. 자바스크립트에는 전역, 함수, eval, 모듈로 4개의 소스 코드 타입이 있습니다. 저는 여기서 전역, 함수 소스 코드로 이야기를 풀어 볼 건데, 일단 전역 소스 코드와 함수 소.. 2023. 5. 13.
BigInt 큰 숫자 다루기 코딩 테스트 문제를 풀다보면 큰 숫자를 다룰 때가 있다. 자바스크립트는 최대 9007199254740991까지 정확한 숫자를 다룰수 있다 아래 코드를 실행시켜 보면 결과를 다르게 나타나 있다. console.log(9007199254740991 + 10); console.log(9007199254740991 + 20); console.log(9007199254740991 + 30); 해결법(결론) BinInt를 사용해주는 것이다. 사용법은 BigInt(숫자나 문자)처럼 사용해주거나 1231231231n처럼 마지막에 n 을 붙여주면 된다. console.log(9007199254740991n + 10n); console.log(9007199254740991n + 20n); console.log(900719.. 2023. 4. 12.
자바스크립트 This 이걸로 끝내기 This란? 자신이 속한 객체 또는 자신이 생성할 인스턴스를 가리키는 자기 참조 변수다. this를 통해 자신이 속한 객체 또는 자신이 생성할 인스턴스의 프로퍼티나 메서드를 참조할 수 있다. 객체 리터럴에서 this는 자기 자신을 가리킴 const circle = { radius: 5, getDiameter() { return 2 * circle.radius; }, }; console.log(circle.getDiameter()); // 10 생성자 함수 내부의 this는 생성자 함수가 생성할 인스턴스를 가리킴 function Circle(radius) { this.radius = radius; } Circle.prototype.getDiameter = function () { return 2 * thi.. 2023. 3. 28.