일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | |||||
3 | 4 | 5 | 6 | 7 | 8 | 9 |
10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 | 18 | 19 | 20 | 21 | 22 | 23 |
24 | 25 | 26 | 27 | 28 | 29 | 30 |
31 |
- 함수
- SQL
- forEach
- Delete
- 화살표 함수
- let
- Javascript
- SQL 전문가
- Has
- 오븐
- Map
- 울산 남구 맛집
- 휘낭시에
- 정보처리기사
- clear
- vuejs
- undefined
- sqld
- Vue
- slice
- set
- TypeScript
- 객체
- 울산 맛집
- TS
- 배열
- 울산맛집
- size
- 홈베이킹
- 자바스크립트
- Today
- Total
목록TypeScript (17)
Bae

ㅁ 객체의 비구조화 할당문 다음 코드는 name과 age라는 단어가 각기 다른 의미로 사용되므로 personName, companyName처럼 이 둘을 구분하고 있음 // 구조화가 필요한 코드 예 let personName = 'Jack' let personAge = 32 let companyName = 'Apple Company, Inc' let companyAge = 43 코드를 이런 방식으로 구현하면 작성하기도 번거롭고 기능을 확장하기도 어려움 따라서 다음처럼 인터페이스나 클래스를 사용해 관련된 정보를 묶어 새로운 타입으로 표현함 이를 구조화(structuring)라고 함 // IPerson_ICompany.ts export interface IPerson { name: string age: num..

ㅁ 객체와 클래스 - 클래스 선언문 타입스크립트는 class, private, public, protected, implements, extend와 같은 키워드를 제공함 다음은 클래스 선언문의 기본 형태임 class 클래스 이름 { [private | protected | public] 속성 이름[?]: 속성타입[...] } // Person1.ts class Person1{ name: string age?: number } 다음 코드는 Person1 클래스에 new 연산자를 적용해 jack1이라는 이름의 Person1 타입 변수를 만든다. jack1은 name과 age 속성을 가지는 타입이므로 6행과 같은 코드를 작성할 수 있음 ...생략... let jack1 : Person1 = new Person..

ㅁ 객체와 인터페이스 object 타입으로 선언된 변수는 number, boolean, string 타입의 값을 가질 수는 없지만, 다음처럼 속성 이름이 다른 객체를 모두 자유롭게 담을 수 있음 아래의 코드의 object 타입은 마치 객체르 ㄹ대상으로 하는 any 타입처럼 동작 타입스크립트의 인터페이스 구문은 이렇게 동작하기 않게 하려는 목적으로 고안됨 즉, 변수 o에는 항상 name과 age 속성으로 구성된 객체만 가질 수 있게 해서 다음 코드는 오류가 발생함 let o: object = {name:'Jack', age:23} o = {first:1, second:2} - 인터페이스 선언문 interface 키워드는 객체의 타입을 정의하는 것이 목적임 객체를 의미하는 중괄호 {}로 속성의 이름과 타입을..

ㅁ 타입스크립트 변수 선언문 - 타입스크립트 기본 제공 타입 유형 자바스크립트 타입 타입스크립트 타입 수 타입 Number number 불리언 타입 Boolean boolean 문자열 타입 String string 객체 타입 Object object - let과 const 키워드 let으로 선언한 변수는 코드에서 그 값이 수시로 변경될 수 있음 let 변수 이름 [ = 초기값 ] const로 변수를 선언할 때는 반드시 초기값을 명시해야 함 const 변수는 코드에서 변수값이 절대 변하지 않음 const 변수 이름 = 초기값 - 타입 주석 타입스크립트는 자바스크립트 변수 선언문을 확장해 타입을 명시 할 수 있음 이를 타입 주석(type annotation)이라고 함 let 변수 이름: 타입 [ = 초기값 ..

ㅁ tsconfig.json 파일 살펴보기 compilerOptions 항목은 tsc 명령 형식에서 옵션을 나타냄 include 항목은 대상 파일 목록을 나타냄 src/**/*은 src 디렉터리는 물론 src의 하위 디렉터리에 있는 모든 파일을 컴파일 대상으로 포함한다는 의미 '키: 키값' 형태로 작성 // tsconfig.json { "compilerOptions" {...생략...}, "include": ["src/**/*"] } { "compilerOptions": { "module": "commonjs", "esModuleInterop": true, "target": "es5", "moduleResolution": "node", "outDir": "dist", "baseUrl": ".", "sou..

ㅁ 모듈 이해하기 타입스크립트에서 index.ts와 같은 소스파일을 모듈(module)이라고 함 코드 관리와 유지 및 보수를 편리하게 하려고 모듈마다 고유한 기능을 구현하는 방식으로 소스코드를 분할함 이를 모듈화(modulization)이라 함 이처럼 소스코드를 여러 개 모듈로 분할하면 어떤 모듈에 어떤 내용이 있는지 서로 알게 해줘야 함 이를 위해 타입스크립트는 export와 import라는 키워드를 제공 //index.ts let MAX_AGAE = 100 interface IPerson{ name: string age: number } class Person implements IPerson{ constructor(public name: string, public age: number){} } fu..

ㅁ 타입스크립트란? - 세 종류의 자바스크립트 1) 웹 브라우저에서 동작하는 표준 자바스크립트인 ES5(ECMAScript 5) 2) 2015년부터 매년 새로운 버전을 발표하는 ESNext 3) ESNext에 타입(type) 기능을 추가한 타입스크립트(TypeScript) - 자바스크립트에 타입 기능이 있으면 좋은 이유 A라는 개발자가 만든 코드 function makePerson(name, age){} B라는 개발자가 이 코드를 이용하려고 할때 오류가 발생했다면 원인이 무엇인지 찾기가 어려움 makePerson(32, 'Jack'); 타입스크립트의 타입 기능을 이용해 구현했다면 이런 문제는 발생하지 않음 function makePerson(name: string, age:number) {} - 트랜스파..