TypeScript : interface(接口) 与 type(类型别名)

// 教学
  // Utility types
  // Parameters 是 Utility types 其中的一个

  // 联合类型
  let myFavoriteNumber: string | number
  myFavoriteNumber = 'seven'
  myFavoriteNumber = 7
  // 不能将类型“{}”分配给类型“string | number”。
  // myFavoriteNumber = {}

  // 此刻我们再定义一个jackFavoriteNumber 此刻的类型也是 string | number 它与 myFavoriteNumber 的类型是一模一样的
  // 那么我们能不能将 string | number 抽象出来,其实可以的,我们此刻就可以使用【类型别名】
  let jackFavoriteNumber: string | number

  let woman: Person
  woman = 7

  let man: Person
  man = 'faith'

  // 【类型别名】使用type定义的就是类型别名,在很多很多场景在 interface 与 type 都可以互换的

interface与type有什么区别?
interface与type(类型别名)是有很多细微的区别的,在我们日常的开发中是很少能够感受到的,有两个主要的区别在开发中能够轻易的感受到的

1、定义联合类型

 let myFavoriteNumber: string | number
这个在interface是做不到的,interface是无法替代的

2、Utility types, interface也无法实现Utility types
在我们使用 parameters ,就是使用了type类型别名的特性

  • 使用Utility types下的 Parameters
export const http = async (endpoint: string, { data, token, headers, ...customConfig }: Config) => {
    // xxx
    // xxx
}

  return ([endpoint, config]: Parameters) => {
    http(endpoint, { ...config, token: user?.token })
  }
}

    type Person = {
      name: string,
      age: number
    }

    const faith: Person = {
      name: 'faith'
    }

// 此刻TS会报错, 类型 "{ name: string; }" 中缺少属性 "age",但类型 "Person" 中需要该属性。ts(2741)

// 此刻我们希望的是不改变原 Person,因为有可能是源码我们也不能去改,并且我们想只有 `name`一个key并且不报TS的错

    // 我们的方案是使用 Utility types下的 Partial
    const faith: Partial = {
      name: 'faith'
    }

// 使用Utility types下的 Omit
// 此刻我们还想使用 Person 类型,但是我们要求只有age并且是必须的
const tt: Omit = { age: 100}

// 此刻我们可以看到 Omit 只删除了一个 name,如果我们也想把 name 也删除了呢?
// 以下这句话的意思就是在 `Person` 中,将 `name` 与 `age` 都删除掉
const tt: Omit = { age: 100}

  • 使用Utility types下的 Parameters, Partial, Omit 是我们在开发中经常使用的,Partial代表可缺失,Omit是删除某些属性

你可能感兴趣的:(TypeScript : interface(接口) 与 type(类型别名))