微软作为编译器狂魔一直有一个心病,就是改良JavaScript这种语法超级烂又很多人用的编程语言,于是TypeScript诞生了

先做个对比吧:

  TS JS
语法严谨性 严谨 宽松
静态性 静态 动态
适合开发规模 大型 小型
支持类型 基本类型、泛型、implements 都不支持

下面来把ts的特点逐一介绍:

1.类型

常见的ts类型:string、number、boolean、undefined、null、void、any、enum、Array、object、Never

ts引入了类型的限制

java在声明一个变量的时候大概是这样的:

int num;

而为了更贴近js,ts声明变量的写法变成:

let num:number;

如果不加冒号声明就自动判定为any类型

2.枚举类型

enum枚举类型,是一种自己定义的类型:

enum Gender {
male=1,
female=2
} let gender:Gender; //如果想定义为male
gender = Gender.male //或者直接为 1

3.泛型

<T>泛型,其实就是制定内部东西的类型

let arr1:Array<number|string>;
let arr2:Array<number>; arr1 = [1,2,3,'sadsd'];
arr2 = [2,4,6,8]

ps: 其他数组类型写法

let arr:string[];
let arr2:[string, number, boolean] //元组 arr = ['123', '456']; // 只能是字符串
arr2 = ['123', 123, true] // 一定要按顺序和个数严格对应类型声明

4.预定义属性的类

enum Gender{male=1,female=2}

class Person {
age:number;
gender:Gender;
constructor(age:number,gender:Gender) {
this.age = age;
this.gender = gender
}
eat(str) {
console.log('我吃' + str)
}
}

Person的属性需要在constructor外先做定义,而且定义了之后不允许像js那种装饰者模式那样再添加新的属性:

let person = new Person(18, 1)

person.height = 180 //编译报错,说person没有height这个类型

至于extends和es6没什么区别,接下来要说的是implements

5.接口/实现

implements接口(实现)是强制一个class必须要implements的所有属性和方法

enum Gender{male=1,female=2}

class Person {
constructor(age:number,gender:Gender) {
this.age = age;
this.gender = gender
}
age:number;
gender:Gender;
eat(str) {
console.log('我吃' + str)
}
}
//Adult继承字Person
class Adult extends Person {
constructor(age:number, gender:Gender) {
super(age,gender)
this.age = 1
}
earnMoney(){
console.log('我赚钱')
}
}
//Hero实现Adult,就必须手动加齐Adult自己新加的属性和方法和Adult继承自Person的属性和方法
class Hero implements Adult {
age:number;
gender:Gender;
constructor() {
this.age = Infinity
this.gender = Gender.male
}
earnMoney() {
console.log('我超级赚钱')
}
eat(){
console.log('我超级吃东西')
}
}

6. 默认参数和可选参数

function test(name: string = '哈哈', age ?:number) {
if (age) {
return name
}
return name + age;
} test()

7. 类型断言

let age:any = '555';

(<string>age).substr(0, 2)
(age as string).substr(0, 2)

typescript简介的更多相关文章

  1. Learining TypeScript (一) TypeScript 简介

    Learining TypeScript (一) TypeScript 简介 一.TypeScript出现的背景    2 二.TypeScript的架构    2 1.    设计目标    2 2 ...

  2. 转载:TypeScript 简介与《TypeScript 中文入门教程》

    简介 TypeScript是一种由微软开发的自由和开源的编程语言.它是JavaScript的一个超集,而且本质上向这个语言添加了可选的静态类型和基于类的面向对象编程.安德斯·海尔斯伯格,C#的首席架构 ...

  3. 1 TypeScript 简介与安装

    简介: TypeScript 是一种由微软开发维护的自由和开源的编程语言,它是JavaScript的一个超集,支持可选的类型检查,扩展了JavaScript的语法,支持JavaScript的所有语法和 ...

  4. 001.TypeScript简介.md

    TypeScript是一门开源的,由微软开发维护的,发布于2012年10月的静态类型的语言: 他是ECMAScript的超集,支持JavaScript的所有语法和语义,并且在此基础之上提供了更多额外的 ...

  5. 从 JavaScript 到 TypeScript

    本文首发在我的个人博客:http://muyunyun.cn/posts/66a54fc2/ 文中的案例代码已经上传到 TypeScript TypeScript 并不是一个完全新的语言, 它是 Ja ...

  6. 【原】无脑操作:TypeScript环境搭建

    概述:本文描述TypeScript环境搭建,以及基于VSCode的自动编译设置和调试设置.网络上很多相应文章的方式过时了或者无法试验成功. ------------------------------ ...

  7. 第一章 Typescript 介绍

    Typescript 介绍 一.Typescript 简介 Typescript 是微软开发的 Javascript 的超集,Typescript 兼容 Javascript,可以载入 Javascr ...

  8. TypeScript学习笔记—函数

    函数定义 在 JavaScript 中,有两种常见的定义函数的方式——函数声明(Function Declaration)和函数表达式(Function Expression): // 函数声明(Fu ...

  9. TypeScript学习笔记—数据类型

    TypeScript 数据类型 Boolean 类型 let isDone: boolean = false; // tsc => var isDone = false; Number 类型 l ...

随机推荐

  1. C++学习-9

    友元主要用于访问私有变量,友元函数跟所在位置的权限没有任何关系friend+函数声明 友元类通常设计为一种对数据操作或类之间传递消息的辅助类(注意一下顺序) Explicit就是要求严格的匹配,不允许 ...

  2. 精解Mat类(一):基本数据类型-固定大小的 矩阵类(Matx) 向量类(Vector)

    一.基础数据类型 1.(基础)固定大小矩阵类 matx 说明: ①    基础矩阵是我个人增加的描述,相对于Mat矩阵类(存储图像信息的大矩阵)而言. ②    固定大小矩阵类必须在编译期间就知晓其维 ...

  3. 今天给大家分享用Python matplotlib来写随机漫步的小程序

    先安装两个库: pip install matplotlib pip install numpy 引用库: import matplotlib.pyplot as mp import numpy as ...

  4. CentOS7.4安装MySQL踩坑记录

    CentOS7.4安装MySQL踩坑记录 time: 2018.3.19 CentOS7.4安装MySQL时网上的文档虽然多但是不靠谱的也多, 可能因为版本与时间的问题, 所以记录下自己踩坑的过程, ...

  5. 利用CDLinux里面的水滴破解路由器密码的教程

    工具: 1.CDLinux系统镜像(网上有很多,这里我提供一个我使用的:http://yunpan.cn/cFgIifL8s6zUF 访问密码 a0ef) 2.U盘一个,不需要很大.(可以使用虚拟机安 ...

  6. Mimikatz的使用心得

    Mimikatz是一款由法国人编写的轻量级调试工具,但更为人所知的是使用Mimikatz来获取Windows的明文密码. 这个软件的作者博客:http://blog.gentilkiwi.com/mi ...

  7. vue.js设置、获取、删除cookie

    项目需要前端获取后台返回的cookie,并以此作判断.我是在main.js入口文件下使用的 具体代码: new Vue({ el: '#app', router, template: '<App ...

  8. JAVA:一篇文章理清多态

    很多人总是喜欢,或者说错误地将JAVA中的多态理解得很复杂,最常见的错误说法就是所谓"方法的多态",他们会给出类似下面的例子来佐证"多态是指方法的多态": // ...

  9. 20165226 预备作业3 Linux安装及学习

    20165226 预备作业3 Linux安装及学习 Linux安装 一.下载安装VirtualBox 1.首先在官网下载,点开基于VirtualBox虚拟机安装Ubuntu图文教程 找到版本进行下载安 ...

  10. Mysql语句的执行过程

    当你希望MySQL能够以更高的性能运行查询时,最好的办法是弄清楚MySQL是如何优化和执行查询.<高性能MySQL> MySQL客户端与服务器端的通信特点 客户端与服务器之间是半双工通信, ...