{// 原始数据类型
let num: number = 1
let str: string = 'abc'
let bool: boolean = true
let u: undefined = undefined
let n: null = null
// 任意值: 可以赋值给任意类型
let any: any = 1
// 联合类型: 表示取值可以为多种类型中的一种
let num1: number | string = 1
// -- 如果联合类型的属性不是共有的,则不能访问到,会报错
function fn(num2: number | string) {
console.log(num2.length); // 因为number不会存在length属性,所以会报错
}
fn('abc')
}
{// 数组类型
let arr: number[] = [1, 2, 3]
let arr1: string[] = ['a', 'b', 'c']
let arr3: (number | string)[] = [1, 'a', 2]
let arr4: any[] = [1, 'a', 2, false, 'age', { name: '小红' }]
}
{// 对象类型: 使用接口来定义对象
// -- 必须保持一致
{
interface IPerson {
name: string,
age: number,
}
let student: IPerson = {
name: '小红',
age: 20,
}
}
// -- 可以不一致,可选形: age可选可不选,仍不可多添加
{
interface IPerson {
name: string,
age?: number,
}
let student: IPerson = {
name: '小红',
}
let student2: IPerson = {
name: '小红',
age: 20,
}
}
// 使用任意属性定义对象
// 可选类型和默认类型都必须是propName的子类,否则报错
{
interface IPerson {
name: string,
age: number
[propName: string]: any
}
let student: IPerson = {
name: 'xiaowang',
age: 20,
school: '北京大学',
heigt: '170cm'
}
}
}
{// 函数类型:函数的参数和返回值
{//普通函数的ts写法
// 普通函数
function sum(x: number, y: number): number {
return x + y;
}
sum(10, 20)
// 箭头函数和函数表达式
let sum1 = (a: number, b: number): number => a + b
sum1(10, 20)
let sum2 = function (a: string, b: number) {
console.log(a.length, b.toString());
}
sum2('abc', 123)
}
{// 利用接口写函数,只支持箭头函数和函数表达式
interface addFn { (num1: number, num2: number): number }
let add: addFn = (num1, num2) => num1 + num2
add(10, 20)
}
{// 函数的可选参
function buildName(str1: string, str2?: string): void {
console.log(str1.length);
}
buildName('abcd')
buildName('abcd', 'cdef')
}
{// 函数参数的默认值
function sum1(a: number = 10, b: number): number {
return a + b
}
sum(10, 20)
}
}
{// 类型断言: 语法: 值 as 类型
// 当ts确定不了某个值的时候,这个时候就可以用到类型断言
function sumFn(a: number | string) {
console.log((a as string).length);
}
sumFn('abc')
}
{// 内置对象
let div: HTMLDivElement = document.querySelector('.box') as HTMLDivElement
// 等等......Boolean、Error、Date、RegExp 等
}
{// 泛型:在调用的时候使用来去定义类型
interface ILength {
length: number
} // 泛型的类型约束
function str<T extends ILength>(str: T) {
console.log(str.length);
}
str<string>('abc')
}