目录
TS是一种标注式语言,不侵入JS的设计
TS的常见用法介绍
文章内容
- 基础类型、数组
- any/unkown
- 类型标注
- 函数
- 对象类型
- 联合
- 别名
- 接口
- 断言
- 字面类型
- null and undefined
- 枚举类型
基础类型、数组
- string,number,boolean,null【人为赋值null】,undefined【就是没有设置值】
- Array,T代表数组中元素类型
- 为什么要求数组中类型统一?人类思考问题的方式;类型的方式思考程序,如一组人
javascript
// null;undefined
const a = {}
a["aaa"] // undefined
a["aaa"] = null // null
if(a["aaa"] === null) {}
// js
new Array()
// TS;浏览器中不支持;要有1TS环境
new Array<T>()
example01.ts
TypeScript
// js语法
const a = new Array()
// ts语法
const b = new Array<string>()// 泛型,定义数组每项元素只能式string
b.push('123')// b只能push字符串,其他类型都会编译报错
// 让typescript认为当前文件是一个模块,这个文件里的变量都是局部的
export {}
逃避类型检查:any
TypeScript
let obj:any = { x: 0 };
// 后续都不会被检查
// `any`屏蔽了所有类型检查,相当于你相信你对程序的理解式高于TS的
obj.foo();
obj();
obj.bar = 100;
obj = "hello";
const n: number = obj;
const a: {[key: string] :number} = { x: 1 };
a.y = 2
a.z = 3
a.o = "123" // 报错
思考一下~:不知道类型
为什么要提供unknown?
TypeScript
let value: unknown;
value = true; // ok
value = 42; // ok
value = "hello"; // ok
let value3:boolean = value; // Error
类型标注
TypeScript
let myName:string = "Alice"; // :string 标注类型为字符串
let yourName = "Bob"; // 未明确标注类型,会推到出此类型为string
函数(参数和返回值)
TypeScript
// greet : string -> number (Haskell)
function greet(name: string): number {
console.log("Hello," + name.toUpperCase() + "!!");
}
greet(42) // Error ,要求string
let x: string = greet("omg") // Error , x要求字符串,返回值要求数字
匿名函数
TypeScript
const names = ["Alice", "Bob", "Erice"];
// Array<string>
names.forEach(function (s) {
// s: string // 类型的上下文推到 contextual mapping
console.log(s.toUppercase());
});
names.map(value => {
// value: string // 类型的上下文推到 contextual mapping
const y: number = value // Error
});
names.forEach((s) => {
console.log(s.toUppercase());
})
TS如何知道匿名函数的类型?
contexture Typing技术
- 根据上下文(Context)推导类型
- 还有什么是Context Typing?
上下文是指程序间组件共享的知识,可以是任何东西
TypeScript
class A {
foo(){
// this就是类A的上下文
this.bar()
}
bar(){
}
}
function foo2() { // 闭包
const x = 1
function bar() { // 子闭包
}
}