type alias
변수만드는 것 처럼 type 이라는 키워드를 쓰면 된다.
type 키워드 쓰는걸 type alias 라고 합니다.
type Animal = string | number | undefined;
type AnimalObj = {name: string, age:number}
let animal: Animal;
let animal2: AnimalObj;type 타입변수명 = 타입종류
일반 자바스크립트 변수랑 차별을 두기 위해 관습적으로 타입변수명은 대문자로 시작합니다. 또는 타입변수명+Type 이런 식으로 작명하는 방법도 있음.
object 타입 type alias
type Person = {
name : string,
age : number,
}
let teacher: Person = { name : 'john', age : 20 } readonly
readonly로 타입 수정 불가능하게 만듬
const 변수는 값이 변하지 않는 변수를 만들고 싶을 때 쓴다. 하지만 object 자료를 const에 집어넣어도 object 내부는 마음대로 변경가능 하다.
const 변수는 재할당만 막아줄 뿐이지 그 안에 있는 object 속성 바꾸는 것 까지 관여하지 않기 때문입니다.
object 속성을 바뀌지 않게 막고 싶으면 타입스크립트 readonly를 쓴다.
type Girlfriend = {
readonly name : string,
}
let 여친 :Girlfriend = {
name : '엠버'
}
여친.name = '유라' //readonly라서 에러남타입스크립트 에러는 에디터&터미널에서만 존재함, 실제 변환된 js파일은 에러없음
object 속성 선택사항
object 자료는 color 속성이 선택사항이라면 물음표연산자를 추가하면 됨.
type Square = {
color? : string,
width : number,
}
let 네모2 :Square = {
width : 100
}물음표는 "undefined 라는 타입도 가질 수 있다~"라는 뜻
type 합치기
OR 연산자를 이용해서 Union type을 만들 수 있음.
type Name = string;
type Age = number;
type NewOne = Name | Age; extend
object에 지정한 타입의 경우 합치기도 가능
type PositionX = { x: number };
type PositionY = { y: number };
type XandY = PositionX & PositionY
let 좌표 :XandY = { x : 1, y : 2 }& 기호를 쓴다면 object 안의 두개의 속성을 합쳐줍니다.
Type alias & { name : string } 이런 것도 가능
type 키워드는 재정의가 불가능
같은 이름의 type 변수 재정의 불가능
//에러발생
type Name = string;
type Name = number;Literal Types
literal type은 특정 글자나 숫자만 가질 수 있게 제한을 두는 타입
더 엄격한 타입지정 가능
변수에 뭐가 들어올지 더 엄격하게 관리가능
let way: 'left' | 'right';
way = 'left';way변수에는 left, right만 올 수 있음
함수 literal type
function 함수(a : 'hello') : 1 | 0 | -1 {
return 1
}파라미터 타입선언할 때 글자나 숫자를 집어넣으시면 그것만 파라미터로 넣을 수 있고
return 타입선언할 때도 글자나 숫자를 집어넣으시면 그 값만 return할 수 있습니다.
Literal Types과 const
const 변수는 값을 바꿀 수 없는 변수
가끔은 변하는 중요한 정보를 저장하고 싶을 땐 const 사용 못함.
예를 들어 변수가 'kim' 또는 'park' 만 가질 수 있는 이런 식의 엄격한 변수는 못만듭니다.
// 이런 식의 문법은 자바스크립트에 없음
const 이름 = 'kim' | 'park' as const
// 에러나는 코드
var 자료 = {name : 'kim'}
function 내함수(a : 'kim') {
}
// 자료.name은 string 타입, 함수에서 지정한 'kim' 타입이 아님
내함수(자료.name)에러가 안나게 하려면 as const를 사용한다.
var 자료 = {name : 'kim'} as const;
function 내함수(a : 'kim') {
}
내함수(자료.name)as const 기능
1. 타입을 object의 value로 바꿔줍니다. (타입을 'kim'으로 바꿔줍니다)
2. object안에 있는 모든 속성을 readonly로 바꿔줍니다 (변경하면 에러나게)
함수 type alias
함수 type alias 지정하는 법
화살표 함수를 사용한다. () => {}
함수 표현식(let 함수명 = function(){})에만 type alias 사용가능
// 함수타입
type NumOut = (x : number, y : number ) => number ;
// 함수타입 사용
let ABC :NumOut = function(x,y){
return x + y
}arrow function의 장점은 기호 생략기능을 제공해준다는 점(자바스크립트 es6)
1. arrow function에선 중괄호안에 return 한 줄 코드만 있으면 중괄호 { } 생략 가능
2. 파라미터가 한개 밖에 없으면 소괄호 ( ) 생략 가능
그래서 예를 들어서 2를 넣으면 2를 곱해주어 return 해주는 함수를 만들고 싶으면
타입(let, const, type) 이름 = x => 2 * x
이렇게 사용가능합니다.
methods 내부 함수 타입지정
object 자료 안에 함수도 맘대로 집어넣을 수 있습니다.
type Member = {
name : string,
age : number,
plusOne : ( x :number ) => number,
changeName : () => void
}
// object 안에 함수만들수있음
let 회원정보: Member = {
name : 'kim',
age : 30,
plusOne (x){
return x + 1
},
changeName : () => {
console.log('안녕')
}
}
회원정보.plusOne(1);
회원정보.changeName();출처 coding apple
