Interfaces in TypeScript

typescript-interfaces.ts

// See blog post at https://ketuma.com/lessons/typescript-interfaces

//Interfaces

interface Account {
  name: string
  amount: number
  accountNumber: string
}

function showAccount(account: Account): void {
  console.log(`${account.accountNumber}`)
  console.log(`-----`)
  console.log(`Name: ${account.name}: Cash Available: ${account.amount}`)
}

const myAccount = {
  name: 'John Smith',
  amount: 35000,
  accountNumber: 'BankId-452938382892',
  date: '2022-08-08'
}

showAccount(myAccount)

//------------------------------------------------------------------------

interface Account {
  name: string
  amount: number
  accountNumber: string
  date?: string
}

//------------------------------------------------------------------------

interface Car {
  transmission: string
  readonly motor: string
  readonly tireCount: number
}

let audi: Car = {
  transmission: 'automatic',
  motor: 'V6 Engine',
  tireCount: 4
}

audi.transmission = 'manual' // OK
audi.tireCount = 6 // Error (readonly property)

//------------------------------------------------------------------------

interface Account {
  name: string
  amount: number
  accountNumber: string
}

function showAccount(account: Account): void {
  console.log(`${account.accountNumber}`)
  console.log(`-----`)
  console.log(`Name: ${account.name}: Cash Available: ${account.amount}`)
}

showAccount({
  name: 'John Smith',
  amount: 35000,
  accountNumber: 'BankId-452938382892',
  date: '2022-08-08'
}) // Error, because date is not in the Account interface

//------------------------------------------------------------------------

//First method
showAccount({
  name: 'John Smith',
  amount: 35000,
  accountNumber: 'BankId-452938382892',
  date: '2022-08-08'
} as Account)

//Second method
interface Account {
  name: string
  amount: number
  accountNumber: string
  [propName: string]: any
}

//------------------------------------------------------------------------

interface Account {
  name: string
  amount: number
  accountNumber: string
}

const myAccount = {
  name: 'John Smith',
  amount: 35000,
  accountNumber: 'BankId-452938382892',
  date: '2022-08-08'
}

showAccount(myAccount) // No errors since we are not using object literals.

//------------------------------------------------------------------------

interface HashFunc {
  (text: string, toString: boolean, seed: number): string | number
}

const createHash: HashFunc = (str, toString, seed) {
  let i, l, hVal = (seed === undefined) ? 0x811c9dc5 : seed

  for (i = 0, l = str.length; i < l; i++) {
    hVal ^= str.charCodeAt(i)
    hVal += (hVal << 1) + (hVal << 4) + (hVal << 7) + (hVal << 8) + (hVal << 24)
  }
  if( toString ){
    // Convert to 8 digit hex string
    return ("0000000" + (hVal >>> 0).toString(16)).substr(-8);
  }
  return hVal >>> 0;
}

const hash: string | number = createHash('John Smith', true, 10)
console.log(hash) // "b4fa3b8c"

//------------------------------------------------------------------------

interface TsArray {
  [index: number]: string
}

const teachers: TsArray = ['Mike', 'Thomas', 'Michael', 'John']
const principal: string = teachers[2]
console.log(principal) // 'Michael'

//------------------------------------------------------------------------

interface CarInterface {
  color: string
  make: string
  model: string
  start(key: number): void
}

class Car implements CarInterface {
  color: string
  make: string
  model: string

  constructor(color: string, make: string, model: string) {
    this.color = color
    this.make = make
    this.model = model
  }

  start(key: number) {
    console.log(`Starting car with code number ${key}`)
  }
}

//------------------------------------------------------------------------

interface CarInterface {
  color: string
  make: string
  model: string
  start(key: number): void
}

interface CarConstructor {
  new (color: string, make: string, model: string)
}

const Car: CarConstructor =  class Car implements CarInterface {
  color: string
  make: string
  model: string

  //Parameter names don't have to match the interface names
  constructor(clr: string, mke: string, mdl: string) {
    this.color = clr
    this.make = mke
    this.model = mdl
  }

  start(key: number) {
    console.log(`Starting car with code number ${key}`)
  }
}

//------------------------------------------------------------------------

interface Limbs {
  legCount: number
  hasHands: boolean
}

interface Head {
  eyeCount: number
  headShape: string
}

interface Animal extends Limbs, Head {
  name: string
}

let human = {} as Animal
human.legCount = 2
human.hasHands = true
human.eyeCount = 2
human.headShape = 'Oval'
human.name = 'Homo Sapiens'