前言

上一篇结束後已经将型别部分，大致上了解差不多了，铁人文章也来到一半了。今天开始下半部的铁人，会比较有趣吗？ 让我们继续看下去。

认识 Interface

interface 是用来定义物件的资料型别。简单来说，事先约定好某个物件会是什麽样的资料格式，其属性的型别为何。如果有违反这个规定，就会进行提醒有误。

interface 第一个字母会是大写，且只用来定义描述。

Interface 宣告

建立一个 PersonDetail 介面，并描述里面的属性 name、 phone、skills、checkDault 。

interface PersonDetail {
  name: string
  phone: number
  skills: string[]
  checkDault: (age: number) => void 
}

接下来定义一个变数 cy ，挂上 PersonDetail 规则。

// 正常运行
const cy: PersonDetail = {
  name: 'cy',
  phone: 123456789,
  skills: ['Ruby', 'JavaScript'],
  checkDault: (age) => (age < 18 ? console.log('Not adult') : console.log('Adult'))
}

console.log(cy)
// {
  name: 'cy',
  phone: 123456789,
  skills: [ 'Ruby', 'JavaScript' ],
  checkDault: [Function: checkDault]
}
cy.checkDault(20) // Adult

如果缺少属性

如果型别错误

选用属性(Optional Properties)

当我们有一些属性不是必须的，这个时候我们可以在属性名称後面加上 ?，该属性就可以赋予弹性给予。

interface PersonDetail {
  name: string
  phone: number
  skills?: string[]
  checkDault: (age: number) => void 
}

const cy: PersonDetail = {
  name: 'cy',
  phone: 123456789,
  // 少了 skills 属性
  checkDault: (age) => (age < 18 ? console.log('Not adult') : console.log('Adult'))
}

从上面程序码可以发现，少了 skills 属性，依然不会喷错

唯读属性(Readonly properties)

如果打算第一次赋值後，不再被修改，就可以使用 唯读属性 使用方始要在该属性前面加上 readonly 即可。

interface PersonDetail {
  readonly name: string
  phone: number
  skills?: string[]
  checkDault: (age: number) => void 
}

const cy: PersonDetail = {
  name: 'cy',
  phone: 123456789,
  skills: ['Ruby', 'JavaScript'],
  checkDault: (age) => (age < 18 ? console.log('Not adult') : console.log('Adult'))
}

cy.name = 'CY' // 喷错

结语

今天初步介绍 interface 的使用，还有如果有不同条件需求下该如何调整的方式，希望大家可以一起来尝试看看，我们明天继续努力能手之旅。