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的学习笔记,其中也会掺杂一些学习心得.话不多说,先从基础 ...
随机推荐
- Assign a Standard Image 设置图标
eXpressApp Framework (XAF) includes standard images embedded into the DevExpress.Images assembly. In ...
- Javascript 的定时器 setInterval,setTimeout,clearInterval
今天开通博客.来1个.哇哈哈哈~~ 今天本来想复习BOM的看到定时器也算DOM一种 ?(是这样吗).分享一下 参考源于:八神吻你 http://www.cnblogs.com/lmfeng/archi ...
- Java中的“scanf()、cin()、input()"
最近在写一个Java程序时遇到一个问题,就是如何在Java里面输入数值,又叫做获取键盘输入值. 因为c语言里面有scanf(),C++里面有cin(),python里面有input().Java里面有 ...
- Django2.1集成xadmin管理后台所遇到的错误集锦,解决填坑(二)
django默认是有一个admin的后台管理模块,但是丑,功能也不齐全,但是大神给我们已经集成好了xadmin后台,我们拿来用即可,但是呢,django已经升级到2.1版本了,xadmin貌似跟不上节 ...
- TensorFlow从1到2(十四)评估器的使用和泰坦尼克号乘客分析
三种开发模式 使用TensorFlow 2.0完成机器学习一般有三种方式: 使用底层逻辑 这种方式使用Python函数自定义学习模型,把数学公式转化为可执行的程序逻辑.接着在训练循环中,通过tf.Gr ...
- SSH整合二
结构图 articles模块 实体类Articles.java package com.jt.articles.entity; public class Articles { private Inte ...
- 前端如何快速定位问题传参 和false
今天下午在请求接口的时候,出现了一个问题就是 传参问题 接口是请求成功的200,但是修改后返回来的却是500,这就很纳闷怎么会这样了. 经过查找,原来是因为传参问题.将有一个name:0 传递成了n ...
- 201871010104-陈园园 《面向对象程序设计 (java)》第一周学习总结
201871010104-陈园园 <面向对象程序设计 (java)>第一周学习总结 项目 内容 这个作业属于哪个课程 https://www.cnblogs.com/nwnu-dai ...
- cmd如何跨盘cd切换路径
cmd跨盘cd要加参数 /d ,难怪,我还以为电脑有问题呢~
- BERT-wwm、BERT-wwm-ext、RoBERTa、SpanBERT、ERNIE2
一.BERT-wwm wwm是Whole Word Masking(对全词进行Mask),它相比于Bert的改进是用Mask标签替换一个完整的词而不是子词,中文和英文不同,英文中最小的Token就是一 ...