TypeScript 学习的随笔
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 学习的随笔的更多相关文章
- typeScript学习随笔(一)
TypeScript学习随笔(一) 这么久了还不没好好学习哈这么火的ts,边学边练边记吧! 啥子是TypeScript TypeScript 是 JavaScript 的一个超集,支持 es6 标准 ...
- TypeScript学习指南--目录索引
关于TypeScript: TypeScript是一种由微软开发的自由和开源的编程语言.它是JavaScript的一个超集,而且本质上向这个语言添加了可选的静态类型和基于类的面向对象编程. TypeS ...
- TypeScript 学习一 参数,函数,析构表达式
1,TypeScript是由谷歌开发的,并且新出的Angular2框架就是谷歌公司由TypeScript语言编写的,所以现在TypeScript是有微软和谷歌一起支持的: 2,TypeScript在j ...
- TypeScript 学习资料
TypeScript 学习资料: 学习资料 网址 TypeScript Handbook(中文版)(推荐) https://m.runoob.com/manual/gitbook/TypeScript ...
- Typescript 学习笔记七:泛型
中文网:https://www.tslang.cn/ 官网:http://www.typescriptlang.org/ 目录: Typescript 学习笔记一:介绍.安装.编译 Typescrip ...
- Typescript 学习笔记六:接口
中文网:https://www.tslang.cn/ 官网:http://www.typescriptlang.org/ 目录: Typescript 学习笔记一:介绍.安装.编译 Typescrip ...
- Typescript 学习笔记五:类
中文网:https://www.tslang.cn/ 官网:http://www.typescriptlang.org/ 目录: Typescript 学习笔记一:介绍.安装.编译 Typescrip ...
- Typescript 学习笔记四:回忆ES5 中的类
中文网:https://www.tslang.cn/ 官网:http://www.typescriptlang.org/ 目录: Typescript 学习笔记一:介绍.安装.编译 Typescrip ...
- Typescript 学习笔记二:数据类型
中文网:https://www.tslang.cn/ 官网:http://www.typescriptlang.org/ 目录: Typescript 学习笔记一:介绍.安装.编译 Typescrip ...
随机推荐
- 在linux环境下安装VMtools(成功)
想在主机和虚拟机之间互相复制文件吗? 想更加方便的联系主机和虚拟机吗? 就安装VMtools吧 其实,在linux下安装VMtools 是非常的简单,只要简单地几步就行了! 第一步:打开虚拟机,在左 ...
- MEVN 架构(MongoDB + Express + Vue + NODEJS)搭建
一个完整的网站服务架构包括:1.web frame ---这里应用express框架2.web server ---这里应用nodejs3.Database ---这里应用monggoDB4.前端展示 ...
- 【weex开发】weex官方源码
公司目前使用版本:weex_sdk:0.10.0 介绍地址:https://bintray.com/alibabaweex/maven/weex_sdk/0.18.0 weex最新版本:weex_sd ...
- getHibernateTemplate出现的所有find方法的总结
文章转自:http://www.cnblogs.com/DarrenChan/p/5528194.html 一.find(String queryString); 示例:this.getHiberna ...
- js多线程worker
参考地址:https://blog.csdn.net/huang100qi/article/details/89303555?utm_source=app https://www.cnblogs.co ...
- SpringBoot2.x修改Redis序列化方式
添加一个配置类即可: /** * @Author FengZeng * @Date 2022-03-22 13:43 * @Description TODO */ @Configuration pub ...
- 设计模式学习笔记(十五)命令模式及在Spring JdbcTemplate 中的实现
命令(Command)模式是指将请求封装成为一个对象,使发出请求和执行请求的责任分割开,方便将命令对象进行存储.传递.调用.增加与管理. 也就是将发送者.接收者和调用命令封装成独立的对象,来供客户端调 ...
- MySQL---增删改查数据库、表、记录
对库的操作 # 增 create database db1 charset utf8; # 删 drop database db1; # 改 alter database db1 charget gb ...
- crm单元测试使用
Action使用 使用paramBag传递入参,填写入参名,入参值,后使用 serviceProvider传入插件. Assert.AreEqual(this.output["state&q ...
- coolshell-初见
首页:https://coolshell.cn/tag/programmer 我是怎么招聘程序员的 https://coolshell.cn/articles/1870.html 程序员需要具备的基本 ...