전체 글

TIL - 20220728

오늘은 모던 JavaScript 튜토리얼에서 정적 메서드와 정적 프로퍼티(https://ko.javascript.info/static-properties-methods)에 대해 공부했다. 작성한 질문은 다음과 같다. 기존 클래스에서 메서드를 만들면 클래스의 프로토타입에서 함수가 정의되었지만, 정적 메서드는 클래스 함수 자체에서 만들어주는 메서드이다. 클래스 안에서 메서드에 static 키워드를 붙여 만들 수 있고 정적 메서드는 메서드를 프로퍼티 형태로 직접 할당하는 것과 동일한 일을 한다. 정적 메서드는 클래스를 이용하여 객체 여러 개를 만든 상황에서 이 여러 개의 객체를 비교할 때 사용하면 좋다. 정적 프로퍼티란 정적 메서드와 마찬가지로 클래스 함수 자체에 만들어주는 프로퍼티이며 정적 메서드와 마찬가지..

TIL - 20220727

오늘은 모던 JavaScript 튜토리얼에서 클래스 상속(https://ko.javascript.info/class-inheritance)에 대해 공부했다. 작성한 질문은 다음과 같다. 클래스를 다른 클래스로 확장하기 위한 개념을 클래스 상속이라고 말하며, extends 키워드를 통해 상속받을 수 있다. 공통적으로 사용하는 부모 클래스의 메서드 이외에 자식 클래스에 원하는 메서드를 특별하게 추가할 때, 사용하면 좋다. super 키워드는 부모 메서드 전체를 사용하지 않고 일부 기능만 변경하여 사용하거나 확장하고 싶을 때, 커스텀 메서드를 만들어 작업하면 되면서도 커스텀 메서드 과정 전, 후에 부모 메서드를 호출하고 싶을 때 사용하면 좋다. 부모 생성자 이외에 자식 클래스에 특별한 생성자를 추가하고 싶을 ..

TIL - 20220726

오늘은 모던 JavaScript 튜토리얼에서 클래스(https://ko.javascript.info/class)에 대해 공부했다. 작성한 질문은 다음과 같다. 동일한 종류의 객체를 여러 개 생성해야 하는 경우, new 연산자와 생성자 함수를 사용하는 방법과 class를 사용하는 방법이 있다. 클래스에서 객체의 기본 상태를 설정해주는 생성자 메서드는 constructor이다. 클래스의 type은 함수이다. class User {...} 문법 구조가 하는 일은 다음과 같다. User라는 이름의 함수를 생성한다. 함수 본문은 class의 생성자 메서드인 constructor에서 가져오며 constructor에 대한 내용이 없는 경우, 본문이 비워진 함수가 만들어진다. class내에서 정의한 메서드는 User...

TIL - 20220725

오늘은 모던 JavaScript 튜토리얼에서 프로토타입 메서드와 __proto__가 없는 객체(https://ko.javascript.info/prototype-methods)에 대해서 공부했다. 작성한 질문은 다음과 같다. __proto__를 사용하면 안 되는 이유는 먼저, 구식이며 사용자가 __proto__를 직접 만들 수 있게 허용하면, 내장 __proto__의 getter, setter 때문에 의도하지 않은 결과가 나올 수 있다. 그 대신 사용할 수 있는 메서드는 다음과 같다. Object.create(proto, [descriptors]): [[Prototype]]이 proto인 객체를 만든다. 참조 값은 null일 수 있고, 프로퍼티 설명자를 넘기는 것도 가능하다. Object.getProto..

TIL - 20220724

오늘은 모던 JavaScript 튜토리얼에서 내장 객체의 프로토타입(https://ko.javascript.info/native-prototypes)에 대해 공부했다. 작성한 질문은 다음과 같다. 빈 객체를 만들어 alert(obj)로 출력하면 "[object Object]"가 나오는 이유는 우선, toString 메서드에서 이 문자열을 생성한다. 객체 생성자 new Object와 객체 리터럴 {}은 같은 뜻이며 생성자 함수의 prototype이 toString을 비롯한 다양한 메서드가 구현되어 있는 대형 객체를 참조하여 "[object Object]" 값을 출력하게 되는 것이다. 배열 [1, 2, 3]을 만든다고 가정하면 new Array()의 디폴트 생성자가 내부에서 동작하여 Array.prototy..

TIL - 20220723

오늘은 모던 JavaScript 튜토리얼에서 함수의 prototype 프로퍼티에 대해 공부했다. 작성한 질문은 다음과 같다. 생성자 함수로 객체를 만든 경우와 리터럴 방식으로 객체를 만든 경우의 차이점은 생성자 함수의 프로토타입이 객체인 경우에 new 연산자를 이용하며 만든 객체는 생성자 함수의 프로토타입 정보를 이용해 [[Prototype]]을 설정한다는 것이다. "constructor"를 이야기할 때, 가장 중요한 점은 자바스크립트는 알맞은 "constructor"값을 보장하지 않는다는 점이다. 이번 챕터는 평소 리터럴만을 사용하여 객체를 만들었는데, 생성자 함수를 이용하여 객체를 만들었을 때 생성되는 [[Prototype]]에 대하여 알 수 있는 챕터였다. 다만, 예를 들어 생성자 함수 F의 프로토..

TIL - 20220722

오늘은 모던 JavaScript 튜토리얼에서 프로토타입 상속(https://ko.javascript.info/prototype-inheritance)에 대해서 공부했다. 작성한 질문은 다음과 같다. 자바스크립트에서 객체가 갖는 숨김 프로퍼티를 [[Prototype]]이라고 한다. 이전 변수의 유효 범위와 클로저에서 함수가 갖고 있는 숨김 프로퍼티는 [[Environment]]였는데, 객체도 함수처럼 숨김 프로퍼티를 갖고 있었던 것이었다. 숨김 프로퍼티가 다른 객체를 참조하는 경우 참조 대상을 '프로토타입'이라고 부른다. 객체에서 프로퍼티를 읽으려고 할 때, 해당 프로퍼티가 없으면 자동으로 프로토타입에 프로퍼티가 존재하는지 찾는다. 상속 프로퍼티란 프로토타입으로부터 물려받은 프로퍼티를 상속 프로퍼티라고 부..

TIL - 20220721

오늘은 모던 JavaScript 튜토리얼에서 프로퍼티 getter와 setter에 대해서 공부했다. 작성한 질문은 다음과 같다. 객체 프로퍼티에는 데이터 프로퍼티와 접근자 프로퍼티가 존재한다. 데이터 프로퍼티는 말 그대로 우리가 평상시 사용하는 프로퍼티가 이에 해당하며 접근자 프로퍼티는 본질은 함수이고, 함수는 값을 획득하고 설정하는 역할을 하듯이 접근자 프로퍼티도 그러한 역할을 한다. 자세한 이야기는 다음 질문으로 이어진다. 접근자 프로퍼티는 getter와 setter 메서드로 표현하며 getter는 get으로, setter는 set으로 나타낸다. 여기서 getter 메서드는 프로퍼티를 읽으려 할 때 실행하고, setter 메서드는 프로퍼티에 값을 할당하려 할 때 실행하는 역할이다. 데이터 프로퍼티의 ..