이 글은 아래 링크의 내용을 바탕으로 작성되었습니다. https://www.youtube.com/watch?v=cCOL7MC4Pl0 이벤트 루프란? 자바스크립트의 단일 스레드 환경에 맞춰서 비동기 처리와 이벤트 핸들링을 수행하는데 사용되는 제어방식입니다. 간단히 설명하자면, 끊임없이 콜스택의 상태를 감지하며 태스크 큐의 콜백을 콜스택에 밀어넣는 방식입니다. 왜 자바스크립트는 단일스레드 방식을 택한 것일까? 이벤트 루프의 배경에는 흔히 자바스크립트가 '단일 스레드로만 동작한다'는 사실이 깔려 있습니다. 하지만 다른 언어들은 스레드를 나누는 일이 흔한데, 왜 하필 자바스크립트는 단일 스레드를 고집하는 것일까요? 이는 자바스크립트의 주요 실행 환경이 브라우저라는 점에 기반합니다. 이용자가 발생시킨 이벤트와 서..

이 글은 아래 영상의 내용을 바탕으로 작성되었습니다. https://www.youtube.com/watch?v=PFmuCDHHpwk 객체 지향 프로그래밍이란? 프로그램의 함수보다도 '객체'에 더 초점을 두는 프로그래밍 방식(패러다임)입니다. 일반적인 절차지향 프로그래밍은 엄청나게 많은 함수와 데이터들로 이루어져 있고 이 함수와 데이터들의 관계가 한눈에 알아보기 힘들 정도로 이리저리 꼬여 있는 경우가 많습니다. 어디서 무엇을 가져다 사용하는지가 분명하지 않은 상태이기 쉽고, 이를 '스파게티 코드'라고 부릅니다. 캡슐화 객체 지향 프로그래밍에서는 이를 막기 위해 관련 있는 데이터(변수)들과 함수들을 서로 묶습니다. 이 묶음을 '객체'라고 부릅니다. 함수는 메서드로, 변수는 속성으로 부릅니다. 이런 식의 묶음..

이 글은 아래 링크의 영상들의 내용을 기반으로 작성되었습니다. https://opentutorials.org/module/4047 New 연산자의 이해 자바스크립트에서 'new' 연산자의 구체적인 역할은 잘 모르는 사람이 많습니다. 저 또한 그러한 사람 중 한명이구요. 이번엔 그 구체적인 역할에 대해 알아봅시다. 우리는 함수를 실행했을 때, 해당 함수에서 return 하는 무엇인가가 출력됨을 알고 있을 것입니다. 하지만 위와 같은 Person 함수의 경우, return 하는게 아무 것도 없기 때문에 콘솔에는 undefined 가 찍힙니다. 그러나 똑같은 함수에 new 연산자를 쓰면, 신기하게도 객체가 하나 리턴된 것을 볼 수 있을 것입니다. new 연산자는 옆의 함수를 '생성자(constructor)'로..

[ Node.js ] Node.js 에서 쓰는 모듈화는 Common.js의 것이다. require('경로 or 패키지 이름') 로 불러오고 이를 변수나 상수로 담는다. 가져와야 할 파일 안에서는 module.exports = (somthing) 으로 require 를 실행했을 때 리턴되는 값이나 함수를 넣는다. [ ES6 ] 하지만 ES6 가 공개된 이후에는 모듈화를 자바스크립트에서 공식으로 지원한다. import 담을 변수 from '경로 or 패키지 이름' 으로 불러오고 export default (somthing) 으로 불러왔을 때 담길 리턴값을 설정할 수 있다. 다만 default 를 없애고 그냥 export를 쓰는 방법이 있다. 이 export는 여러번 지정할 수 있다. export (somet..

기존의 function () {} 과는 달리, 화살표 이름에는 함수 이름, this, arguments 가 없습니다. 함수 이름이 없다는 것은 화살표 함수는 익명 함수로만 동작한다는 뜻일 뿐입니다. 기존의 함수에서는 this라는 변수 이름으로 함수 스코프 안에서 자기 자신에 접근할 수 있는 방법이 제공되었습니다. 하지만 화살표 함수에서는 이게 없기 때문에, 스코프의 원칙 상, 상위 스코프에서 this 라는 변수명을 찾아보게 되고, 그러면 결국 상위 함수의 this나 전역 객체인 window 를 화살표 함수 안에서 불러오게 되는 것입니다. bind를 써도, apply, call을 써도 this를 주입할 수가 없습니다. 따라서 화살표 함수로는 new 키워드를 쓸 수 없습니다. 또한 기존의 function 에..

대부분의 경우, this 의 값은 함수를 호출하는 방법에 의해 결정된다. 자바스크립트에서는 선언할 때 결정되는 것이 있고, 호출할 때 결정되는 것이 있는데, 선언할 때 결정되는 것은 '클로저'이고, 호출할 때 결정되는 것이 이 'this'이다. 이렇게 this가 맥락에 따라 달라질 수 있으므로, 호출되는 방법과 무관하게 this의 값을 정해버릴 수가 있는 것이 bind 메서드이다. (예제 코드) 결국 '어디서' 해당 this를 호출하는 함수를 실행했느냐가 중요해진다. whoAmI 메서드는 someone에서 실행하였고, myWhoAmI 는 전역에서 실행하였다. 그리고, 자바스크립트에서, 전역은 결국 window 객체 안이기에, 여기서 실행되는 함수들은 window 객체의 속성으로서, 간주된다. 따라서 so..