모던 자바스크립트 deep dive에서 this 관련 부분을 읽던 도중에 헷갈려서 자세히 공부한 내용을 블로그에 남김. 외부 함수인 메서드와 중첩 함수 또는 콜백 함수의 this가 일치하지 않는다 외부 함수인 메서드와 중첩 함수 또는 콜백 함수의 this가 일치하지 않는다는 의미는, 함수의 호출 방식에 따라 this가 가리키는 대상이 달라진다는 것을 의미한다. const obj = { value: 100, outerFunc: function() { console.log("outerFunc's this:", this); // {value: 100, outerFunc: ƒ} const innerFunc = function() { console.log("innerFunc's this:", this); // w..

*부족한 내용들은 천천히 보충해나갈것임. JS에서 Class를 활용해서 모듈화해서 각각의 Class에 해당하는 기능들을 만들고 조합하는 방법에 대해 짧게 기록해보려 한다. Q. 자바도 아닌데 자바스크립트에서 왜 Class 를 활용하나? A. Class를 활용하면 객체의 상태와 메서드를 하나의 단위로 묶어서 관리할 수 있고 이를 통해 유지보수성이 좋아지고 중복 코드가 줄어들며 코드의 가독성도 높일 수 있다. 즉, 객체의 청사진을 만들어 속성과 메서드를 정의한 다음 필요할 때 인스턴스화 할 수 있고 이를 통해 코드베이스 전체에서 해당 객체를 쉽게 관리하고 조작할 수 있다. 예를 들어, 아래와 같이 Person 클래스와 Phone 클래스가 있다고 가정해보자 class Person { constructor(na..

// 1. function Person(name, age) { this.name = name; this.age = age; this.getName = function () { return this.name + '입니다.'; } } // 2. Person.prototype.getName = function (){ return this.name + '입니다.' } 1번과 2번은 JavaScript에서 객체 지향 프로그래밍을 구현하는 방식에 차이가 있다. 1번은 생성자 함수를 사용하여 객체를 생성하는 방식이다. Person 함수는 name과 age라는 인자를 받아 해당 값을 객체의 프로퍼티로 설정한다. 또한, getName이라는 메소드를 객체의 프로토타입에 추가하여 객체가 이 메소드를 호출할 수 있도록 한다...