1. MS가 추가한 정적 자료형[type] 언어인대 이 정적 언어는 타입 문제를 컴파일 하기전에 확인할수있어서 타입의 안정성↑ 이라고함.
그럼 정적 자료형이 typescript 하는대 왜나오냐 js는 동적언어임. 루비 js 파이썬 전부 동적언어임.
프로그램이 실행되는 도중에도 중간에 결정을 다시할수있는게 이 동적언어들이고 특징임.
그니까 TS[typescript]는 동적언어를 정적으로 바꾸어주고 안정성을 올려줌
2. 자바스크립트의 슈퍼셋임: js에 +@의 문법을 더한게 TS임
유효한 자바스크립트로 작성한 코드는 확장자를 .js에서 .ts로 변경하고 타입스크립트로 컴파일해 변환할 수 있습니다.
반대로 생각하면 그냥 문법만 맞으면 JS를 TS로 바꾸고 BUILD해도 가능함.
3. 객체 지향 언어를 지원한다. 조금 더 객체지향 적인 성격을 띈다.
Javascript는 "인터프리트 형태의 자바"가 아니다. 간단히 말하면, Javascript는 프로토타입 기반 객체 생성을 지원하는 동적 스크립트 언어이다.
Javascript는 절차지향 (procedural) 언어와 객체지향 (object oriented) 언어 두가지 형태로 만들수 있다. 자바스크립트에서 객체는 실행 시간에 빈 객체를 오버라이딩하여 메소드와 프로퍼티를 연결하는 (프로그래밍)방식으로 생성된다.
원래 양쪽 전부 지원하고 런타임 환경에서도 [동작중일때도] 비어있는 오브젝트[객체]를 여기저기 붙여서 언제든지 추가할수있게만들어놓음. 즉 사용자가 어떻게 만드느냐에 따라 절차 지향도 가능하고 객체 지향도 가능함.
- 각 객체를 렌더링 이후 생성 하냐 전에 생성하냐 사용자 설정에따라 양쪽다 가능하다.
1번에서 말한 자료형 안정성 확보가 가능하다. 라는 말이 이소리임
장단점인 객체의 자료형이 정해져 있지 않아서 발생하는 각종 오류들을 자료형을 정해줄수 있게 함으로서 미연에 이런 문제를 방지 할 수 있음
요약그림.
const a: number = 10; // 타입을 명시
const b = 10; // 타입을 추론하게 함자료형과 변수명을 선언 및 초기화 할 때 이렇게 둘 다 써도 됨.
4. 타입스크립트 단점
컴포넌트나 오브젝트가 같은 내용인대 이름이 다르다. 이러면 내용이 같아서 문제가 발생함
JS에선 당연하단듯이 써왔던 오브젝트나 변수 정의를 여기선 일일이 자료형까지 정해줘서 해야함.
코드가 길어지고 가독성이 떨어짐
JS에서 생기는 어쩔수없는 오류들이 여기서도 생길수 밖에없는 구조임. SUPERSET이니까
5. ts 변환 순서
1.코드를 컴파일러가 PARSING 해서 DOM 구조비슷한 AST 구조로 바꿈[ESLINT와 같음]
2.AST구조를 JS코드로 변환
3.브라우저나 런타임 프로그램이 JS 코드를 읽음 [여기까지가 TS가 수행]
4.JS 소스-> JS AST 변환-> BYTE CODE → RUN TIME PROGRAM
1~3은 TSC가 수행하며, 4~6은 브라우저, NodeJS, 기타 자바스크립트 엔진 등에서 수행함.
4~6은 기타 자바스크립트 엔진[WEBPACK, VECEL 등등]->NODE.JS ->BROWSER 이 순서대로임.
