• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    公众号

5分钟上手TypeScript

原作者: [db:作者] 来自: [db:来源] 收藏 邀请

安装TypeScript

安装这个工具有两种方式:

  • 用npm安装npm install -g typescript
  • 安装visual studio的TypeScript插件

编译TypeScript

用TypeScript写的文件的后缀名是.ts,需要使用tsc 文件名.ts来编译成JavaScript文件,运行tsc test.ts命令会在当前目录下创建一个同名的JavaScript文件

类型注解

TypeScript的类型注解是一种轻量级的为函数和变量添加约束的方式。

//这里限制person是一个字符串
function greeter(person: string) {
    return "Hello, " + person;
}

let user = ‘fff’;

document.body.innerHTML = greeter(user);

接口

//这里定义了包含firstName和lastName两个字段的Person接口
interface Person{
    firstName:string,
    lastName:string
}
const person1 = {
    firstName:'tom',
    lastName:'jedt'
};
//但是在使用的时候,没有像java还需要使用implements语句,直接使用Person即可。
function consolePerson(person:Person){
    return person.firstName+person.lastName;
}
console.log(consolePerson(person1));

只要两个类型在内部的结构是兼容的,那么这两个类型就是兼容的,如上面的例子,在使用Person的时候,保证了person1是一个对象,而且内部的两个字段都是字符串类型的。

TypeScript支持JavaScript的新特性,如基于类的面向对象编程

class Student{
    fullName:string;
    constructor(public firstName,public middleName,public lastName){
        this.fullName = firstName + " " + middleName + " " + lastName;
    };
    public getFullName(){
        return this.fullName;
    }
}

interface OnePerson{
    firstName:string,
    lastName:string
}

function showPerson(person:OnePerson,fullName:Function){
    return person.firstName + person.lastName + fullName;
}
const xiao = new Student("top1","ttt","sportswell");
console.log(showPerson(xiao,xiao.getFullName));

类和接口可以一起使用,特别好用的是TypeScript的类型注解。


鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
上一篇:
typescript之defaultProps发布时间:2022-07-18
下一篇:
TIOBE 7 月编程语言榜:TypeScript 进入前 50 名发布时间:2022-07-18
热门推荐
热门话题
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap