자바스크립트 스터디 1 : 자바스크립트 개요와 개발 환경

자바스크립트 개요

자바스크립트?

웹 브라우저에서 동작하는 스크립트 언어. 초창기 자바스크립트는 웹 페이지의 보조적 기능을 수행하기 위한 용도로 사용했으나, 현재는 서버에서 담당하던 역할들이 상당 부분 웹 브라우저로 이동하면서 자바스크립트의 중요성이 대두되었음.

자바스크립트 활용 범위

웹 개발

동적인 웹 애플리케이션을 위해서는 빠질 수 없는 중요한 요소!

서버 개발

Node.js의 출현으로 자바스크립트로 백엔드 서버 개발이 가능함.

애플리케이션 개발

폰갭(PhoneGap)과 같은 크로스 플랫폼 개발 도구를 이용하여 모바일 애플리케이션 개발에도 활용할 수 있음.

거기에 더해 오픈소스 프레임워크인 일렉트론(Electron)을 사용하여 데스크탑 GUI 애플리케이션마저 가능!

자바스크립트 핵심 개념

객체

자바스크립트의 거의 모든 것은 객체임.

함수

자바스크립트의 함수도 객체. 그냥 객체가 아니고, 무려 일급 객체(first-class citizens).

프로토타입

자바스크립트의 모든 객체는 숨겨진 링크인 프로토타입을 가짐. 이 링크는 해당 객체를 생성한 생성자의 프로토타입 객체를 가리킴.

실행 컨텍스트와 클로저

자바스크립트는 자신만의 독특한 과정으로 실행 컨텍스트를 만들고 그 안에서 실행이 이루어짐. 실행 컨텍스트는 자신만의 유효 범위, 스코프를 갖는데 이 과정에서 클로저를 구현할 수 있음.

자바스크립트와 객체지향 프로그래밍

자바스크립트는 클래스를 지원하지 않지만(ES5 기준) 객체지향 프로그래밍이 가능함. 프로토타입 체인과 클로저로 객체지향 프로그래밍의 상속, 캡슐화, 정보 은닉 등의 개념을 소화할 수 있음.

자바스크립트와 함수형 프로그래밍

자바스크립트는 함수형 프로그래밍이 가능함. 함수형 프로그래밍은 높은 수준의 모듈화를 가능하게 하는 매우 효율적인 프로그래밍 방법.

자바스크립트의 단점

굉장히 유연하다는 특성 때문에 종종 디버깅에 어려움을 겪기도 함. 특히 느슨한 타입 체크는 자유를 줌과 동시에 컴파일 타임에서 잡지 못하는 오류가 고스란히 런타임 오류로 발견되게 함.

전역 객체의 존재로 인해 이름 충돌의 위험성이 있음.

예전에는 모호한 언어 명세로 인해 논란이 많았음.


자바스크립트 개발 환경

책에서는 Jetbrains의 자바스크립트 IDE인 WebStorm을 기반으로 설명하나, IntelliJ로도 동일한 기능에 대한 설정이 가능함.

IDE 설치는 과감하게 생략.

테스트 및 디버깅

책에서는 웹 브라우저 중 파이어폭스를 기반으로 설명하나, 파이어폭스에 비해 상대적으로 인지도가 높은 크롬을 기반으로 설정.

  1. 크롬 확장 프로그램 중 ‘Jetbrains IDE Support’를 설치.
  2. Intellij를 실행하여 프로젝트를 열고 Run > Edit Configurations 선택.
  3. 좌측 상단의 ‘+’ 버튼을 누르고 ‘Javascript Debug’를 선택.
  4. URL 입력 우측에 위치한 ‘…’ 버튼을 클릭하여 테스트 및 디버깅할 파일을 선택.
  5. Browser는 크롬(Chrome)을 선택.
  6. Apply 버튼 클릭 후 OK 버튼 클릭.
  7. 저장된 Run Config 선택 후 실행하거나, 브레이크 포인트를 걸고 디버깅할 수 있음.