📝 MDN 공식 문서 읽고 공부하기 Day 1 – JavaScript Introduction
들어가며
웹을 공부할 때 누구나 처음 현피 뜨게되는 놈이 있다. 바로 JavaScript다.
HTML이 문서의 구조를 잡고, CSS가 시각적인 표현을 맡는다면, JavaScript는 그 위에 동적인 행동을 입힌다. 사용자가 버튼을 클릭하면 반응을 주고, 폼 입력을 확인하며, 애니메이션과 팝업을 가능하게 한다.
정적인 웹을 “읽는 대상”에서, 동적인 웹을 “대화하는 대상”으로 바꿔주는 언어, 그것이 JavaScript다.
JavaScript의 정의와 역할
JavaScript는 크로스 플랫폼, 객체 지향 스크립트 언어다.
브라우저 안에서는 DOM(Document Object Model)을 제어해 화면을 바꾸고, 사용자의 입력 이벤트에 반응한다. 예를 들어, 텍스트를 입력하면 자동으로 검증하거나, 버튼 클릭에 맞춰 화면 구성을 바꿀 수 있다.
반면 서버 환경에서는 Node.js 같은 런타임을 통해 전혀 다른 영역을 담당한다. 데이터베이스 질의, 파일 입출력, 여러 사용자 간의 실시간 연결 등 브라우저만으로는 불가능한 작업들을 처리한다.
즉, JavaScript는 하나의 언어지만 실행되는 환경에 따라 역할과 성격이 달라지는 유연한 도구라고 볼 수 있다.
Java와의 차이
JavaScript라는 이름 때문에 가장 흔히 생기는 오해는 “Java와 같은 계열의 언어일 것”이라는 생각이다. 실제로는 전혀 다른 철학을 가진 언어다.
- JavaScript는 동적 타이핑 언어다. 변수를 선언할 때 타입을 지정하지 않고, 실행 과정에서 자유롭게 값이 바뀔 수 있다. 또한 프로토타입 기반 객체 모델을 사용해 객체에 속성과 메서드를 실행 중에도 추가할 수 있다.
- Java는 정적 타이핑 언어다. 변수 타입을 반드시 선언해야 하며, 클래스 기반의 객체 모델을 사용한다. 모든 프로그램이 클래스 단위로 구성되고, 상속 관계 역시 클래스 계층 구조를 따라야 한다.
즉, JavaScript는 상대적으로 유연하고 즉흥적인 접근이 가능하고, Java는 안정성과 예측 가능성을 확보하는 대신 진입 장벽이 더 높다.
흥미로운 사실은, 원래 JavaScript의 이름은 LiveScript였다는 점이다. 하지만 1990년대 당시 Java의 인기가 높았던 탓에 마케팅 차원에서 이름을 JavaScript로 바꿨다. 이름은 비슷하지만 실체는 전혀 다른 길을 걷는 언어인 셈이다.
ECMAScript 표준화
JavaScript는 여러 회사와 브라우저에서 구현되며 발전해 왔다. 이 과정에서 서로 다른 동작이나 문법 차이가 발생할 수 있었는데, 이를 정리한 국제 표준이 바로 ECMAScript다.
ECMAScript는 ECMA-262 사양으로 문서화되어 있다.
- ECMAScript는 언어의 핵심 문법과 동작을 정의한다.
- JavaScript는 그 사양을 구현한 실제 언어다.
이때 DOM 같은 웹 API는 ECMAScript 사양에 포함되지 않는다. DOM은 W3C나 WHATWG가 별도로 관리한다. 따라서 브라우저 환경에서의 JavaScript는 ECMAScript + DOM API라는 조합으로 이해할 수 있다.
시작하는 방법
JavaScript를 배우기 위해 특별한 개발 환경이 필요한 것은 아니다. 최신 브라우저 하나만 있으면 된다.
모든 주요 브라우저(크롬, 파이어폭스, 사파리, 엣지 등)에는 개발자 도구 콘솔이 내장되어 있다. 여기서 JavaScript 코드를 직접 입력하고 실행해볼 수 있다.
콘솔은 일종의 실험실이다.
- 한 줄 입력하고 Enter를 치면 즉시 실행된다.
- 여러 줄을 입력하고 싶다면
Shift + Enter로 줄바꿈을 넣을 수 있다. - 파이어폭스는 멀티라인 입력 모드까지 지원한다.
문서에서 제시하는 예제는 다음과 같다:
(function () {
"use strict";
function greetMe(yourName) {
alert(`Hello ${yourName}`);
}
greetMe("World");
})();
이 코드를 콘솔에 붙여넣으면 “Hello World” 팝업이 뜬다.
별도의 설정이나 설치 과정 없이 브라우저만 있으면 바로 실행할 수 있다는 점은 JavaScript의 큰 장점이다.
정리
- JavaScript는 웹의 동적인 기능을 담당하는 언어다.
- 클라이언트와 서버 양쪽에서 활용할 수 있으며, 환경에 따라 역할이 달라진다.
- Java와 이름은 비슷하지만 철학은 전혀 다르다.
- ECMAScript는 JavaScript의 표준 설계도 역할을 한다.
- 브라우저 콘솔만으로도 쉽게 시작할 수 있어 접근성이 높다.
