typescript 入门教程三

2019-11-01 admin
类型别名

下面的代码将string类型赋值给一个别名,以后如果出现别名的地方,就好比出现类型string,同理其他类型也一样

 type Name=string
 let gender:Name='男'

file

接口

接口定义一些规范,实现该接口必须要实现该接口定义的规范 一个class可以实现多个接口,但是一个class只能继承一个类

interface INamed{
    name:string
    // 注意没有方法体,在具体的对象中实现方法体
    print():void
}
const sayName=(o:INamed)=>{
    o.print()
}
const person={
    age:27,
    name:'jack',
    print:function(){
        console.log(this.name)
    }
}
sayName(person)

一个类可以实现一个或者多个接口,前提是必须实现接口中的每一个属性和方法,但是类中也可以有自己的属性和方法

 interface Person{
     name:string
     greeting():void
 }
//  类实现接口,一个接口可以供多个类实现
 class Employee implements Person{
    name:string='Jack';
    greeting():void {
        console.log('我是一个employee')
    };
 }
 let em:Employee=new Employee()
 em.greeting()
可选属性:

表示一个属性或者方法是可有可无,在属性名后面加个?

interface Person{
    first_name:string
    last_name?:string
        print?():void
}
let p={
    first_name:'Tome',
    last_name:'Jack'
}
const sayName=(o:Person)=>{
    console.log(o.first_name)
}
sayName(p)

file

tip:

  • 在使用ts过程中,推荐一款工具,可以在编译ts之后,自动执行编译出来的js文件,ts-node
  • 在使用node的环境中,比如运行一个编译好的js文件,通常通过node index.js,这时特别推荐nodemon,他会监听文件的修改,只要文件有所修改,就会自动重启服务器,相当于我们使用的热更新

扫码关注公众号,有更多精彩文章等你哦

file

[转载]原文链接:https://segmentfault.com/a/1190000020884710

本站文章除注明转载外,均为本站原创或编译。欢迎任何形式的转载,但请务必注明出处。

转载请注明:文章转载自 JavaScript中文网 [https://www.javascriptcn.com]

本文地址:https://www.javascriptcn.com/read-78770.html

文章标题:typescript 入门教程三

相关文章
Grunt入门教程(自动任务运行器)
在Javascript的开发过程中,经常会遇到一些重复性的任务,比如合并文件、压缩代码、检查语法错误、将Sass代码转成CSS代码等等。通 常,我们需要使用不同的工具,来完成不同的任务,既重复劳动又非常耗时。Grunt就是为了解决这个问题而...
2017-03-27
使用 TypeScript 构建 Koa2 项目的最佳实践
the best practice of building Koa2 with TypeScript. 中文 usage clone repo. git clone git@github.com:DhyanaChina/koa2-type...
2018-02-27
Windows系统下Node.js的简单入门教程
随着近日Paypal和Netflix宣告 迁移到Node.js, 服务器端Javascript平台已经证明其自身在企业领域的价值. 这对于Node来说是一小步,对于Javascript而言却是一大跨越啊! 来自.NET, Java, PHP...
2017-03-24
c#程序员对TypeScript的认识过程
简介 TypeScript一直发展不错,我们公司在开发新功能时,考虑到程序的可维护性,使用了TypeScript编写浏览器上的程序,我们是从零开始使用TypeScript,甚至我连javascript也是半罐子,本文描述了一个c#程序员认识...
2017-03-25
JS时间特效最常用的三款
为大家分享的JS时间特效代码如下 <head> <title>3个最常用的JS时间特效</title> </head> <body> <table w...
2017-03-29
Eloquent JavaScript 第三版草稿
When action grows unprofitable, gather information; when information grows unprofitable, sleep. A program is many things...
2018-02-08
TypeScript 中接口详解
在 TypeScript 中,接口是用作约束作用的,在编译成 JavaScript 的时候,所有的接口都会被擦除掉,因为 JavaScript 中并没有接口这一概念。 先看看一个简单的例子: function printLabel(labe...
2017-03-25
TypeScript 不适合在 vue 业务开发中使用吗? - 尤雨溪的回答 - 知乎
必须要承认的是,2.x 的 TS 支持显然跟 React 和 Angular 是有差距的,这也是为什么 3.0 要加强这一块。 关于目前 2.x 跟 TS 的整合,通常需要基于 vue-class-component 来用基于 class ...
2019-02-09
理解JavaScript的变量的入门教程
变量是用于存储信息的容器: 还记得在学校里学过的代数吗? 当您回忆在学校学过的代数课程时,想到的很可能是:x=5, y=6, z=x+y 等等。 还记得吗,一个字母可以保存一个值(比如 5),并且可以使用上面的信息计算出 z 的值是 11。...
2017-03-27
揭秘携程三端通用框架中的CRNWEB
作者简介 郑勇,携程高级技术经理,目前主要负责CRNWEB框架的开发工作,以及在携程内部的使用推广和性能优化。 前言 React-Native自从2015年推出,就一直火到了现在,一度在技术圈言必RN,激发一波广泛的思潮。携程基础业务研发团...
2018-04-25
回到顶部