선택적 프로퍼티: ?

인자를 넘겨도 되고 안넘겨도 될때 ?로 표현한다.

interface SquareConfig {
  color? : string;
  width? : number;
}

function createSquare (config:SquareConfig):{color:string; area:number} {
  let newSqu = {color : 'white', area : 100}; // 리턴할 값의 초기값
  if (config.color) return newSqu.color = config.color;
  if (config.width) return newSqu.area = config.width*config.width;
  return newSqu;
}

createSquare({color:'blcak'}); // {color:'black', area : 100}

초과 프로퍼티

인터페이스에 지정한 프로퍼티이외에 값이 인자로 들어왔을때, js에서는 조용히 무시하고 넘어간다. 하지만 ts에서는 해당 프로퍼티가 없다는 오류가 발생한다.

interface SquareConfig {
  color? : string;
  width? : number;
}

function createSquare (config:SquareConfig):{color:string; area:number} {
  let newSqu = {color : 'white', area : 100}; // 리턴할 값의 초기값
  if (config.color) return newSqu.color = config.color;
  if (config.width) return newSqu.area = config.width*config.width;
  return newSqu;
}

createSquare({colllor:'blcak'}); 
// error: Object literal may only specify known properties,
// but 'colllor' does not exist in type 'SquareConfig'. Did you mean to write 'color'?

createSquare() 함수를 호출할때 이름을 colllor 로 잘못 입력했때 오류 내용을 확인하자.

초과 프로퍼티 무시하기

1. as <인터페이스명>

let mySquare = createSquare({ width: 100, opacity: 0.5 } as SquareConfig);

예제와 같이 as <인터페이스명>을 사용하여 조용히 넘어가도록 한다.

2. 인터페이스 내부 속성 추가

interface SquareConfig {
   color?: string;
   width?: number;
   [propName: string]: any;
}

3. 인터페이스를 변수에 할당

let squareOptions = { colour: "red", width: 100 };
let mySquare = createSquare(squareOptions);

읽기전용 프로퍼티: readonly

readonly 키워드를 사용해 읽기전용 프로퍼티를 나타낸다.

값을 할당 한 이후 수정이 불가능 하다.

interface Point {
  readonly x : number;
  readonly y : number;
}


let p1:Point = {x:10, y:20};
p1.x = 5 // 10에서 5로 값을 변경하려 하지만 오류가 발생한다.

배열 : ReadonlyArray

let a: number[] = [1,2,3,4];
let ro: ReadonlyArray<number> = a;

ro[0] = 12; // error
ro.push(5) // error
ro.length = 100; // error
a = ro; // error

a = ro as number[]; // 타입단언(type assertion)으로 덮어씨가는 가능!

const vs readonly

• const : 변수 값 변경하지 않기 위해 사용
• readonly : 프로퍼티(속성)을 변경하지 않기 위해 사용

함수타입

인덱서블 타입

클래스타입

클래스 스태틱과 인스턴스의 차이점

인터페이스 확장하기

하이브리드 타입

클래스확장 인터페이스