자바스크립트란?
웹 페이지에 생동감을 불어넣기위해 만들어진 프로그래밍 언어이다.
스크립트(Script)
자바스크립트로 작성한 프로그램을 뜻한다. 웹페이지의 HTML 안에 작성하고, 웹페이지를 불러올 때 자동으로 실행된다.
자바스크립트만의 강점 세 가지
- HTML / CSS와 완전히 통합할 수 있다.
- 간단한 일을 간단하게 처리할 수 있게 한다.
- 모든 주요 브라우저에서 지원하고, 기본 언어로 사용된다.
자바스크립트 실행환경
자바스크립트 엔진이 들어 있는 모든 디바이스에서 동작가능하다. 기본적으로 자바스크립트 가상 머신이라는 엔진이 내장된 브라우저뿐만아니라 서버에서 실행할 수도 있다.
자바스크립트 엔진의 종류
- V8 : Chrome, Opera
- SpiderMonky : Firefox
- Trident, Chakra : IE
- ChakraCore : Edge
- SquirrelFish : Safari
자바스크립트 엔진의 간단한 기본 동작 원리
- 파싱 : 자바스크립트 엔진이 스크립트를 읽는다.
- 컴파일 : 읽은 스크립트를 기계어로 전환한다.
- 실행 : 기계어로 전환된 코드가 실행된다.
자바스크립트 엔진은 위의 각 단계마다 최적화를 진행한다. 심지어 컴파일이 끝나고 실행중인 코드를 감시하면서 이 코드로 흘러가는 데이터를 분석하고, 분석 결과를 토대로 기계어로 전환된 코드를 다시 최적화하기도 한다. 이런 과정을 거치면 스크립트 실행 속도가 더 빨라진다.
브라우저에서 자바스크립트로 할 수 있는 일
- 웹페이지에 새로운 HTML을 추가하거나, 기존 HTML이나 스타일을 수정
- 마우스 클릭, 포인터의 움직임, 키보드 눌림 등 사용자의 행동(이벤트)에 반응
- 네트워크를 통해 원격 서버에 요청을 보내거나, 파일 다운로드, 업로드하기 (AJAX, COMET 등 사용)
- 쿠키 설정, 사용자에게 질문을 건네거나 메시지 보여주기
- 클라이언트측에 데이터 저장하기(로컬 스토리지)
모던 자바스크립트는 기본적으로 브라우저를 대상으로 만든 언어이기 때문에, 메모리나 CPU 같은 로우레벨의 조작이나, 운영체제가 지원하는 기능을 허용하지 않기 때문에 안전하다.
자바스크립트의 능력은 실행 환경에 상당한 영향을 받는다. 예를들어, Node.js 환경에선 임의의 파일을 읽거나 쓰고, 네트워크 요청을 수행하는 함수를 지원한다. 브라우저 환경에선 웹페이지 조작, 클라이언트와 서버의 상호작용에 관한 모든 일을 할 수 있다.
브라우저에서 자바스크립트로 할 수 없는 일
- 웹페이지 내 스크립트는 디스크에 저장된 임의의 파일을 읽거나 쓰고, 복사하거나 실행할 때 제약을 받을 수 있음. 단, 사용자가 브라우저 창에 파일을 끌어다 두거나,
<input>태그를 통해 파일을 선택할 때와 같이 특정 상황에서는 파일 접근을 허용함.- 카메라나 마이크 같은 디바이스와 상호 작용하려면 사용자의 명시적인 허가가 있어야 함.
- 브라우저 내의 탭과 창은 대개 서로의 정보를 알 수 없음. 단, 자바스크립트를 사용해 한 창에서 다른 창을 열 때는 예외가 적용됨. 하지만 이 경우에도 도메인이나 프로토콜, 포트가 다르다면 페이지에 접근할 수 없음. 이런 제약사항을 동일 출처 정책(Same Origin Policy)이라 부름. 이 정책을 피하기 위해서 두 페이지는 데이터 교환에 동의해야 하고, 동의와 관련된 특수한 자바스크립트 코드를 포함하고 있어야 함.
- 자바스크립트를 이용하면 페이지를 생성한 서버와 쉽게 정보를 주고 받을 수 있음. 하지만 타 사이트나 도메인에서 데이터를 받아오는 것은 불가능함. 가능하다 해도 원격 서버에서 HTTP 헤더 등을 이용하여 명확히 승인을 해줘야 함.
브라우저는 보안을 위해 자바스크립트의 기능에 제약을 걸어놓는다. 이런 제약은 악성 웹페이지가 개인 정보에 접근하거나 사용자의 데이터를 손상시키는 것을 막기 위해 만들어졌다.
단, 브라우저 환경 밖, 예를 들어 서버라면 이러한 제약은 존재하지 않는다. 또, 모던 브라우저에선 추가 권한 허가를 요청하는 플러그인이나 익스텐션 설치가 허용된다.
자바스크립트 이외의 언어들
근래엔 브라우저에서 실행 되기전에 자바스크립트로 트랜스파일(transpile)할 수 있는 새로운 언어들이 많이 등장했다.
최신 툴들은 자바스크립트 이외의 언어로 작성한 코드를 자바스크립트로 자동 변환해준다.
자바스크립트로 트랜스파일이 가능한 언어 종류
CoffeScript: 간단한 문법을 도입하여 명료하고 이해하기 쉬운 코드 작성할 수 있는 언어TypeScript: 자료형을 강제로 명시하여 개발을 단순화하고, 복잡한 시스템을 지원하려는 목적으로 만들어진 언어Flow: 자료형을 강제한다. Typescript와는 다른 방식을 사용하는 언어Dart: 모바일 앱과 같이 브라우저가 아닌 환경에서 동작하는 고유의 엔진을 가진 독자적인 언어
이외에도 다양한 언어들이 존재한다.
자바스크립트 명세서
ECMA-262 명세서
- 자바스크립트를 정의하는 공식 문서로 매년 새로운 버전이 나온다.
- https://www.ecma-international.org/publications-and-standards/standards/ecma-262/
자바스크립트 매뉴얼
MDN Javascript Reference
- 자바스크립트에 관한 다양한 예제와 정보가 있는 매뉴얼
- https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference
자바스크립트 호환성 표
- 특정 브라우저나 엔진이 내가 사용하려는 기능을 지원하는지 확인할 수 있다.
- http://caniuse.com
참고문헌
