JavaScript

Any application that can be written in JavaScript, will eventually be written in JavaScript.

— 제프 아트우드 (Jeff Atwood), 아트우드의 법칙(Atwood's Law)

웹 브라우저의 황태자이자, 단 10일 만에 태어나 전 세계 IT 생태계를 뒤흔든 악마의 재능. ~~그리고 [] + []가 ""이 되고, [] + {}가 "[object Object]"가 되는 기적의 수학을 자랑하는 언어~~

1. 개요

JavaScript는 웹 브라우저 내에서 동적인 웹페이지를 구현하기 위해 개발된 프로그래밍 언어이다. 넷스케이프(Netscape)의 브렌던 아이크(Brendan Eich)가 단 10일 만에 설계한 것으로 유명하며, 처음에는 단순한 스크립트 언어로 출발했으나 현재는 프론트엔드뿐만 아니라 백엔드(Node.js), 앱 개발(React Native), 심지어 AI 개발 분야까지 진출해 사실상 현대 IT 생태계를 지배하고 있는 핵심 언어 중 하나이다.

이름에 'Java'가 들어가서 흔히 Java와 혈연관계가 있는 것으로 오해받지만, 인도와 인도네시아만큼이나 아무런 관련이 없다.¹ 당시 대세였던 Java의 유명세에 숟가락을 얹기 위해 마케팅적인 이유로 이름을 붙인 것일 뿐이다.

2. 주요 특징

2.1. 싱글 스레드와 이벤트 루프

JavaScript는 기본적으로 싱글 스레드(Single Thread)로 동작한다. 즉, 한 번에 하나의 작업만 처리할 수 있다.

"싱글 스레드인데 어떻게 버벅이지 않고 유튜브 비디오를 틀면서 댓글을 달 수 있죠?"

그 비결은 바로 이벤트 루프(Event Loop)와 비동기 I/O에 있다. 실제 무거운 작업(네트워크 요청, 타이머 등)은 브라우저의 Web API나 Node.js의 background(libuv)로 던져버리고, 메인 스레드는 콜백 큐(Callback Queue)에 쌓인 작업들을 쉴 새 없이 처리하는 방식으로 멀티 스레드처럼 보이게 만든다. 만약 어떤 개발자가 메인 스레드에서 무한 루프를 돌리거나 너무 무거운 동기 연산을 수행하면, 웹 페이지가 통째로 굳어버리는 '응답 없음' 사태를 목격하게 된다.

2.2. 프로토타입 기반 객체 지향

C++이나 Java처럼 클래스를 정의하고 이를 통해 객체를 생성하는 일반적인 클래스 기반 언어와 달리, JavaScript는 프로토타입(Prototype)이라는 특이한 메커니즘을 사용해 객체 지향을 구현한다. 모든 객체는 자신을 만들어낸 원형(Prototype) 객체에 대한 링크를 가지고 있으며, 이를 통해 상속을 구현한다. ES6부터 class 키워드가 도입되었으나, 이는 어디까지나 기존 프로토타입 기반 코드를 다른 언어 개발자들이 보기 좋게 포장한 문법적 설탕(Syntactic Sugar)에 불과하다. 속은 여전히 프로토타입으로 굴러가기 때문에 동작 원리를 제대로 이해하지 못하면 기묘한 버그에 고통받게 된다.

2.3. 동적 타이핑

변수를 선언할 때 타입을 미리 지정하지 않으며, 런타임에 대입되는 값에 따라 타입이 결정되는 동적 타이핑(Dynamic Typing) 언어이다. 코드를 빠르게 작성할 수 있다는 장점이 있지만, 규모가 커지면 자신이 선언한 변수에 지금 숫자가 들어있는지, 문자열이 들어있는지, 아니면 undefined가 들어있는지 스스로도 모르는 지경에 이른다. 결국 이 끔찍한 타입 불안증을 견디다 못한 개발자들은 대안으로 TypeScript를 만들어 사용하게 된다.

3. 관련 밈 및 드립

3.1. 기묘한 형변환과 바나나(baNaNa)

JavaScript는 타입 체크에 매우 관대하여, 서로 다른 타입끼리 연산을 시도하면 엔진이 알아서 타입을 적절히(?) 뭉개서 연산해 준다. 이 과정에서 상식을 초월하는 결과들이 쏟아져 나온다.

바나나(baNaNa) 드립 콘솔에 아래의 코드를 입력하면 놀랍게도 문자열 "banana"가 출력된다.
```
('b' + 'a' + + 'a' + 'a').toLowerCase() // "banana"
```
이유는 'a' + + 'a' 부분에서 뒤의 + 'a'가 문자열 'a'를 숫자로 변환하려다 실패하여 NaN이 되고, 이것이 앞뒤 문자열과 결합하면서 baNaNa가 된 후 소문자로 변환되었기 때문이다.
기적의 연산법 동적 형변환의 혼돈을 보여주는 대표적인 예시들이다.
```
[] + []      // "" (빈 문자열)
[] + {}      // "[object Object]"
{} + []      // 0 (또는 "[object Object]")
true + true  // 2
(![] + [])[+[]] // "f"
```
이로 인해 ==(느슨한 비교) 대신 ===(엄격한 비교)를 쓰는 것이 국룰을 넘어 생존을 위한 필수 사항이 되었다.

3.2. JavaScript의 자식들 (TypeScript, JS Fatigue)

매일같이 쏟아져 나오는 신규 프레임워크와 도구들 때문에 개발자들이 피로감을 호소하는 현상을 JS Fatigue(자바스크립트 피로증)라 부른다.

"정신을 차려보니 Webpack을 버리고 Vite를 쓰고 있고, React 위에 Next.js를 얹고, 그 위에 Tailwind를 바르고, 다시 TypeScript로 감싸서 배포하고 있습니다. 제발 그만해..."

4. 여담

10일의 기적: 브렌던 아이크가 넷스케이프 내비게이터 브라우저에 탑재할 언어로 Mocha(이후 LiveScript를 거쳐 JavaScript로 개명)를 개발할 때 걸린 시간은 단 10일이었다. 이 때문에 언어 곳곳에 설계 결함에 가까운 기묘한 특징들이 남게 되었고, 전 세계 수천만 명의 개발자가 그 10일의 대가를 수십 년째 야근으로 치르고 있다.
ECMAScript: JavaScript가 브라우저 전쟁 과정에서 중구난방으로 파편화되자, 이를 표준화하기 위해 만든 규격이 바로 ECMAScript(ES)이다. 우리가 흔히 말하는 ES6(ES2015)가 현대적인 JavaScript의 대격변을 이끈 버전이다.
Brendan Eich의 행보: 브렌던 아이크는 이후 모질라 재단을 창립하고 파이어폭스 개발을 이끌었으나, 현재는 개인 정보 보호 중심 브라우저인 Brave의 CEO로 재직 중이며 베이직 어텐션 토큰(BAT)을 발행하기도 했다.

5. 관련 문서

실제로 넷스케이프와 썬 마이크로시스템즈가 제휴를 맺으며 자바의 인기에 편승하려 기획한 작명이다. 이로 인해 오늘날까지도 컴퓨터를 모르는 일반인들은 Java와 JavaScript를 같은 언어로 생각하는 비극이 지속되고 있다. ↩