오늘은 자바스크립트의 this 개념을 복습하고, 자바스크립트로 간단한 멀티 페이지 애플리케이션(MPA)을 구현했다.자바스크립트의 this 이해하기자바스크립트에서 this는 호출 방식에 따라 참조하는 대상이 달라진다.// 일반 함수에서의 thisfunction normalFunction() { console.log(this); // window 객체(브라우저 환경)}// 메서드에서의 thisconst obj = { name: '객체', method: function() { console.log(this); // obj 객체 자신을 가리킴 }};// 이벤트 핸들러에서의 thisbutton.addEventListener('click', function() { console.log(this); /..

생성자 함수는 객체를 생성하기 위한 템플릿으로, 비슷한 구조의 객체를 여러 개 만들 때 유용하다. 다음은 동물의 종류와 소리를 인자로 받아 객체를 생성하는 Animal 생성자 함수를 만든 후, makeSound 메서드를 추가한 코드이다.function Animal(type, sound) { this.type = type; this.sound = sound; this.makeSound = function () { return `${this.type}(은/는) ${this.sound}`; };}생성자 함수 내부에서 this 키워드는 생성될 객체를 가리킨다. 생성자 함수의 이름은 일반적으로 대문자로 시작하여 일반 함수와 구분한다. const dog = new Animal("개", "멍멍");con..

ES6에서 도입된 화살표 함수와 함수의 스코프, 객체 지향 프로그래밍의 기본이 되는 객체와 메서드 활용에 대해 알아보자.스코프와 호이스팅스코프는 변수의 유효 범위를 결정하는 규칙이다. 자바스크립트에서는 전역 스코프, 함수 스코프, 그리고 ES6부터 추가된 블록 스코프가 있다. 호이스팅은 변수와 함수 선언이 코드 실행 전에 메모리에 먼저 올라가는 현상을 말한다. 정확히 말하면, 실제로 올라가는 것이 아니라 끌어올린 것처럼 선언부를 먼저 인식한다는 개념이다.function sumNumbers(a, b) { const modifiedB = b + 5; return a + modifiedB;}console.log(sumNumbers(3, 7)); // 15 (3 + (7 + 5))함수 내에서 선언된 변수 (..