| 对象 | 不同点 |
|---|---|
| js | 动态类型(执行时才做类型匹配)、弱类型语言 |
| ts | 静态类型、弱类型语言 |
注意:
- 动态静态的差异就在编译是在执行时发生还是提前进行
- 弱类型语言的特征就是类型转换,字符串和数字相加时会进行隐式类型转换 允许执行
- ts是js的超集 包含于兼容所有js特性 支持共存 支持渐进式引入与升级
静态类型:
- 可读性增强 基于语法解析TSDoc ide增强
- 可维护性增强 在编译阶段暴露大部分错误
- 多人合作的大型项目中 获得更好的稳定性和开发效率
TSDoc 旨在标准化文档注释语法,同时仔细平衡几个相互竞争的设计要求:
- 扩展: 工具必须能够定义自己的自定义标记,以自然的方式表示特定于域的元数据。
- 互操作性: 自定义标记不得阻止其他工具正确分析注释。为了换行,自定义标记必须使用已建立的语法模式,这些模式可以在解析过程中安全地识别和丢弃。
- 熟悉的语法: TSDoc 应尽可能保留熟悉的 JSDoc/Markdown 风格。这也最大限度地提高了旧注释作为 TSDoc 正确解析的可能性。
为什么 JSDoc 不能成为标准? JSDoc 语法不是严格指定的,而是从特定实现的行为中推断出来的。大多数标准的JSDoc标签都专注于为普通JavaScript提供类型注释,这对于像TypeScript这样的强类型语言来说并不是主要关注点。
TypeScript 区分大写和小写字符。
每行指令都是一段语句,你可以使用分号或不使用, 分号在 TypeScript 中是可选的,建议使用。
以下代码都是合法的:
console.log("Runoob")
console.log("Google");
如果语句写在同一行则一定需要使用分号来分隔,否则会报错,如:
console.log("Runoob");console.log("Google");
类型声明是TS非常重要的一个特点
通过类型声明可以指定TS中变量(参数、形参)的类型
指定类型后,当为变量赋值时,TS编译器会自动检查值是否符合类型声明,符合则赋值,否则报错
简而言之,类型声明给变量设置了类型,使得变量只能存储某种类型的值
let 变量: 类型;
let 变量: 类型 = 值;
function fn(参数: 类型, 参数: 类型): 类型{
...
}
TS拥有自动的类型判断机制
当对变量的声明和赋值是同时进行的,TS编译器会自动判断变量的类型
所以如果你的变量的声明和赋值时同时进行的,可以省略掉类型声明
| 类型 | 例子 | 描述 |
|---|---|---|
| number | 1, -33, 2.5 | 任意数字 |
| string | ‘hi’, “hi”, hi | 任意字符串 |
| boolean | true、false | 布尔值true或false |
| 字面量 | 其本身 | 限制变量的值就是该字面量的值 |
| any | * | 任意类型 |
| unknown | * | 类型安全的any |
| void | 空值(undefined) | 没有值(或undefined) |
| never | 没有值 | 不能是任何值 |
| object | {name:‘孙悟空’} | 任意的JS对象 |
| array | [1,2,3] | 任意JS数组 |
| tuple | [4,5] | 元素,TS新增类型,固定长度数组 |
| enum | enum{A, B} | 枚举,TS中新增类型 |
任意值是 TypeScript 针对编程时类型不明确的变量使用的一种数据类型,它常用于以下三种情况。
1、变量的值会动态改变时,比如来自用户的输入,任意值类型可以让这些变量跳过编译阶段的类型检查,示例代码如下:
let x: any = 1; // 数字类型
x = 'I am who I am'; // 字符串类型
x = false; // 布尔类型
2、改写现有代码时,任意值允许在编译时可选择地包含或移除类型检查,示例代码如下:
let x: any = 4;
x.ifItExists(); // 正确,ifItExists方法在运行时可能存在,但这里并不会检查
x.toFixed(); // 正确
3、定义存储各种类型数据的数组时,示例代码如下:
let arrayList: any[] = [1, false, 'fine'];
arrayList[1] = 100;
有些情况下,变量的类型对于我们来说是很明确,但是TS编译器却并不清楚,此时,可以通过类型断言来告诉编译器变量的类型,断言有两种形式:
第一种
let someValue: unknown = "this is a string";
let strLength: number = (someValue as string).length;
第二种
let someValue: unknown = "this is a string";
let strLength: number = (<string>someValue).length;
利用interface关键字声明对象类型
作用:遍历数组,取出数组中的每一项 参数:function(value,index,array){} 返回值:没有返回值
var arr = [2, 4, 65, 23];
var sum = 0;
arr.forEach(function(value, index, array) {
console.log('每个数组元素' + value);
console.log('每个数组元素的索引号' + index);
console.log('数组本身' + array);
sum += value;
})
console.log(sum); // 94
作用:遍历数组,筛选出满足条件的项,将满足条件的项放到新数组中,并且返回 参数:function(value,index,array){} 返回值:返回存放了满足条件的项的新数组 如果发现回调函数,返回了true,就将当前的value,放到新数组中
var arr = [12, 66, 4, 34, 2, 67];
var newArr = arr.filter(function(value, index, array) {
// value 数组元素
// index 数组元素的索引
// array 当前的数组
return value > 20;
});
console.log(newArr); // [66,34,67] 返回值是一个数组
filter 是查找满足条件的元素 返回的是一个数组 而且是把所有满足条件的元素返回回来
作用:遍历数组,判断是否有满足条件的元素,如果有返回true,如果没有返回false 查找数组唯一的元素 参数:function(value,index,array){} 返回值:返回true/false
如果发现回调函数,返回了true,就会停止遍历
// some 查找数组中是否满足条件的元素
var arr = [10, 30, 4];
var flag = arr.some(function(value, index, array) {
// value 数组元素
// index 数组元素的索引
// array 当前的数组
return value < 15;
});
console.log(flag); // true 返回的是布尔值,只要查找到满足条件的一个元素就立马终止循环
var arr1 = ['red', 'pink', 'blue'];
var flag1 = arr1.some(function(value) {
return value == 'pink';
});
console.log(flag1); // true
some 查找满足条件的元素是否存在 返回的是一个布尔值 如果查找到第一个满足条件的元素就终止循环
map()生成一个新数组 其结果是该数组每一个元素 调用指定函数的 返回值
var arr = [1,2,3];
var newArr = arr.map(function(value) {
return value < 2;
});
console.log(newArr); // [true, false, false]
every() 用来检测该数组中每一个元素 是否都满足指定函数的条件,返回的是 布尔值 如果给定是一个空数组,则返回true
var arr1 = [22, 45, 3, 5, 24];
// var arr2 = [];
var newArr1 = arr1.every(function(value) {
return value > 20;
});
console.log(newArr1); // false