본문 바로가기

TypeScript

[TypeScript] 06. Generics 원문 : https://www.typescriptlang.org/docs/handbook/generics.html Introduction 잘 정의되고 적합할뿐만 아니라 재 사용이 가능한 컴포넌트를 만드는 일은 소프트웨어 공학의 주요한 부분이다. 어떤 데이터에건 적합한 컴포넌트는 대규모 소프트웨어 시스템을 구축하는데 매우 유연한 가능성을 제공한다. 제네릭스는 다양한 타입을 처리 할 수 있는 컴포넌트를 만들 수 있게 하여, C# 과 Java와 같은 언어에서 재사용성을 높여주는 주요한 도구로 사용된다. Hello World of Generics 어떤 파라미터를 받아 그대로 전달해 주는 함수를 만든다고 했을 때 제네릭스를 사용하지 않는 경우 아래와 같이 작성 할 수 있다. function identity(arg.. 더보기
[TypeScript] 05. Functions 원문 : https://www.typescriptlang.org/docs/handbook/functions.html Introduction 함수는 JavaScript 에서 가장 기본이되는 개념이다. 함수를 통해, 추상화 계층을 정의 하거나, 클래스를 구현하거나, 정보를 숨기거나 모듈화 를 할 수 있다. TypeScript에서는 이미 모듈, class, namespace가 따로 존재하지만 함수는 여전히 어떤 행위에 대한 정의를 하고, 이를 JavaScript 보다 편하게 구현 할 수 있도록 한다. Functions JavaScript와 마찬가지로 함수 명을 명시하는 기명 함수(named function) 표현식, 함수 명이 없는 무기명 함수(anonymous function) 표현식 모두 사용 가능하며, .. 더보기
[TypeScript] 04. Classes 원문: https://www.typescriptlang.org/docs/handbook/classes.html ES6 이전에 javascript 에서는 재사용 가능한 콤포넌트를 만들기 위해 펑선과 프로토타입을 사용했다. 하지만 ES6 이후 javascript 개발자들은 클래스 기반의 객체지향 프로그래밍 처럼개발을 할 수 있게 되었다. 타입스크립트는 이러한 기술들을 브라우저가 ES6를 지원하던 안하던 가능하게 해준다. Classes class Greeter { greeting: string; constructor(message: string) { this.greeting = message; } greet() { return "Hello, " + this.greeting; } } let greeter = n.. 더보기
[TypeScript] 03. Interfaces 원문 : https://www.typescriptlang.org/docs/handbook/interfaces.html TypeScript의 핵심 원칙(?)은 type-checking 이다. 이를 위해 Interface라는 녀석을 정의해서 사용한다.간단한 코드를 통해서 알아보자. function printLabel(labelledObj: { label: string }) { console.log(labelledObj.label); } let myObj = {size: 10, label: "Size 10 Object"}; printLabel(myObj); type-checker는 printLabel 이라는 함수를 체크한다. printLabel 이라는 함수는 labelledObj 라는 매개변수를 받는데 이 녀.. 더보기
[TypeScript] 02. 변수 선언 원문 : https://www.typescriptlang.org/docs/handbook/variable-declarations.html var, let, const 키워드를 이용하여 변수를 선언 할 수 있다. 개인 블로그 http://blog.nekoromancer.kr/2016/01/26/es6-var-let-%EA%B7%B8%EB%A6%AC%EA%B3%A0-const/ 에 내용이 잘 정리 되어 있으니 읽어보는게 좋겠다. 더보기
[TypeScript] 01. Basic Types 원문 : https://www.typescriptlang.org/docs/handbook/basic-types.html TypeScript에서 지원하는 기본 타입들에 대해 알아보자 Booleantrue 또는 false 값 let isDone: boolean = false; Number부동 소수점 값. 2진수, 8진수, 16진수 등을 표현 할 수 있다. let decimal: number = 6; let hex: number = 0xf00d; let binary: number = 0b1010; let octal: number = 0o744; String말 그대로 String. 따옴표, 쌍따옴표 둘다 사용가능.backtick/backquote (`) 로 둘러싸면 멀티라인 문자열이나 템플릿 스트링을 사용할 수.. 더보기
[TypeScript] 00. 시작하기 원문 : https://www.typescriptlang.org/docs/tutorial.html TypeScript tool을 설치방법은 2가지가 있다.1. npm을 이용한 설치2. TypeScript's Visual Studio plugin 설치 (Download Page 에서 다운 받으면 된다.) npm을 이용해 설치 할 경우npm install -g typescript 그럼 이제 TypeScript 파일을 작성해보자. greeter.ts function greeter(person) { return "Hello, " + person; } var user = "Jane User"; document.body.innerHTML = greeter(user); 음... 확장자는 .ts 를 사용한다는것 빼고는.. 더보기