Javascript란 무엇인가?

HTML, CSS를 공부하고 나면 그 뒤로 따라 오는 언어가 바로 자바스크립트일 텐데요. 알고 나면 후련한데, 이 문턱을 넘기가 참 어렵더라구요. 정리 시작합니다.

정의

Javascript는 넷스케이프에서 처음 만든 언어로, HTML과 CSS만으로는 정적(static)인 웹 페이지에 동적(dynamic)인 요소를 부여한 언어입니다. 처음 출시 당시 이름은 모카(Mocah)였으며, 이후 라이브스크립트(LiveScript)로 변경되었다가 최종적으로 현재의 자바스크립트(Javascript)가 되었습니다.

자바스크립트와 함께 거론되는 언어로 자바(Java)가 있습니다. 두 언어의 기원은 모두 C언어로 같습니다. 그래서 모든 문장 끝에는 ";"를 기입합니다. 하지만, 이외에 자바스크립트와 자바는 관련성이 없습니다. 자바스크립트라는 이름의 최종 선정 간 이 같은 혼란이 야기되었는데, 이는 마케팅적으로 넷스케이프가 당시 인기있는 웹 프로그래밍 언어로서 자바스크립트를 내밀기 위한 전략이었다고 합니다.

 

특징

객체 지향 프로그래밍 언어(OOP, Object-Oriented Programming)이다. 객체(Object)의 개념은 처음 접하는 사람이라면 잘 이해가 가지 않을 수 있습니다. 필자도 그랬습니다. Java를 배우면서 처음 접했는데, 도통 이해가 안가더군요. Javascript를 공부하면서 다시 곱씹어 보았습니다. 생각보다 그 개념은 간단했습니다. 객체는 우리가 알고 있는 폴더와 비슷합니다. C언어나 C++언어를 접하신 분이라면 구조체(Struct)라는 개념에 대해 알고 계실 겁니다. 구조체는 변수들의 폴더이죠. 회원명, 회원ID, 회원번호, 휴대폰번호, 주소처럼 공통적으로 사용되는 변수를 한 번에 선언하여 변수의 중복 선언을 줄였습니다. 그런데, 여기서 개발자들은 이런 생각을 합니다. 변수말고 함수도 한 곳에 모아다가 재사용할 수는 없을까? 그래서 등장한 것이 객체입니다. 객체는 변수말고도 함수도 담을 수 있는 폴더입니다. 

객체에 포함되지 않은 변수, 함수와 객체에 포함된 변수, 함수를 똑같이 변수, 함수로 부른다면 구분이 안가서 일처리가 힘들겠지요? 그래서 객체에 포함된 변수는 프로퍼티(property), 함수는 메서드(method)로 부릅니다. 예전에는 HTML에 동적인 요소만 추가해줬다면, 현재는 Node.js 라 하여 서버측 언어로도 활용되고 있으니 참고하시면 좋겠습니다.

다른 언어들처럼 데이터 타입, 비교 연산자, 조건문, 배열, 반복문이 존재하며 자세한 문법은 W3Scools/Javascript를 참고하시면 좋습니다. 그래도 감이 안온다면 모던 자바스크립트 튜토리얼을 보시면 좋습니다.

 

변수 선언

var(Variable)

- 변할 수 있는 수

- function scope

 

let

- 변할 수 있는 수

- block scope

- 예전에는 var를 사용했지만, 현재는 var보다는 let을 많이 사용한다.

 

const(Constant)

- 변하지 않는 수

- block scope

 

호이스팅(hoisting)

인터프리터가 변수와 함수 메모리 공간을 미리 할당하는 것을 말합니다. var로 선언한 변수의 경우 호이스팅 시 undefined 변수를 초기화하지만, let와 const로 선언한 변수의 경우 호이스팅 시 변수를 초기화하지 않습니다. 자바스크립트는 함수의 코드를 실행하기 전에 함수 선언에 대한 메모리부터 할당하기 때문에, 함수를 호출하는 코드를 함수 선언보다 앞에 배치할 수 있습니다. 이는 C언어에서 함수 선언과 정의를 따로하는 특징이 남아있는 것으로 보입니다.

 

선언 방법

1. <script>...</script>

- <script> 태그 안에 객체를 선언한다.

2. <script src="./sample.js></script>

- 확장자가 .js인 파일을 따로 생성하여 <script>의 src 속성으로 삽입한다.

 

참고 문헌

- 위키 백과, 자바스크립트

- 위키 백과, 객체 지향 프로그래밍