200804 러버덕 정리

프로그래밍

컴퓨터에게 실행을 요구하는 일종의 커뮤니케이션

프로그래밍 언어: 컴퓨터가 이해할 수 있는 언어(기계어)

사람 -> 프로그래밍 언어 -> 기계어 -> 컴퓨터
리터럴 -> 자바스크립트 -> 인터프리터(정적언어는 컴파일러)-> 2진수 변환 -> 메모리에 저장

자바스크립트

시작: 넷스케이프 커뮤니케이션즈가 웹페이지의 보조적인 기능을 수행하기 위해 브라우저에서 동작하는 경량 프로그래밍 언어를 개발 -> 브랜던 아이크의 자바스크립트: 모카로 명명

표준화
MS에서도 자바스크립트의 파생버전 JScript를 개발하면서 넷스케이프와 경쟁구도. 자사 브라우저에서만 작동하는 기능을 추가하기 시작하면서 호환되지 않는 문제가 생겨남(크로스 브라우징 이슈). 따라서 표준화에 대한 필요성 대두.

ECMAScript
1997: 표준화된 자바스크립트 초판(ECMAScript 1) 사양(specification)이 완성되었고, 상표권 문제로 자바스크립트는 ECMAScript로 명명
1999: ECMAScript 3(ES3)
2009: ECMAScript 5(ES5)는 HTML5와 함께 출현한 표준 사양
2015: ECMAScript 6(ECMAScript 2015, ES6)는 let/const 키워드, 화살표 함수, 클래스, 모듈 등과 같이 범용 프로그래밍 언어로서 갖춰야 할 기능들을 대거 도입

자바스크립트의 발전 과정

렌더링 -> AJAX(XMLHttpRequest) -> jQuery -> V8 -> Node.js -> 프레임 워크

초창기는 웹페지이의 보조기능을 수행하면서 브라우저에 단순 렌더링하는 역할, AJAX의 등장으로 비동기 처리가 가능해지면서 성능이 빨라지고 화면전환이 부드러워짐.

HOW?

기존방식: <html></html>의 완전한 html을 서버에서 전송받아 웹페이지 전체를 렌더링, 화면 전환 시 이 과정이 처음부터 다시 이루어지면서 화면이 깜빡이는 현상이 발생.
불필요한 데이터 통신, 성능도 좋지 않음.
AJAX: 변경필요 없는 부분은 그대로 두고, 서버에서 필요한 데이터만 전송받아 변경이 필요한 부분만 렌더링.

JQuery
DOM을 쉽게 제어할 수 있고, 크로스 브라우징 이슈도 해결. 배우기 쉽고 직관적.

V8 자바스크립트 엔진
구글에서 개발. 자바스크립트가 웹 어플리케이션 개발 프로그래밍 언어로 정착하게 함. 웹 서버에서 수행되던 로직이 클라이언트 사이드로 이동.

Node.js
라이언 달. V8로 빌드된 자바스크립트 런타임 환경. 브라우저의 자바스크립트 엔진에서만 동작하던 js를 다른 환경에서도 동작할 수 있도록 함.

프레임워크
Angular, React, Vue.js, Svelte 등

ECMAScript: 자바스크립트의 표준 사양인 ECMA-262를 말하며, 프로그래밍 언어의 값, 타입, 객체와 프로퍼티, 함수, 표준 빌트인 객체(standard built-in object) 등 핵심 문법을 규정

javascript: 웹 브라우저에서 동작하는 유일한 프로그래밍 언어. 인터프리터 언어.

ECMAScript: core역할, 표준화, spec관리 등등.
Node.js: host APIs(server-side javascript). 브라우저 외부에서 js 개발 환경을 제공하는 것이 주된 목적. DOM api 제공 안함. 파일을 create/read/update/delete할 수 있는 파일 시스템을 기본 제공.
javascript: client-side. 화면 렌더링이 주된 목적. DOM api 제공. 파일을 create/read/update/delete할 수 있는 파일 시스템을 기본 제공안함.

변수

변수 선언: 값을 저장하기 위한 메모리 공간을 할당, 주소값을 연결하여 값을 저장할 수 있도록 한다.
초기화: 선언 후 값을 할당하지 않았을 때 undefined가 암묵적으로 할당된다.

변수 호이스팅
변수 선언문이 코드의 선두로 끌어 올려진 것처럼 동작. 런타임 이전에 변수 선언문을 찾아 실행한 후 런타임 때 할당이 이루어짐.

1 2	console.log(result); //undefined var result;

할당 할 때, undefined로 초기화 된 값을 지운 후 그 자리에 값을 할당하는 것이 아니라, 새로운 메모리 공간을 확보한 후 그 곳에 값을 저장한다. 재할당의 경우도 마찬가지이다. 재할당이 이루어지면 기존의 변수는 가비지 컬렉터에 의해 언젠가 메모리 해제된다.

식별자 네이밍 규칙

변수나 함수의 이름: 카멜 케이스를 사용. (ex. var firstName;)
생성자 함수, 클래스의 이름: 파스칼 케이스를 사용 (ex. var FirstName;)

표현식과 문

표현식
값으로 평가될 수 있는 문. 표현식이 평가되면 값을 생성하거나 참조한다.
become a value. 값이 생성되거나 문의 일부가 될 수 있다.

문
perform action. 값이 생성되지 않고, 실행문이나 코드블록의 action을 컨트롤할 뿐이다.
프로그램을 구성하는 기본 단위, 최소 실행 단위. 여러 토큰들로 구성된다. 특정 액션을 수행하는 역할을 한다.문은 반드시 세미콜론으로 끝나야 하는데, 중괄호로 묶은 코드 블록 뒤에는 세미콜론을 붙이지 않는다. ex. if문, for문, 함수 등)

문: 실행되거나 특정한 action을 수행할 수 있는 코드의 조각을 말한다.
표현식: 평가되어 값을 생성할 수 있는 코드의 조각을 말한다.
표현식인 문: 값으로 평가될 수 있는 문. ex.변수 할당문
표현식이 아닌 문: 값으로 평가될 수 없는 문 ex.변수 선언문

데이터 타입

원시타입 / 객체 타입

데이터 타입은 메모리 공간을 확보하고 참조하기 위해 필요하다. 변수에 할당되는 값의 데이터 타입에 따라 확보해야 할 메모리 공간의 크기가 결정되기 때문이다.

정적 타입: 명시적으로 어떤 타입인지 사전에 선언해야 하고, 컴파일 시점에 타입체크를 수행한다.
동적 타입: 값을 할당하는 런타임에 변수의 타입이 결정되고, 언제든지 변경할 수 있다.