TypeScript는 JavaScript의 확장된 버전으로, 정적 타입 시스템을 지원함.

코드의 타입 검사를 통해 컴파일러가 빌드하기 전에 오류를 검출.

강력한 객체 지향 프로그래밍 지원. 클래스, 인터페이스, 제네릭 등의 개념을 지원하여 객체 지향 프로그래밍을 더 쉽게 할 수 있음.

문법​

interface Person {
  name: string;
  age: number;
}

type Person = {
  name: string;
  age: number;
}

interface 사용 예제​

ASI(Automatic Semicolon Insertion)​

자바스크립트 프로그램은 코딩시 세미콜론(;)이 하나라도 누락되면 돌아가지 않는다.

자바스크립트 파서(parser)는 줄 단위로 파싱을 하다가 세미콜론(;)이 빠져 에러가 나면 세미콜론(;)을 넣어보고 타당하면 세미콜론(;)을 삽입한다

문(Statement)​

프로그램을 구성하는 최소 실행 단위

• 타입 캐스팅(Type Casting) : 명시적으로 타입을 바꾸는 경우

  let a = 26
  let b = String(a)
  

• 강제 변환(Coercion) : 암시적으로 타입을 바꾸는 경우

  let a = 26
  let b = 26 + ""
  

문자열이 아닌 값을 문자열로 변환

let a = true;
a = a.toString()
let b = 26
b = b.toString()

console.log(a)          // "true"
console.log(typeof a)   // string

console.log(b)          // "26"
console.log(typeof b)   // string

console.log(Object.prototype.toString.call(a))  // [object String]
console.log(Object.prototype.toString.call(b))  // [object String]

null , undefined 원시값은 타입 캐스팅을 사용할 수 없으니 주의해야 한다.

네이티브란? 특정 환경(브라우저)에 종속되지 않은 ESMAScript 명세에 있는 내장 함수로 원시 값을 감싸는 객체 래퍼 이다.

• String()
• Number()
• Boolean()
• Array()

자바스크립트의 배열은 자유롭게 어떠한 값이든 넣을 수 있으며, 배열의 크기를 미리 선언 할 필요도 없다.

let array = [26, '스물여섯', ['1-1', '1-2'], function () { 'fun' }]

console.log(array.length)   // 4
console.log(array[0])       // 26
console.log(array[1])       // '스물여섯'
console.log(array[2][0])    // 1-1
console.log(array[2][1])    // 1-2
console.log(array[3])       // f () { 'fun' }

배열에 값을 추가하거나 변경할때도 제약이 없이 자유롭다.

심지어, 아래처럼 빠진 슬롯이 있는 배열 생성도 가능하다.

let array = [];

array[3] = '세번째 값'

console.log(array.length)   // 4
console.log(array[2])       // undefined
console.log(array[3])       // 세번째 값

자바 스크립트의 배열에는 주의점이 있다. 배열도 하나의 객체이기 때문에 키/프로퍼티 값을 추가 할 수 있다. 이 때 배열의 length 가 증가하지 않으니 주의 가 필요하다.

형검사에 따른 언어 분류​

타입을 어떻게 얼마나 엄격하게 검사하는지에 따라 언어를 분류할 수 있다.

• 강한 타입(strong typing) : C, C++, Go, Haskell, Java, Kotlin, Rust, Scala

  → 정적 파일 검사 : 타입이 올바른지에 대한 검사를 런타임 이전에 시행

• 약한 타입(weak typing) : Javascript, Lisp, Lua, Perl, PHP, Python, Ruby

자바스크립트란?​

자바스크립트는 1995년에 넷스케이프(Netscape)의 브렌던 아이크(Brendan Eich)에 의해 만들어졌다. 처음에는 모카(Mocha)라는 이름으로 개발되었으나, 그 후에 라이브스크립트(LiveScript), 최종적으로는 자바스크립트(JavaScript)라는 이름으로 변경된다.

JavaScript는 C에서 영향을 받은 C-Family 언어로 기본적인 문법이 유사 중괄호로 구분하는 블럭, 세미콜론으로 줄이 끝남을 알리는 것, 변수 쓰는 법, 연산자 사용법 등 기초적인 문법이 C 문법과 크게 다르지 않다. 호이스팅 같은 것도 C언어의 잔재이다.

자바스크립트 엔진​

자바스크립트 엔진은 소스코드를 가져와서, 문자열 단위로 분해하고(어휘 단위로 정리), 이들 문자열을 컴파일러가 이해할 수 있도록 바이트 코드로 변환한 후, 이를 실 행하며, 메모리를 할당하고, 가비지 컬렉팅을 한다.

자바스크립트는 함수 선언보다 함수 실행을 먼저 하더라도 동작이 된다.

코드는 위에서 아래로 실행이 된다고 알고 있는데 왜 그런걸까?

실행 컨텍스트​

실행 컨텍스트execution context는 실행할 코드의 환경 정보를 모아 놓은 객체로, 가장 먼저 실행되어 스택에 들어가게 된다.

이 실행 컨텍스트가 생성될 때, 호이스팅이 된다.

npm i -g express-generator

# express 프레임워크 기반 워크스페이스 폴더 생성
express [폴더명] --view=[뷰엔진] 
cd [폴더명]

npm install

express-generator 폴더 구조

bin/www

var app = require('../app');  
var debug = require('debug')('learn-express:server');  
var http = require('http');

• app : express() 인스턴스. app.set(키,값) 형태로 데이터를 저장할 수 있으며 app.get(키)로 가져올 수 있다.
• debug : 콘솔에 로그를 남길 수 있는 모듈

Javascript 싱글 스레드 눈으로 확인하기.​

자바스크립트는 자바와는 다르게 싱글 스레드라고 한다.

한번에 하나의 작업만 수행할 수 있음에도 불구하고 비동기, 논블로킹등을 지원하기에 실제 코드상 눈으로 확인하긴 어렵다.

따라서 아래 자바와의 비교를 코드를 통해 싱글 스레드를 눈으로 확인해보겠다.

잘못 된 정보가 있다면 댓글로 알려주길 바랍니다!