Subscribe

Minkyung Lee

📍 Berlin

var vs. let vs. const

JavaScript provides in total three keywords—var, let, const —to be able to declare variables. This post covers difference between three keywords in detail. Cheat Sheet var let const scope global scope/ function scope block scope block scope beginning of a ... statement declaration declaration declaration w/o value initialization 🟢 (default

JavaScript Memory Model - Primitive Data Type vs. Reference Data Type, Immutable, Constant, Variable

Preliminary Concepts Bits and Bytes Bit is the smallest unit an information can be stored in computer. Computer can signify different data via increase or decrease of electric pressure. Representing electric pressure under or above certain voltage, a bit can represent two data; 0 and 1. Though 1 and 0

JavaScript this

this is not unique to JavaScript. In other languages however, this always point sat instance of a class. On the other hand, in JavaScript, this is determined as execution context is created(🔗 Execution Context). Most of the execution context, with one exception of global execution context, is created on function

Closure

Closure is not a part of JavaScript specification that is defined by ECMAScript. It is rather a phenomenon common to programming languages that have characteristics of functional programming. Therefore, definitions of Closure vary. After consulting various resources that explain what Closure is in their own terms, I've summed

Execution Context

Many characteristic behaviors of JavaScript such as Hosting and this binding(🔗 JavaScript this) are caused by the fact that JavaScript engine executes code in order by creating and removing what is called "Execution Context". Understanding what execution context is helps better understanding how core concepts of JavaScripts are

❌ if-else-return → 🟢 if-return-return

어느 순간부터 조건문을 쓸 때 주절(main clause)에 해당하는 케이스인지를 먼저 체크하는 것이 아니라 async function onSubmitForm () { if (isValidForm) { const formattedForm = formatForm() await submitForm(formatForm()) } else { showErrorMsg() } } 예외절에 해당하는지를 먼저 체크하기 시작했다. async function onSubmitForm () { if (!isValidForm) return showErrorMsg() const formattedForm = formatForm() await submitForm(formatForm()) } 뿐만 아니라 if 와

Web Vitals - Performance (1)

약 1년 전에 미디어 전시 프로젝트 "모던 그로테스크 타임즈(Modern Grotesque Times)"에 웹 개발자로 참여한 적이 있었다(🔗 Modern Grotesque Times 🔗 GitHub). 전시 기획자나 나에게나 뜻깊은 프로젝트였는데, 기획자는 매번 다른 기획자를 보조하기만 하다가 처음으로 단독으로 꾸린 전시였고 나로서는 세팅부터 개발, 배포까지 모두 한 첫 프로젝트였기때문이다. 기한에 맞춰 순조롭게

Browser Animation - setInterval vs. requestAnimationFrame

🚧 Coming Soon...

JavaScript Runtime - Event Loop, Callback Queue

앞선 JavaScript Runtime 포스팅에서는 JavaScript 런타임의 구조를 다음과 같이 이해했다(Figure1). 이번 포스트에서는 event loop와 callback queue를 중심으로 보다 구조를 세분화해서 살펴보도록하자. 이벤트 루프와 의 세부적인 구조를 가장 잘 시각화한 자료가 있어 소개한다(Figure2). 각각의 약어들이 의미하는 바는 다음과 같다: * T (Task) * rAF(`requestAnimationFrame`) * S (Style Computation) * L (Layout) * P

JavaScript Runtime

런타임이란 프로그래밍 언어가 구동되는 환경이다. 환경은 프로그램의 일종으로서 런타임이란 '프로그래밍 언어가 동작할 수 있는 프로그램'을 의미한다. 우리가 작성한 자바스크립트 코드가 우리가 원하는 동작을 하려면 코드가 실행되어야한다. 자바스크립트를 이해하기 위해서 자바스크립트 런타임에 대한 이해는 필수적이다. 대표적으로 자바스크립트 코드를 실행할 수 있는 런타임에는 브라우저가 있다. 브라우저 자바스크립트 런타임을 도식화하면