Interfeisai - aprašo, koks bus kuriamas objektas, kokie laukai ir pnš. Kuriant objektą išmes patarimus. Rodis, kad nevisi laukai užpildyti. Rodis ko reikia.

  • gali extendint
  • rekomenduojama visur naudoti interface

readonly - tik skaitymui

? - nebūtinas

interface Rect {
  readonly id: string
  color?: string
  size : {
    width: number
    height: number
  }
}
const rect1: Rect = {
 id: '1234',
 size: {
  width: 20,
  height: 30
 },
 color: '#ccc'
}

Neprivalomus parametrus galima nurodyti ir vėliau

const rect2: Rect = {
 id: '12345',
 size: {
  width: 10,
  height: 5
 }
}

rect2.color = 'black'

Jeigu masyvas arba objektas, tai galime keisti vidinius duomenis, bet pakeisti ne.

Galime ir taip:

const rect3 = {} as Rect

Arba old stylium

const rect4 = <Rect>{}

Praplečiame jau turimą interfeisą:

interface RectWithArea extends Rect {
 getArea: () => number
}

const rect5: RectWithArea = {
 id: '123',
 size: {
  width: 20,
  height: 20
 },

 getArea(): number {
  return this.size.width * this.size.height
 }

}

Sutarta interfeisus vadinti pradedant I - interface

interface IClock {
 time: Date
 setTime(date: Date): void
}

realizuojamas interfeisas.

klasė Clock turi implementuoti IClock interfeisą.

class Clock implements IClock {
 time: Date = new Date()
 setTime(date: Date): void {
  this.time = date
 }

Jei bus objektas ir daug dinaminių raktų

interface Styles {
 border: string
}

const css = {
 border: '1px solid black',
 marginTop: '2px',
 borderRadius: '5px'
}

neefektyvu butu vardinti visus css.

sprendimas :

interface Styles {
 [key: string]: string
}
const css: Styles = {
 border: '1px solid black',
 marginTop: '2px',
 borderRadius: '5px'
}
interface Test {
a: number
}

interface Test {
b: number
}

interface SuperTest extends Test { -> bus abu pasiekti ir a ir b

point as IDCPoint; - nors pointas yra IPoint, bet ID3Poit extendino IPoint todel galiam ir tiap prilyginti

const c = (point: IPoint) => {
const d: ID3Point = point as IDCPoint;
}

constr myCanvas = document.GetElementById('canvas') ---> myCanvas HTMLElement

constr myCanvas = document.GetElementById('canvas') as HTMLCanvasElement -> myCanvas HTMLCanvasElement