Skip to content

接口与函数

接口

TypeScript的核心原则之一是对值所具有的结构进行类型检查。
它有时被称做“鸭式辨型法”或“结构性子类型化”。
在TypeScript里,接口的作用就是为这些类型命名和为你的代码或第三方代码定义契约。

  • 对对象的形状(shape)进行描述
  • Duck Typing(鸭子类型)
1
2
3
4
5
6
7
8
9
interface Person {
  name: string;
  age: number;
}

let zyz: Person = {
  name: 'zyz',
  age: 20,
}
1
2
3
4
5
6
7
8
interface Person {
  name: string;
  age?: number;
}

let zyz: Person = {
  name: 'zyz',
}
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
interface Person {
  readonly id: number;
  name: string;
  age?: number;
}

let zyz: Person = {
  id: 1,
  name: 'zyz',
}
zyz.id = 233  // error TS2540: Cannot assign to 'id' because it is a read-only property

函数

1
2
3
4
function add(x: number, y: number): number {
  return x + y
}
add(1, 2)
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
function add(x: number, y: number, z?: number): number {
  if (typeof z === 'number') {
    return x + y + z
  }
  return x + y
}
add(1, 2)
let restult = add(1, 2, 5)
console.log(restult)
// 8
1
2
3
4
5
6
7
8
const add = (x: number, y: number, z?: number): number => {
  if (typeof z === 'number') {
    return x + y + z
  }
  return x + y
}
console.log(add(1, 2))
// 3
1
2
3
4
5
6
7
8
const add = (x: number, y: number, z?: number): number => {
  if (typeof z === 'number') {
    return x + y + z
  }
  return x + y
}

let add2: (x: number, y: number, z?: number) => number = add
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
const add = (x: number, y: number, z?: number): number => {
  if (typeof z === 'number') {
    return x + y + z
  }
  return x + y
}
interface Isum {
  (x: number, y: number, z?: number): number
}
let add2: Isum = add

类型推断

1
2
3
let str = 'str'
console.log(typeof str)
// string
1
2
let str = 'str'
str = 123   // error TS2322: Type '123' is not assignable to type 'string'.

联合类型

1
2
3
4
5
let numberOrString: number | string
numberOrString = 'abc'
numberOrString = 123
console.log(numberOrString.toString())  // 123
console.log(numberOrString.length)    //  error TS2339: Property 'length' does not exist on type 'number'.

类型断言

1
2
3
4
5
6
7
8
9
function getLength(input: string | number) : number {
  const str = input as string
  if (str.length) {
    return str.length
  } else {
    const number = input as number
    return number.toString().length
  }
}

type guard

1
2
3
4
5
6
7
function getLength(input: string | number) : number {
  if (typeof input === 'string') {
    return input.length
  } else {
     return input.toString().length
  }
}