Resource/JavaScript & TypeScript8 [JavaScript] 클래스(Class) 정의 클래스는 객체지향 프로그래밍에서 특정 객체인 인스턴스를 생성하기 위해 변수(=프로퍼티)와 메서드를 정의하는 일종의 틀이라고 할 수 있습니다. 실제 데이터를 구현한 것을 객체라고 하고, 데이터를 구현하는 데 일반화된 정보들을 정리해 둔 것을 클래스라고 부릅니다. 이렇게 구성된 클래스를 객체로 만드는 과정을 인스턴스화(instantiating) 라고 합니다. ES6 이전의 자바스크립트에서는 객체지향 프로그래밍을 수행하기 위해 함수의 프로토타입을 사용하였습니다. 그러나 자바스크립트는 ES6부터 도입된 `class` 키워드를 사용하여 (완전히 동일하지는 않지만) C++, JAVA와 같은 전통적인 객체지향 프로그래밍 언어처럼 객체를 정의할 수 있게 되었습니다. 그러나 재미있는 점은 자바스크립트에서 class.. 2023. 12. 4. [JavaScript] 비동기 프로그래밍 자바스크립트 엔진은 작성한 코드를 싱글 스레드, 즉 하나의 메인 스레드에서 순차적으로 실행합니다. 이는 개발자가 명시적으로 멀티스레딩 방식의 코드를 작성하지 않는다면, 코드는 싱글 스레드에서만 실행된다는 의미입니다. 그러나 자바스크립트에서는 비동기 프로그래밍을 지원하기 때문에 CPU 연산이 많이 필요한 작업이 아니라면, 복잡한 멀티 스레딩 방식으로 코드를 작성할 필요가 없습니다. 자바스크립트가 처음 등장했을 때는 콜백(callback) 방식의 비동기 프로그래밍만 지원했습니다. 콜백 함수 (callback function) 콜백 함수는 특정 함수가 끝나고 나서 실행되는 함수입니다. function longWork() { // 비동기로 실행하는 함수 setTimeout setTimeout(() => { co.. 2023. 11. 26. [JavaScript] 클로저(Closure) 자바스크립트에서 클로저는 어떤 함수와, 그 함수가 선언된 렉시컬 환경의 조합입니다. 다만 이렇게 말하면 조금 추상적이라 이해하기가 쉽지 않습니다. 좀 더 말을 정리해본다면, 클로저란 상위 함수보다 하위 함수가 더 오래 살아있는 경우를 의미한다고 할 수 있습니다. 클로저의 개념 function getNumber() { const number = 5; function innerGetNumber() { return number; } return innerGetNumber; } const runner = getNumber(); console.log(runner()); // 5 위 코드를 보면, innerGetNumber 함수는 상위 실행 컨텍스트를 참조할 수 있기 때문에 number 변수를 발견할 수 있습니다... 2023. 11. 23. [JavaScript] this 자바스크립트는 렉시컬 스코프를 사용하기 때문에, 함수의 상위 스코프는 함수가 정의되는 시점에 평가됩니다. 하지만 this 키워드는 객체가 생성되는 시점에 결정됩니다. this가 동작하는 방식 const testFunction = function() { return this; } console.log(testFunction()) // this 객체는 window, global을 가리킨다. 위 testFunction의 this는 함수(=객체) 생성 시점에 결정되게 되는데, testFunction은 일반 함수로서 호출되었기 때문에 이때 testFunction의 this는 전역 객체인 window 또는 global을 가리키게 됩니다. const changuk = { name: '우창욱', year: 1998, .. 2023. 11. 23. 이전 1 2 다음
