TypeScript 是 JavaScript 的一个超集,支持 ECMAScript 6 标准

安装TypeScript

npm install -g typescript

编译

tsc app.ts
  1 let message:string = 'holle world';
2 console.log(message)
3
4 class Site{
5 name():void{
6 console.log(message)
7 }
8 }
9 let obj = new Site()
10 obj.name()
11
12 // let arr:number[] = [1,2,3]
13 let arr:Array<number> = [4,5,6]
14 console.log('数组:',arr)
15
16 let oarr:[number,string];
17 oarr = [1,'a']
18 console.log('元组:',oarr)
19
20 enum Color {Red,Green,Blue};
21 let c:Color = Color.Blue
22 console.log('枚举:',c)
23
24 let str = '1'
25 let n:number = <number> <any>str;//断言 <Type>值
26 console.log(n)
27
28 // 接口
29 interface IPerson{
30 name:string,
31 age:number,
32 sex:boolean,
33 action:(name:string)=>string
34 }
35 let xiaoming:IPerson = {
36 name:'小明',
37 age:18,
38 sex:true,
39 action:(name):string=>{
40 return '我的名字叫'+name
41 }
42 }
43 let say:string = xiaoming.action(xiaoming.name)
44 console.log(say)
45
46 // 接口和数组
47 interface namelist{
48 [index:number]:number
49 }
50 let iArr:namelist=[1,2,3];
51 // iArr["a"] = 123 //可编译通过 运行报错
52 console.log(iArr)
53
54 // 接口继承
55 interface Musician extends IPerson{
56 instrument:string
57 }
58 let xiaohong:Musician = {
59 name:'小红',
60 age:12,
61 sex:false,
62 instrument:'二胡',
63 action:(str):string=>{
64 return str
65 }
66 };
67 let say1:string = xiaohong.action('我会拉二胡');
68 console.log(xiaohong.name,say1)
69
70
71 /*
72 interface type
73 相同点
74 interface 和 type 都可以描述一个对象或者函数
75 不同点
76 type 可以声明基本类型别名,联合类型,元组等类型 进行赋值
77 interface 能够声明合并
78 */
79 type myType = {
80 name:string,
81 size:number
82 }
83 let isType:myType = {
84 name:'类型',
85 size:1
86 }
87 console.log(isType)
88
89 type alerType = 'success' | 'error' | 'info'
90 let alt:alerType;
91 // alt = 'abc' //报错
92 alt = 'success'
93 console.log('type',alt)
94
95
96 // 类
97 class Person{
98 name:string;
99 constructor(name:string){
100 this.name = name
101 }
102 sayHi():void{
103 console.log('hi,我是'+this.name)
104 }
105 }
106 let xm = new Person('小明');
107 xm.sayHi()
108
109 // 泛型
110 interface JJ{
111 JJsize:number,
112 JJlength:number
113 }
114 interface Human{
115 name:string,
116 age:number,
117 sex:string
118 }
119 function create<T extends JJ>(what:T):T{
120 return what
121 }
122
123 let ren = create({
124 name:'小明',
125 age:18,
126 sex:'男',
127 JJsize:12,
128 JJlength:18
129 })
130 console.log(ren)
131
132 function create1<T>(c: { new ()}): T {
133 return new c()
134 }
135 let cArr = create1<Array<number>>(Array)
136 cArr[0] = 1
137 // cArr[1] = '2' //报错
138 console.log(cArr)

关于声明文件:https://www.runoob.com/typescript/ts-ambient.html

搜索

复制

TypeScript 学习的随笔的更多相关文章

  1. typeScript学习随笔(一)

    TypeScript学习随笔(一) 这么久了还不没好好学习哈这么火的ts,边学边练边记吧! 啥子是TypeScript  TypeScript 是 JavaScript 的一个超集,支持 es6 标准 ...

  2. TypeScript学习指南--目录索引

    关于TypeScript: TypeScript是一种由微软开发的自由和开源的编程语言.它是JavaScript的一个超集,而且本质上向这个语言添加了可选的静态类型和基于类的面向对象编程. TypeS ...

  3. TypeScript 学习一 参数,函数,析构表达式

    1,TypeScript是由谷歌开发的,并且新出的Angular2框架就是谷歌公司由TypeScript语言编写的,所以现在TypeScript是有微软和谷歌一起支持的: 2,TypeScript在j ...

  4. TypeScript 学习资料

    TypeScript 学习资料: 学习资料 网址 TypeScript Handbook(中文版)(推荐) https://m.runoob.com/manual/gitbook/TypeScript ...

  5. Typescript 学习笔记七:泛型

    中文网:https://www.tslang.cn/ 官网:http://www.typescriptlang.org/ 目录: Typescript 学习笔记一:介绍.安装.编译 Typescrip ...

  6. Typescript 学习笔记六:接口

    中文网:https://www.tslang.cn/ 官网:http://www.typescriptlang.org/ 目录: Typescript 学习笔记一:介绍.安装.编译 Typescrip ...

  7. Typescript 学习笔记五:类

    中文网:https://www.tslang.cn/ 官网:http://www.typescriptlang.org/ 目录: Typescript 学习笔记一:介绍.安装.编译 Typescrip ...

  8. Typescript 学习笔记四:回忆ES5 中的类

    中文网:https://www.tslang.cn/ 官网:http://www.typescriptlang.org/ 目录: Typescript 学习笔记一:介绍.安装.编译 Typescrip ...

  9. Typescript 学习笔记二:数据类型

    中文网:https://www.tslang.cn/ 官网:http://www.typescriptlang.org/ 目录: Typescript 学习笔记一:介绍.安装.编译 Typescrip ...

随机推荐

  1. css流程图、步骤图,流程线与环节分别实现,支持单环节、多环节情况。scss生成CSS

    适用于分步骤操作的页面导航图 实现结果如下 上图对应下述代码,稍作修改可以生成下图.css代码如下: @charset "UTF-8"; /**单列宽度 单行高度 列数 行数*/ ...

  2. Fab 悬浮按钮

    声明,参考:https://ext.dcloud.net.cn/plugin?id=144   在 template 中使用 <template> <view> <uni ...

  3. java中如何知道一个字符串中有多少个字,把每个字打印出来,举例

    9.6 About string,"I am ateacher",这个字符串中有多少个字,且分别把每个字打印出来. public class Test {     static i ...

  4. 数据库查询中where和having的用法

    1.类型: "baiWhere"是一个约束声明,在查询数据库du的结果返回之前对数据库中zhi的查询条件进行约束dao,即在结果返回之前起作用,且where后面不能使用" ...

  5. 存储过程 psal emp.sal%type是什么意思

    psal emp.sal%type 就是指psal这个变量是引用了表emp中的sal字段的类型.如果emp表中sal的类型变了,psal这个字段的类型也会跟着变化,总之,psal和表emp中sal字段 ...

  6. Centos搭建 LAMP 服务器教程

    搭建 LAMP 服务 搭建 MySQL 数据库 安装 MySQL 使用 yum 安装 MySQL: yum install mysql-server -y 安装完成后,启动 MySQL 服务: ser ...

  7. 微信小程序,制作属于自己的Icon图标

    前言 最近在接手一个微信小程序,发现里面的图标都是使用的image组件,看起来非常别扭,加载也不太顺畅. 就想着看看微信有没有类似自带的图标库可以使用. 有是有,就是太少了,翻来翻去好像也就 8 种, ...

  8. RMI反序列化学习

    RMI学习 1.RMI简介 RMI(Remote Method Invocation),远程方法调用方法,其实就是本地java虚拟机要调用其他java虚拟机的方法,两个虚拟机可以是运行在相同计算机上的 ...

  9. SpringCloudAlibaba入门之Sentinel(SCA)

    微服务保护和熔断降级技术Sentinel 1.微服务调用存在问题 由于一个服务不可用,有可能会导致一连串的微服务跟着不可用[服务器支持的线程和并发数有限,请求一直阻塞,会导 致服务器资源耗尽,从而导致 ...

  10. Java-GUI编程之绘图

    绘图 很多程序如各种小游戏都需要在窗口中绘制各种图形,除此之外,即使在开发JavaEE项目时,有时候也必须"动态"地向客户 端生成各种图形.图表,比如 图形验证码.统计图等,这都需 ...