TypeScript Functions

Posted on Edited on In

Function Types

Typing the function

1
2
3
4
5
6
7
function foo(x: number, y: string): string {
  return x + y
}

let fo = function (x: number, y: string): string {
  return x + y
}

Writing the function type

1
2
3
4
5
6
let foo: (x: number, y: string) => string = function (
  x: number,
  y: string
): string {
  return x + y
}

Inferring types

1
2
3
let foo: (x: number, y: string) => string = function (x, y) {
  return x + y
}

Optional and Default Parameters

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
function getName(firstName: string, lastName?: string): string {
  if (lastName) {
    return firstName + " " + lastName
  } else {
    return firstName
  }
}

getName("Edward")
getName("Edison", undefined)
getName("Jack", "Li")
getName("Jack", "R", "Li") // error, too many parameters.

function buildName(firstName: string, lastName: string = "Li"): string {
  if (lastName) {
    return firstName + " " + lastName
  } else {
    return firstName
  }
}

buildName("Edward")
buildName("Edison", undefined)
buildName("Jack", "Li")
buildName("Jack", "R", "Li") // error, too many parameters.

Rest Parameters

1
2
3
4
5
6
7
function buildName(firstName: string, ...restOfName: string[]): string {
  return firstName + " " + restOfName.join(" ")
}
let buildNameFun: (firstName: string, ...restOfName: string[]) => string =
  buildName

console.log(buildName("Jack", "R", "Chen"))

this and arrow functions

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
let deck = {
  suits: ["hearts", "spades", "clubs", "diamonds"],
  cards: Array(52),
  createCardPicker: function () {
    // NOTE: The arrow function allowing us to capture 'this' right here
    return () => {
      let pickedCard = Math.floor(Math.random() * 52)
      let pickedSuit = Math.floor(pickedCard / 13)

      return { suit: this.suits[pickedSuit], card: pickedCard % 13 }
    }
  },
}

console.log(deck.createCardPicker()())

this parameters

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
interface Card {
  suit: string
  card: number
}

interface Deck {
  suits: string[]
  cards: number[]

  createCardPicker(this: Deck): () => Card
}

let deck: Deck = {
  suits: ["hearts", "spades", "clubs", "diamonds"],
  cards: Array(52),
  createCardPicker: function (this: Deck) {
    return () => {
      let pickedCard = Math.floor(Math.random() * 52)
      let pickedSuit = Math.floor(pickedCard / 13)

      return { suit: this.suits[pickedSuit], card: pickedCard % 13 }
    }
  },
}

console.log(deck.createCardPicker()())

Overloads

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
let suits = ["hearts", "spades", "clubs", "diamonds"]

function pickCard(x: { suit: string; card: number }[]): number
function pickCard(x: number): { suit: string; card: number }
function pickCard(x): any {
  if (typeof x == "object") {
    let pickedCard = Math.floor(Math.random() * x.length)
    return pickedCard
  } else if (typeof x == "number") {
    let pickedSuit = Math.floor(x / 13)
    return { suit: suits[pickedSuit], card: x % 13 }
  }
}

let myDeck = [
  { suit: "diamonds", card: 2 },
  { suit: "spades", card: 10 },
  { suit: "hearts", card: 4 },
]
let pickedCard1 = myDeck[pickCard(myDeck)]
console.log("card: " + pickedCard1.card + " of " + pickedCard1.suit)

let pickedCard2 = pickCard(35)
console.log("card: " + pickedCard2.card + " of " + pickedCard2.suit)