接口:用来建立某种代码约定,使得其他开发者在调用某个方法或创建新的类时必须遵循接口所定义的代码约定
 
在js里面没有接口这个概念,在ts里面通过两个关键字来支撑接口这个特性
 
interface
interface IPerson {
name: string;
age: number;
}

在接口里面,和类一样,我们可以声明一些属性

class Person {
constructor(public config: IPerson) {}
}

我们再声明一个类,这个类里面接收一个IPerson类型的参数,这时候,我们看到了接口的第一个用法,它作为一个方法参数的类型声明。这个时候去调用的时候,它会去检查,是不是接口声明的那些树形,比如

var p1 = new Person({
name: 'zina',
age: 18
})
只有这样才不报错,如果多传一个属性或少传一个属性都会报错。这是接口的第一个用法。当你的接口用作方法的参数的类型声明时,在调用的时候,ts会去检查你传入的这个参数,是否满足接口所声明的所有属性
implements

interface Animal {
eat();
}
class Sheep implements Animal{ }
这里我们声明了一个Animal的接口,它有个方法叫做eat。再声明了一个类,这里有个关键字implements。它是声明Sheep这个类实现Animal这个接口。
当一个类实现一个接口的时候,它必须实现这个接口里声明的方法
interface Animal {
eat();
} class Sheep implements Animal{
eat() {
console.log('im eat grass')
}
} class Tiger implements Animal{
eat() {
console.log('i eat meat')
}
}

typescript 接口的更多相关文章

  1. 从C#到TypeScript - 接口

    总目录 从C#到TypeScript - 类型 从C#到TypeScript - 高级类型 从C#到TypeScript - 变量 从C#到TypeScript - 接口 从C#到TypeScript ...

  2. 《三》大话 Typescript 接口

    > 前言: 本文章为 TypeScript 系列文章. 旨在利用碎片时间快速入门 Typescript. 或重新温故 Typescript 查漏补缺.在官方 api 的基础上, 加上一些日常使用 ...

  3. TypeScript接口与类的使用

    一.TypeScript接口 Interfaces 可以约定一个对象的结构 一个对象去实现一个接口 就必须拥有这个接口中所有的成员用interface定义接口, 并且定义接口中成员的类型 编译之后会发 ...

  4. TypeScript 接口继承

    1.TypeScript 接口继承 和类一样,接口也可以通过关键字 extents 相互继承.接口继承,分为:单继承和多继承,即继承多个接口.另外,接口也可以继承类,它会继承类的成员,但不包括具体的实 ...

  5. typescript接口(学习笔记非干货)

    typescript的核心原则之一就是对所具有的shape类型检查结构性子类型化 One of the core principles of typescript is to check struct ...

  6. typescript接口的概念 以及属性类型接口

    /* 1.vscode配置自动编译 1.第一步 tsc --inti 生成tsconfig.json 改 "outDir": "./js", 2.第二步 任务 ...

  7. Typescript 接口(interface)

    概述 typescript 的接口只会关注值的外形,实际就是类型(条件)的检查,只要满足就是被允许的. 接口描述了类的公共部分. 接口 interface Person { firstName: st ...

  8. TypeScript 接口(三)

    TypeScript的核心原则之一是对值所具有的结构进行类型检查. 接口初始: interface objProperty { name: string } function printName(na ...

  9. typescript接口扩展

    /* typeScript中的接口 接口扩展 */ /* 接口的作用:在面向对象的编程中,接口是一种规范的定义,它定义了行为和动作的规范,在程序设计里面,接口起到一种限制和规范的作用.接口定义了某一批 ...

  10. TYpeScript接口的使用

    1.接口中的属性值的使用: // 作用是强制类型检查 interface Iperson { name: string; age: string; } class Person { construct ...

随机推荐

  1. [LeetCode] 95. Unique Binary Search Trees II 唯一二叉搜索树 II

    Given n, generate all structurally unique BST's (binary search trees) that store values 1...n. For e ...

  2. 【SSH进阶之路】Spring的IOC逐层深入——为什么要使用IOC[实例讲解](二)

    上篇博客[SSH进阶之路]Spring简介,搭建Spring环境——轻量级容器框架(一),我们简单的介绍了Spring的基本概念,并且搭建了两个版本的Spring开发环境,但是我们剩下了Spring最 ...

  3. 【视频开发】【计算机视觉】doppia编译之三:编译安装opencv库

    这里我介绍2种方法 (1)利用别人写好的脚本编译,相对来说省力一点  上Github下载别人写好的脚本文件,网址 https://github.com/jayrambhia/Install-OpenC ...

  4. npm创建angular项目

    1.首先保证你本地的 node 环境 是ok的哦. 2.安装 angular-cli    命令  npm install -g @angular/cli.安装完成后,ng version 查看版本, ...

  5. hadoop进阶---hadoop性能优化(一)---hdfs空间不足的管理优化

    Hadoop 空间不足,hive首先就会没法跑了,进度始终是0%. 将HDFS备份数降低 将默认的备份数3设置为2. 步骤:CDH–>HDFS–>配置–>搜索dfs.replicat ...

  6. Fineui 解决OnClientClick中无论是返回true或false,都依然执行后台代码的问题

    有时写js代码验证数据,需要在OnClientClick中执行,如果符合条件执行后台代码,不符合则不触发后台代码.刚开始的时候无论返回true或false都会执行后台代码(asp.net写法),看了h ...

  7. Vue框架 03

    Vue项目开发: 前后端完全分离 后端:提供接口数据 前端:页面转跳.页面布局.页面数据渲染全部由前端做 中间交互:请求 搭建Vue项目环境: Vue项目需要自建服务器:node node介绍: 1. ...

  8. Find the median(线段树+离散化)(2019牛客暑期多校训练营(第七场))

    题目出处:Find the median 示例: 输入: 53 1 4 1 5 92 7 1 8 2 9 输出:3 4 5 4 5 说明:L = [3, 2 ,4, 1, 7],R = [4, 8, ...

  9. SpringBoot 常用配置 静态资源访问配置/内置tomcat虚拟文件映射路径

    Springboot 再模板引擎中引入Js等文件,出现服务器拒绝访问的错误,需要配置过滤器 静态资源访问配置 @Configuration @EnableWebMvc public class Sta ...

  10. java 堆 排序学习

    /** * <html> * <body> * <P> Copyright 1994 JsonInternational</p> * <p> ...