Javascript 3

[JavaScript] 클로저를 통해 코드 최적화(Optimizing)하기

클로저(Closure)를 응용하여 반복되는 사전작업(변수 정의)을 피하는 방법을 사용해 본다.// 함수 호출 시마다 a, b라는 변수가 계속 정의된다.const compare = (x) => { const a = 10; const b = 20; return x > a && x > b ? "bigger" : "smaller"}console.log(compare(30));console.log(compare(5));↓// 클로저를 이용한다.// a와 b의 값은 compare 내부 스코프에 한 번 저장된다.// 그러면 return 안의 anonymous 함수에서 compare의 렉시컬 환경에서 a, b의 값을 참조해 온다.const compare = (x) => { const a = 10;..

IT/JavaScript 2024.04.29

[JavaScript] 함수 선언문 vs 함수 표현식 (feat. 호이스팅, 렉시컬 환경)

자바스크립트는 위에서부터 아래로 순차적으로 코드를 해석하는 인터프리터(Interpreter) 언어입니다. 하지만 모든 코드가 순차적으로 동작하는 건 아닌데요, 그 이유는 호이스팅(Hoisting) 이라는 알고리즘이 정의된 함수와 변수들을 모두 찾아서 먼저 선언시키기 때문입니다. (※ 코드 위치 자체가 끌어올려지는 건 아니며, 렉시컬 환경(Lexical Environment)에 등록되는 것입니다. 렉시컬 환경에는 어떤 스코프 범위에서 사용될 변수와 함수들이 저장되며, 스코프의 개수만큼 생성됩니다. 예를 들어, 함수가 하나 있다면 그 함수 내부의 렉시컬 환경, 그리고 함수 밖의 전역 렉시컬 환경까지 총 두 개가 생깁니다.) 아래의 코드에서는 함수 선언문으로 greet()라는 함수를 만들었습니다. greet(..

IT/JavaScript 2024.04.23

[JavaScript] Promise 객체

함수 a()의 파라미터로 b()라는 함수를 줄 때 b()를 콜백 함수라고 한다. 콜백 함수는 보통 비동기 작업 시 함수의 실행 순서를 지정해주기 위해 사용한다. 그런데 비동기 작업이 여러 개일 때 이들의 순서를 모두 콜백 함수로 지정하려고 한다면 계속 중첩되어, 코드가 알아보기 힘들어질 것이다. function test(message, callback) { axios.get("http://127.0.0.1:8080").then((response) => { callback(message); }); } test("1", function(result) { console.log(result); test("2", function(result) { console.log(result); test("3", functi..

IT/JavaScript 2024.01.23