1. JS(자바스크립트) 언어의 특징 그리고 역사
(1) JS의 역사
1995년 자바스크립트 탄생
🌐 넷스케이프 커뮤니케이션(LiveScript → Javascript)
🖥 브라우저 동작 스크립트 언어
1999년 자바스크립트 표준화(ECMA-262) 완료
2005년 AJAX 등장
비동기 웹 애플리케이션 개발 가능
폭발적인 UX 향상 🚀
2008년 V8 엔진 출시(google)
super fast(코드 실행 속도 상당부분 개선)
🛠 컴파일러, 메모리관리 시스템 👍
2009년 Node.js 등장, 서버 개발 활성화
서버개발의 지각변동 : PHP, Ruby, Python, Java → Javascript(Node.js)
하나의 언어 → FrontEnd + BackEnd + DB(MongoDB) = FullStack
2015년 ECMAScript 6(ES6) 버전 출시 🚀
2016년 프론트엔드 프레임워크(React, Vue, Angular) 대중화, SPA 개발 활성화🌟
현재 자바스크립트는 프론트엔드 및 백엔드 개발 분야에서 널리 사용되며, Node.js
를 이용한 서버 개발도 활발하게 이루어지고 있습니다.
(2) JS 언어의 특징
[1] 객체 지향 프로그래밍 지원
자바스크립트는 객체 지향 프로그래밍이 가능한 언어로서, 객체를 생성하고 관리하
는 데에 강점이 있습니다. 이를 통해 복잡한 기능을 구현할 수 있습니다.
객체지향 vs 절차지향
절차지향 프로그래밍은 순서대로 실행되는 일련의 과정을 단계적으로 기
술하여 프로그램을 만드는 것이고, 객체지향 프로그래밍은 데이터와 함
수를 객체라는 그룹으로 묶어서 처리하는 방법입니다.
예를 들어, 절차지향 프로그래밍 에서는 첫 번째 일을 처리한 다음에 두 번째
일을 처리하고, 그 다음에 세 번째 일을 처리하는 순서대로 프로그램을
만듭니다.
반면 객체지향 프로그래밍에 서는 데이터와 함수를 객체라는 그룹으로 묶어서
처리합니다. 객체는 상태와 행동을 가지고 있으며, 상태는 객체의 속성
(property)이라고도 합니다.
✓ JS에서 객체를 만들 때는?
자바스크립트에서 객체를 만들 때는 중괄호({})를 사용하여 객체를 만들
고, 각 속성을 쉼표(,)로 구분하여 추가합니다. 속성은 이름과 값을 가지
며, 이름은 문자열로 작성하고, 값은 다양한 데이터 타입을 사용할 수 있
습니다. 객체 내부의 함수를 메소드(method)라고 부르며, 속성의 값으
로 함수를 추가할 수 있습니다. 객체를 만들어서 필요한 속성과 메소드를
추가하여 사용합니다.
[2] 동적 타이핑
자바스크립트는 동적 타이핑을 지원하는 언어로서, 변수를 선언할 때 타입을 지정하
지 않습니다. 이것은 런타임 시점에 변수에 할당되는 값에 따라 자동으로 데이터 타
입이 결정된다는 것을 의미합니다. 예를 들어, 아래와 같은 코드를 살펴보겠습니다.
선언과 할당이라는 단어에 주목해주세요!
👉 코드예시
let myVariable = "Hello, world!"; // 변수 선언 및 문자열 데이터 타입으로 할당
console.log(typeof myVariable); // "string" 출력
myVariable = 123; // 숫자 데이터 타입으로 할당
console.log(typeof myVariable); // "number" 출력
myVariable = true; // 불리언 데이터 타입으로 할당
console.log(typeof myVariable); // "boolean" 출력
런타임(Runtime)?
런타임 시점이란, 프로그램이 실행되는 동안의 시점을 의미합니다. 즉,
코드가 실행되는 동안에 발생하는 시점을 말합니다. 반대의 의미로는 컴
파일 시점이 있어요.
[3] 함수형 프로그래밍 지원
자바스크립트는 함수형 프로그래밍을 지원하는 언어로서, 함수를 일급 객체로 취급
하고, 고차 함수를 지원합니다. 이를 통해 코드의 재사용성과 가독성을 높일 수 있습
니다.
일급객체란?
일급 객체(first-class object)란, 함수를 일반 값과 마찬가지로 변수에 할
당하거나, 함수의 인자로 전달하거나, 함수의 반환값으로 사용할 수 있는
객체를 의미합니다.
👉 코드예시
// 함수를 변수에 할당
const add = function(a, b) {
return a + b;
}
// 함수를 인자로 받는 함수
function calculate(func, a, b) {
return func(a, b);
}
// 함수를 반환하는 함수
function getAddFunction() {
return add;
}
// 함수를 일급 객체로 다루어 코드의 재사용성을 높임
console.log(calculate(add, 2, 3)); // 5
console.log(getAddFunction()(2, 3)); // 5
고차함수란?
고차 함수(higher-order function)란, 함수를 인자로 받거나, 함수를 반환
하는 함수를 의미합니다.
👉 코드예시
// 고차 함수 예시: 함수를 인자로 받는 함수
function operate(func, a, b) {
return func(a, b);
}
function add(a, b) {
return a + b;
}
function multiply(a, b) {
return a * b;
}
console.log(operate(add, 2, 3)); // 5
console.log(operate(multiply, 2, 3)); // 6
[4] 비동기 처리
비동기 처리는 작업을 순차적으로 기다리지 않고, 병렬로 처리할 수 있도록 하는 방
식입니다.
[5] 클라이언트 측 및 서버 측 모두에서 사용 가능
자바스크립트는 클라이언트 측에서만 사용되는 것이 아니라, Node.js를 이용하여
서버 측에서도 사용됩니다. 이를 통해 웹 개발 전반에 걸쳐 자바스크립트를 활용할
수 있습니다.
