Basic JavaScript

해당 게시물은 모던 자바스크립트 Deep Dive 를 통해 이해한 내용을 정리한 글이다. 자세한 내용은 책을 참고하자.소스코드는 평가와 실행과정을 거친다.먼저 전역 실행 컨텍스트가 생성이 되고 전역변수 x와 전역함수 foo 가 전역 실행 컨텍스트에 등록된다. 그 이후에

이 내용의 핵심은 변수에 변수를 할당했을 때 무엇이 어떻게 전달되는가? 이다.score 는 메모리 어딘가에 (주소는 예시로 100) 80 이라는 값을 가진 상태로 저장이 된다. 그리고 copy 에 score 을 할당하면 변수의 값 즉, 80이 copy 에 할당되게 된다

문법적인 내용을 함께 설명하면 글이 길어져서 눈에 잘 들어올 거 같지 않아 실용적인 예시를 중심으로 정리하겠다.클래스를 정의하고 increase 메서드를 이용해서 counter 변수를 하나씩 늘려가보았다. 그러다가 10의 배수를 만나면 콘솔창에 출력을 해보았다.만일 1

자바스크립트 엔진은 프로퍼티를 생성할 때 프로퍼티의 상태를 나타내는 프로퍼티 어트리뷰트를 기본값으로 자동 정의한다.프로퍼티 어트리뷰트는 내부 슬롯이기때문에 직접 접근할 수는 없지만 메서드를 통해서 간접적으로 확인할 수 있다.해당 메서드를 통해 프로퍼티 어트리뷰트를 확인

클래스를 사용하면서 생성자 함수와 프로토타입이라는 개념에 관심을 덜 준 것 같다. 결국에 클래스의 내부 동작도 프로토타입으로 이루어져있기 때문에 꼭 알아야되는 개념이라고 생각하고 이번 기회에 제대로 정리를 해보고자 한다. 프로토타입 기반 상속 딥다이브 책에 나온 예

이벤트 위임을 활용해서 코드를 개선할 수 있다.현재 코드는 버튼을 클릭하거나 엔터키를 입력하면 아이템을 추가한다. 아이템을 추가하는 코드가 중복되어 사용되기 때문에 form 을 이용해서 개선할 수 있다.우선 HTML 코드에 form 태그를 추가하였다. form 태그를

참 난해해서 미루고 미뤘던 개념이였다. 이제야 제대로 각 잡고 깊게 공부한다.클로저는 함수와 그 함수가 선언된 렉시컬 환경과의 조합이다.클로저가 가능한 이유는 실행 컨텍스트는 제거되어도 렉시컬 환경은 남아있기 때문이다.클로저를 제대로 이해하기 위해선 용어 몇가지에 대해

흔히 비동기처리의 방법으로 콜백 패턴을 사용한다고 한다. 왜 콜백 패턴은 비동기처리의 방법으로 사용되었으며 이를 보안하기 위한 프로미스는 어떤 개념인지 정리해보자.비동기 함수라는 것은 함수 내부에 비동기로 동작하는 코드를 포함한다는 뜻이다. onload 이벤트 핸들러는

in 연산자는 객체가 속한 프로토타입 체인 상에 존재하는 모든 프로토타입에서 프로퍼티가 존재하는지 확인한다.위 코드에서 toString이 person객체의 프로퍼티라고 나오는 이유는 프로토타입 체인을 통해 Object.prototype인 toString을 검색했기 때문

만일 생성자함수를 통해 객체를 생성하려고 할 때 new키워드없이 생성자함수를 호출할 경우에는 어떻게 될까? 이것이 문제가 된다면 어떻게 오류를 잡아줄 수 있을까?생성자 함수가 등장한 배경은 객체 리터럴에 의한 객체 생성 방식의 문제점 때문이다. 객체 리터럴은 객체를 생

사용하면서도 왜 그렇게되는지 모르고 사용하는 부분이 등장했다. 예를 들어 서브 클래스 내부에서 constructor를 사용한다면 왜 super를 생략해서는 안되는지 등등. 다시 한번 그리고 제대로 클래스 내부 원리에 대해 공부하고 싶어서 정리한다.모든 내용을 다 정리할

이벤트 객체는 크게 두 종류로 나눌 수 있다.이벤트가 발생하면 암묵적으로 생성되는 이벤트 객체이벤트 생성자 함수를 호출하여 명시적으로 생성한 이벤트 객체 (의도적)전자의 경우에는 발생하는 이벤트의 종류에 따라 이벤트 타입이 결정된다.하지만 경우에 따라 JS에서 제공하는

해당 코드를 실행해보면 print함수의 실행은 getData의 promise가 resolve될 때까지 기다리지않는다.promise는 미래의 결과를 약속해주는 역할을 한다. getData는 그 결과가 반환될때까지 기다려주지않는다. 즉, 병렬처리가 되며 이것이 비동기처리를