TypeScript 学习笔记(一)
TypeScript:
1、是 JavaScript 的一个超集,支持 ES6 标准
2、由微软开发的自由和开源的编程语言
3、设计目标是开发大型应用,它可编译成纯 JavaScript,编译出来的 JavaScript 可运行在任何浏览器上
4、扩展了 JavaScript 的语法,因此现有的 JavaScript 代码可与 TypeScript 一起工作无需任何修改
5、通过类型注解提供编译时的静态类型检查
6、可处理已有的 JavaScript 代码,并只对其中的 TypeScript 代码进行编译
TypeScript 数据类型:
1、布尔值:boolean,表示是或否
// 声明一个布尔类型的变量 flag,它的值为 true
let flag: boolean = true;
2、数字:number,JavaScript 和 TypeScript 里的数字都是浮点数;TypeScript 支持二进制、八进制、十进制和十六进制
// 前缀为 0b 表示二进制、0o 表示八进制、0x 表示十六进制,默认为十进制
let num: number = 6;
3、字符串:string,可使用双引号或单引号表示字符串
模板字符串:由反引号 (`) 包围,并且以 ${exp} 形式嵌入表达式 ==》定义多行文本或内嵌表达式
// 定义一个普通的字符串
let name: string = "lemon"; // 模板字符串
let name: string = `Lemon`;
let age: number = 8;
let greet: string = `Hello, my name is ${name}. I am ${age} years old`;
4、数组:在元素类型后加上 [ ] 或使用数组泛型 Array<元素类型> 来声明数组
let arr: number[] = [1, 2, 3]; // 等价声明
let arr: Array<number> = [1, 2, 3];
5、元组:允许表示一个已知元素个数和类型的数组,各元素类型不必相同
// 声明一个有 2 个元素,其类型分别为 string 和 number 的元组
let tup: [string, number] = ["Hello", 10];
6、枚举:enum,为一组数值赋予友好的名字
// 声明枚举变量 color,red 对应值为 0,yellow 为 1,blue 为 2
enum color {red, yellow, blue};
let c: color = color.blue;
console.log(c); // 控制台输出对应值,这里为 2 // 可采用手动赋值方法
enum color {red = 1, yellow = 3, blue = 6};
console.log(color.yellow); // 输出 3
console.log(color[3]); // 输出 yellow
注:名字和值是相互绑定的,可由值找名字,反之也可以找值
7、Any:为在编译阶段还不清楚类型的变量指定一个类型
let notSure: any = 4;
console.log(notSure); // 输出 4 notSure = "Hello Lemon.";
console.log(notSure); // 输出 Hello Lemon.
8、Void:表示没有任何类型
let voidValue: void = null;
console.log(voidValue); // 输出 null
voidValue = 2; // 报错
注:当一个函数没有返回值时,其类型通常为 void,且声明一个 void 类型的变量只能为其传入 undefined 或 null
9、Null 和 Undefined:默认情况下 null 和 undefined 是所有类型的子类型
let value: null = null;
let num: number = value;
console.log(num + 1); //输出 1
注:子类型可赋值给父类型,当指定 --strictNullChecks 标记时,null 和 undefined 只能赋值给 void 和它们自己
10、Never:表示那些永不存在的值的类型(如:总会抛出异常或根本不会返回值的函数表达式或箭头函数表达式的返回值类型;
变量被永不为真的类型保护所约束时也可为 never 类型)
11、Object:表示非原始类型,也就是除 number、string、boolean、symbol、null 或 undefined 之外的类型
类型断言:
如同其他语言的类型转换,但不进行特殊的数据检查和解构;它没有运行时的影响,只在编译阶段起作用
TypeScript 会假设您已经进行了必要的检查
语法:
1、“尖括号”语法:
let someValue: any = "Hello World";
let strLength: number = (<string> someValue).length;
console.log(strLength); // 输出 11
2、as 语法:
let someValue: any = "Hello World";
let strLength: number = (someValue as string).length;
console.log(strLength); // 输出 11
注:当在 TypeScript 里使用 JSX (JavaScript XML)时,只有 as 语法断言被允许
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 ...
- Typescript 学习笔记三:函数
中文网:https://www.tslang.cn/ 官网:http://www.typescriptlang.org/ 目录: Typescript 学习笔记一:介绍.安装.编译 Typescrip ...
- Typescript 学习笔记一:介绍、安装、编译
前言 整理了一下 Typescript 的学习笔记,方便后期遗忘某个知识点的时候,快速回忆. 为了避免凌乱,用 gitbook 结合 marketdown 整理的. github地址是:ts-gitb ...
- TypeScript学习笔记(八):1.5版本之后的模块和命名空间
我之前有写过TS1.5版本之前的“模块”的笔记:TypeScript学习笔记(七):模块 但是TS这里的模块和在ECMAScript 2015里的模块(即JS原生支持了模块的概念)概率出现了混淆,所以 ...
- typescript学习笔记(三)---接口
关于第二章的学习笔记是变量声明. 接口:TypeScript的核心原则之一是对值所具有的结构进行类型检查. 它有时被称做“鸭式辨型法”或“结构性子类型化”. 在TypeScript里,接口的作用就是为 ...
- typescript学习笔记(一)---基础变量类型
作为一个前端开发者,学习新技术跟紧大趋势是必不可少的.随着2019年TS的大火,我打算利用一个月的时间学习这门语言.接下来的几篇文章是我学习TS的学习笔记,其中也会掺杂一些学习心得.话不多说,先从基础 ...
随机推荐
- Word List
周一考试了,单单单词查不完了,只好随便整理一下了
- 转载 could not find a getter for ... in class ... 异常的原因解析
可能原因如下: 1.真的没有写getter方法(发生几率:1%) 2.*.hmb.xml文件中的属性名和pojo不一致(*.hbm.xml和*.java没衔接好,不一致),字段属性没有正确配置,比如, ...
- Linux 定位进程对应的文件路径
ls -al /proc/[pid]/exe # 例如: [root@localhost ~]# ls -al /proc/9109/exe lrwxrwxrwx. 1 ibaboss ibaboss ...
- netperf 网络测试工具
软件介绍: netperf是惠普公司开源的一款针对网络性能的测试工具,主要基于TCP或UDP的传输.根据应用的不同,可以进行批量数据传输(bulk data transfer)模式和请求/应答(req ...
- webpack打包 The 'mode' option has not been set, webpack will fallback to
webpack 打包报错 The 'mode' option has not been set, webpack will fallback to 'production' for,Module no ...
- 子传父flase注意点
1==>在子传递数据给父亲的时候, closeBottom(){ this.$emit("closeBottom",false) } false不加引号. 2==>
- Java核心(一)深入理解BIO、NIO、AIO
目标: BIO.NIO.AIO 的区别是什么? 同/异步.阻/非阻塞的区别是什么? 文件读写最优雅的实现方式是什么? NIO 如何实现多路复用功能? 一,IO的介绍: (1)IO的全称其实是:Inpu ...
- 去除mysql里面重复的行并留下id最小的
DELETE FROM wynews WHERE title IN (SELECT * FROM (SELECT title FROM wynews GROUP BY title HAVING COU ...
- linux编程fcntl获取和设置文件锁
#include <stdio.h> #include <stdlib.h> #include <unistd.h> #include <sys/types. ...
- COM 编程基础
DirectX 采用了 COM 标准.而 DirectShow 是一套完全基于 COM 的应用系统.要想深入学习 DirectShow,掌握一些 COM 编程的基础知识是必不可少的. 一.COM 是什 ...