typescript 공부 01

이명진·2022년 6월 3일
0

typescript 공부

목록 보기
1/3

노마드 코드 보고 정리한것
타입스크립트 기초, 아주아주 기본적인 것들은 작성하지 않았다.

never 타입

함수가 실행되고 싶지 않을때 never 타입을 붙인다.
하지만 new Error 를 리턴한다면 에러가 안난다.

void 타입

함수인데 아무것도 반환하지 않는 타입

함수

함수의 type 도 정의가 가능하다.

call signature

type:Add = (a:number ,b:number)=>number

타입을 화살표함수 변수에 정해주면 타입을 일일이 적을 필요가 없어진다

오버로딩

함수가 여러개의 call signature 를 가지고 있을때 발생

라이브러리를 사용할때 직면

어떨때 함수 파라미터로 객체를 줄수도 있고 스트링을 줄수도 있을때 발생한다.
router.push()일때 대부분 많이 발생

그런 경우 타입을 새로 만들어서 void 타입을 주고
실제 사용할 함수에서는 typeof 조건으로 타입별로 리턴값을 다르게 준다.

다양성

다양하게 타입을 섞어서 쓸때 우리는 타입을 여러개 정의를 해줘야 한다.
하지만 재네릭 타입을 알려주면 함수는 값의 타입을 유추할수가 있다.

<T>(arr:T)=>void

이런식으로 쓰는데

<T> 

가 재너릭을 사용한다는 뜻이다. T말고 임의의 문자를 넣어도 된다
값을 리턴하게 될때에도 아래처럼 나타내면 어떤 조합이든지 가능하다

<T>(arr:T)=>T

any 타입을 써도 되지만 재너릭 타입을 써야 타입스크립트가 코드를 방어해준다.
재너릭 타입은 any타입과 다르게 스스로 유추해서 방어가 가능하지만 any는 타입스크립트를 적용하지 않은것과 마찬가지가 된다.

클래스

객체지향형으로 타입스크립트 코드 작성
typescript가 constructor 부분을 채워준다.

private , public js에서는 안쓰고 타입스크립트에서만 쓰이는 것
private 를 앞에 쓰고 파라미터를 쓰면 닷노테이션으로 접근이 안된다.

추상 클래스

abstract class
추상클래스는 다른 클래스가 상속받을수 있는 클래스 ;
new 함수는 못쓴다. 클래스 상속만 가능하다.

추상 클래스 안에는 추상 메소드를 만들수 있는데 call signature로 메소드를 작성해야 한다.

abstract getNickName():void 

추상 메소드는 추상 클래스를 쓰는 곳(상송)에서 필수로 추상 메소드를 구성해야 한다.

추상 클래스에서 private로 파라미터를 만들면 상속하였을 지라도 상속된 곳에서 private 파라미터에 접근할수가 없다. 인스턴스 밖에서도 접근할수가 없다.

부모 클래스에서만 사용이 가능하고 나머지는 접근불가
자식 클래스에서 써야만 한다면 protected를 사용하면 된다.
protected 속성은 닷노테이션 및 다른 곳에서 사용못하지만 상속받은 클래스 에서 부모 클래스의 파라미터(protected)로 된것은 접근이 가능하다.

부모 클래스(추상 클래스)에서 protected nickname 으로 쓰면
부모클래스를 상속한 자식 클래스에서 this.nickname으로 접근이 가능하다.
private는 부모 클래스에서만 사용이 가능하고 자식은 접근이 불가하다.

abstract class 부모 {
	constructor(
		private firstName:string, // 부모에서만 사용 
		protected lastName:string, //상속받은 자식 사용가능
		public nickName:string 
){}
	일반 메소드 (){} //닷노테이션으로 접근 가능 
	abstract 추상함수():void //닷노테이션 불가, 상속받은 자식에서 필수 구현

}

class 자식 extends 부모{
		
}

자바스크립트에서는 private,protected,public 를 사용하지 않음
그냥 this.firstName 이렇게 사용

readonly

함수의 매개변수, 인스턴스 와 같이 변경할수 있는 변수에 const 역할을 하는 것이다.
readonly를 쓰면 말그대로 일기만 가능하고 변경이 불가능하다.
const라고 생각하면 된다.

public인데 변경을 원하지 않을때 사용한다

인터페이스

type을 정할때 기존의 있는 타입 (string,number) 말고 옵션처럼 지정을 해줄수 있다.


type color = 'red' | 'blue'

const te : color 일때 'red' 또는 'blue' 를 선택해야 한다.

interface 로 인터페이스를 지정한다.

type과 같이 타입을 지정하는 명령어 이지만
interface는 오로지 객체에서만 사용할수 있다 .
사용 방법도 다르다


type 이름 =  타입  
interfeace 이름 {키:타입, 키: 타입 }

interface는 다른 interface의 상속을 받을수 있다.
type은 별칭으로 쓴다.

interface는 같은 것을 써도 축적이 된다.

profile
프론트엔드 개발자 초보에서 고수까지!

0개의 댓글