前言:现在很多公司在项目中都在用ts了,现在将我们来一步一步学习吧,后期文章中有错误或者
哪位大神有不同的看法,欢迎评论和指导,言归正传,我们开始学习吧。
TypeScript简介
TypeScript是一种由微软开发的一门编程语言,它实际上是js语言的一种扩展(JS的超集),
扩展了更多大语言(面向对象语言)所特有的语法。TS支持所有JS语法,所以任何现有的JavaScript
程序可以不加改变的在TypeScript下工作。TypeScript是为大型应用之开发而设计,
而编译时它产生 JavaScript 以确保兼容性。可以在任何浏览器,任何计算机和任何操作系统上运行,
并且是开源的。本课程介绍了TypeScript的基本概念、常用语法和高级特性。
安装和编译
安装typescript(目的是使用全局命令tsc,把ts文件编译成js文件)
yarn global add typescript
编译(compile)
tsc 文件名.ts
数据类型
任意类型 any
数字类型 Number
字符串类型 String
布尔类型 Boolean
数组类型 无
元组 无
枚举 enum
void void
null null
undefined undefined
never never
TypeScript 变量的命名规则:
1.变量名称可以包含数字和字母。
2.除了下划线 _ 和美元 $ 符号外,不能包含其他特殊字符,包括空格。
3.变量名不能以数字开头。
TypeScript 主要包含以下几种运算:
1.算术运算符
2.逻辑运算符
3.关系运算符
4.按位运算符
5.赋值运算符
6.三元/条件运算符
7.字符串运算符
8.类型运算符
在 TypeScript 中,我们可使用以下条件语句:
1.if 语句 - 只有当指定条件为 true 时,使用该语句来执行代码
2.if...else 语句 - 当条件为 true 时执行代码,当条件为 false 时执行其他代码
3.if...else if....else 语句- 使用该语句来选择多个代码块之一来执行
4.switch 语句 - 使用该语句来选择多个代码块之一来执行
TypeScript 循环
for 循环语法
for ( init; condition; increment ){
statement(s);
}
下面是 for 循环的控制流程解析:
1.init 会首先被执行,且只会执行一次。这一步允许您声明并初始化任何循环控制变量。
您也可以不在这里写任何语句,只要有一个分号出现即可。
2.接下来,会判断 condition。如果为 true,则执行循环主体。如果为 false,则不执行循环主体,
且控制流会跳转到紧接着 for 循环的下一条语句。
3.在执行完 for 循环主体后,控制流会跳回上面的 increment 语句。该语句允许您更新循环控制变
量。该语句可以留空,只要在条件后有一个分号出现即可。
4.条件再次被判断。如果为 true,则执行循环,这个过程会不断重复(循环主体,然后增加步值,再
然后重新判断条件)。在条件变为 false 时,for 循环终止。
for...in 循环
for (var val in list) {
//语句
}
for…of 、forEach、every 和 some 循环
此外,TypeScript 还支持 for…of 、forEach、every 和 some 循环。for...of
语句创建一个循环来迭代可迭代的对象。在 ES6 中引入的 for...of 循环,
以替代 for...in 和 forEach() ,并支持新的迭代协议。for...of 允许你遍历 Arrays(数组),
Strings(字符串), Maps(映射), Sets(集合)等可迭代的数据结构等。
while 循环
while(condition){
statement(s);
}
do...while 循环
do
{
statement(s);
}while( condition );
break 语句有以下两种用法:
1.当 break 语句出现在一个循环内时,循环会立即终止,且程序流将继续执行紧接着循环的下一条语句。
2.它可用于终止 switch 语句中的一个 case。
continue 语句
1.continue 语句有点像 break 语句。但它不是强制终止,continue 会跳过当前循环中的代码,强迫开始下一次循环。
2.对于 for 循环,continue 语句执行后自增语句仍然会执行。对于 while 和 do...while 循环,
continue 语句重新执行条件判断语句。
无限循环
无限循环就是一直在运行不会停止的循环。 for 和 while 循环都可以创建无限循环。
for 创建无限循环语法格式:
for(;;) {
// 语句
}