본문으로 이동
메뉴 여닫기
환경 설정 메뉴 여닫기
개인 메뉴 여닫기
로그인하지 않음
지금 편집한다면 당신의 IP 주소가 공개될 수 있습니다.

자바스크립트(JavaScript, JS)는 웹 브라우저 안에서 웹 페이지의 내용과 동작을 바꾸기 위해 만들어진, 동적 타입의 인터프리터형 스크립트 언어이다.

1995년 넷스케이프의 브렌던 아이크(Brendan Eich)가 만들었다. 이름에 '자바'가 들어 있지만 자바와는 문법 일부만 닮았을 뿐 다른 언어다. 표준 규격 이름은 ECMAScript(ECMA-262)이고, 자바스크립트는 그 구현체를 가리키는 이름으로 굳었다.

웹 페이지는 세 가지가 역할을 나눠 만든다.

  • HTML — 문서의 구조와 내용
  • CSS — 글꼴·색·배치 같은 표현
  • 자바스크립트 — 사용자 입력에 반응하고 내용을 바꾸는 동작

자바스크립트는 브라우저가 문서를 객체 트리로 펼쳐 놓은 DOM을 읽고 고쳐서 화면을 바꾼다. 이렇게 페이지를 새로 받지 않고 화면을 바꾸는 기법을 묶어 DHTML이라 불렀고, 여기에 서버와의 비동기 통신을 더한 것이 Ajax다.

  • 인터프리터 방식 — 브라우저의 자바스크립트 엔진(V8, SpiderMonkey 등)이 소스를 받아 바로 실행한다. 지금의 엔진은 실행 중 기계어로 컴파일(JIT)해 속도를 낸다
  • 동적 타입 — 변수에 형을 선언하지 않고, 실행할 때 값에 따라 형이 정해진다
  • 객체 기반·프로토타입 상속 — 클래스 대신 다른 객체(프로토타입)를 이어받아 객체를 만든다. ES2015 부터 class 문법이 들어왔지만 내부는 프로토타입이다
  • 일급 함수 — 함수를 값처럼 변수에 담고 넘길 수 있다. 이벤트 처리에 콜백 함수를 많이 쓴다
  • 이벤트 기반·단일 스레드 — 클릭·입력·타이머 같은 이벤트가 생기면 등록한 함수를 실행한다. 오래 걸리는 일은 비동기(Promise, async/await)로 처리한다
  • HTML 문서 안에서는 <script> 요소로 넣거나 외부 .js 파일을 불러온다
  • 브라우저 쪽 화면 처리 — 입력값 검사, 메뉴·팝업, 화면 갱신
  • 서버 쪽 실행 — Node.js
  • 단일 페이지 애플리케이션 — SPA 프레임워크(React, Vue 등)

사용자 입력을 그대로 페이지에 넣으면 공격자가 심은 자바스크립트가 다른 사용자의 브라우저에서 실행된다. 이것이 크로스사이트 스크립트(XSS)다. 브라우저는 다른 출처의 문서에 스크립트가 접근하지 못하게 동일 출처 정책을 둔다.