자바스크립트의 역사
자바스크립트는(JavaScript)는 1995년에 넷스케이프사에서 "Brendan Eich"라는 프로그래머를 통해 웹페이지에 동적인 기능을 추가하기 위한 스크립트 언어로서 처음 등장하였습니다. 처음에는 LiveScript라는 언어로 소개되었지만 당시에 유행하던 Java의 인기에 편승하고자 이름을 Javascript로 변경하였습니다.
1996년 마이크로소프트사의 자사에서 웹브라우저-Internet Explorer-를 출시할때 자바스크립트를 탑재하여 출시하면서 웹 브라우저의 표준 스크립트 언어로 자리 잡게 되었습니다.
2000년대 초반, AJAX(Asynchronous JavaScript And XML - 웹페이지에서 동적으로 데이터를 로드하거나 전송하는 기술) 기술이 개발되면서 자바스크립트를 통해 웹 페이지의 동적인 변화가 가능하게 되었으며, 비동기 통신이 가능하게 되었습니다.
2010년대, 자바스크립트는 Node.js라는 서버 측 자바스크립트 프레임워크도 등장하여 프론트엔드 영역 뿐만이 아닌 백엔드도 모두 자바스크립트를 통해 구성할 수 있게 되었습니다.
현재에 이르러서는, Angular, React, Vue.js와 같은 프론트엔드 프레임워크와 Express.js, Nest,js, Node.js와 같은 많은 백엔드 프레임워크가 탄생하며, 전 세계적으로 많이 각광 받고 웹개발에서 필수적인 언어가 되었습니다.
자바스크립트 언어의 특징
자바스크립트에는 여러 가지 특징을 가지고 있지만 그 중에서도 가장 대표적인 5가지 특징은 아래와 같습니다.
1. 객체 지향 프로그래밍 지원
2. 동적 타이핑
3. 함수형 프로그래밍 지원
4. 비동기 처리
5. 클라이언트 측 및 서버 측 모두에서 사용 가능
1. 객체 지향 프로그래밍
객체 지향 프로그래밍이란 말을 하기 전에 먼저 절차 지향 프로그래밍 방식에 대해 이야기드리겠습니다.
절차 지향 프로그래밍이란 순차적인 처리가 중요시 되며 프로그램 전체가 유기적으로 연결되도록 만드는 프로그래밍 기법입니다. 이 방식은 컴퓨터의 작업 처리 방식과 유사하기 떄문에 객체 지향 언어를 사용하는 것에 실행 속도 측면에서 유리하지만, 실행 순서가 정해져 있어 코드의 순서가 바뀌면 동일한 결과를 보장하기 어렵다는 단점이 있습니다. 따라서 유지보수나 디버깅 측면에서 객체 지향 프로그래밍 방식에 비해 어려운 점이 있습니다.
과거에는 한정된 하드웨어를 효율적으로 사용하기 위해 이러한 절차 지향 프로그래밍 방식을 많이 사용하였지만, 하드웨어의 빠른 발전으로 리소스를 많이 잡아먹는 것이 더이상 단점이 아니게 되었습니다. 이러한 배경으로 탄생한 프로그래밍 방식이 객체 지향 프로그래밍입니다. 객체 지향 프로그래밍이란 실제 세계를 모델링하여 소프트웨어를 개발하는 방식입니다. 이는 마치 자동차 부품(바퀴, 프레임, 핸들, 유리 등)을 하나하나 조립하여 자동차라는 하나의 물건을 만드는 것처럼 클래스라는 설계도를 통해 객체를 만들고 그러한 객체들을 활용하여 데이터를 처리하는 방식 입니다. 기능들을 객체로 모듈화를 함으로 같은 기능을 중복으로 연산하지 않으며 모듈을 재활용하기 때문에 유지 보수에 유리합니다.
객체 지행 프로그래밍의 특징으로는 캡슐화, 상속, 다형성 등이 있습니다. 캡슐화란 관련된 데이터와 알고리즘이 하나의 묶음으로 정리된 것을 말합니다. 외부 세계와의 상호작용은 함수를 통해서만 가능하도록 구성하여 프로그램 내부의 데이터는 외부로 공개하지 않으며, 기능은 사용할 수 있도록 제공이 가능합니다. 상속은 이미 작성된 클래스를 이어 받아 새로운 클래스를 생성하는 방법으로 기존 코드를 재활용해서 사용가능하다는 장점이 이에 해당합니다. 다형성은 하나의 이름으로 많은 상황에 대처하는 기법입니다. 개념적으로 동일한 작업을 하는 함수들에 똑같은 이름을 부여할 수 있으므로 코드가 더 간단해지는 효과가 있습니다.
2. 동적 타이핑
자바스크립트는 동적 타이핑이라는 특징을 가지고 있습니다. Java나 C언어 같은 언어들의 경우 변수를 선언하는 단계에서 해당 변수의 타입을 선언해야 하며, 변수 선언 단계에서 해당 변수의 타입이 이미 결정되어 버립니다. 아래는 Java에서 변수를 선언하는 예시입니다.
String strVar = "문자열 형식의 데이터";
Int intVar = 10;
Boolean boolVar = True;위에 코드를 보시면 strVar라는 변수를 선언할 때 앞에 String이라고 데이터 타입을 미리 선언해주는 것을 확인 가능합니다.
반면에 자바스크립트에서는 변수를 선언하는 단계에서는 변수의 데이터 타입을 선언해 주지 않고 변수에 보관된 데이터 종류에 따라 런타임시점(프로그래밍이 실행되는 시점)에 데이터의 타입이 결정 됩니다.
let strVar = "문자열"; // 문자열 타입의 데이터를 저장했지만 실행 전까지는 데이터 타입이 확정되어 있지 않습니다.
let intVar = 10;
let boolVar = true;
let strVar = 10; // strVar 10 이라는 int 타입 데이터를 저장하면 런타임 단계에서 int 타입이 됩니다.
3. 함수형 프로그래밍 지원
자바스크립트는 함수형 프로그래밍을 지원하는 언어로서, 함수를 일급 객체로 취급하고, 고차 함수를 지원합니다.
함수를 일급 객체로 취급한다는 말은 쉽게 이야기하자면 함수를 다른 변수처럼 사용할 수 있도록 프로그래밍 언어에서 지원한다는 의미 입니다. 예를 들어 함수를 변수에 할당 가능하며, 다른 함수의 매개변수로 전달이 가능하며, 함수에서 리턴값으로 반환 될 수 있음을 의미합니다. 아래는 예시 샘플입니다.
# 함수를 리턴값으로 사용
function multiplyBy(factor) {
return function(number) {
return number * factor;
};
}
# 함수를 변수에 할당
const double = multiplyBy(2); // 주어진 숫자를 2배로 반환하는 함수를 반환
const triple = multiplyBy(3); // 주어진 숫자를 3배로 반환하는 함수를 반환
console.log(double(5)); // 10
console.log(triple(5)); // 15이 예에서 multiplyBy 함수는 factor 인수를 사용하고 number 인수를 사용하여 factor를 곱하는 다른 함수를 반환합니다. 반환된 함수는 변수(double 및 triple)에 할당할 수 있고 언어의 다른 값처럼 사용할 수 있는 일급 객체입니다.
고차 함수란, 함수를 인자로 받거나, 함수를 반환하는 함수를 의미 합니다. 위의 예시에서 multiplyBy 함수가 고차함수라 할 수 있습니다.
4. 비동기 처리
비동기 처리는 다른 프로그래밍 언어와 차별화되는 자바스크립트의 주요 특성 중 하나입니다. 사실 이 개념은 익숙하지 않아서 이해하는데 조금 고생했습니다. 다음 주소는 이해하기 위해 참고한 블로그 주소 입니다.
( 참조 링크 : https://ingg.dev/js-work/ )
자바스크립트 엔진 자체는 기본적으로 작업을 하나의 스레드로 처리합니다. 그렇기 때문에 작업이 스택 형식의 데이터 구조에 함수가 호출되고 이를 LIFO(Last In First Out)방식으로 순차적으로 실행합니다. 하지만 자바스크립트의 경우 엔진 밖에서도 자바스크립트에 관여하는 Web API, Task Queue, Event Loop등의 요소 들이 있으며 이런 요소들이 실행되는 환경을 런타임이라고 부릅니다. 자바스크립트 런타임의 예시로는 node.js나 chrome 브라우저 등이 있습니다.
하지만 예를 들어 콜백 함수(함수내부에서 또다른 함수를 사용하는 함수) 등을 사용하게 되면 자바 스크립트 엔진이 아닌 런타임 환경에서 실행되는 Web API등에 요청을 하는 경우가 생기며, 이런 경우에는 처리된 데이터가 언제 반환될지 예상할 수 없기 때문에 비동기 방식으로 처리를 합니다. 더욱 자세한 내용은 이 후 비동기 처리에 대해 깊게 설명할 기회가 있으면 다시 글을 작성해보도록 하겠습니다.
5. 클라이언트 측 및 서버 측 모두에서 사용 가능
대부분의 언어는 서버측에서만 사용 가능(PHP, Ruby, Java, Python)하거나, 클라이언트 측에서만 사용 가능(Dart,Typescript,Elm,WebAssmbly)한 것이 일반적입니다. 하지만 자바 스크립트는 Node.js의 등장으로 인해 클라이언트 측만이 아닌 서버 측에서도 사용 가능한 언어가 되었습니다.
오늘은 여기서 마무리하고 다음에 또 다른 주제로 찾아뵙겠습니다.