千锋教育前端Vue3.0全套视频教程（Kerwin2023版，Vue.js零基础
TS：解决大型项目，项目小不建议用ts；
可以在编译期间发现并纠正错误【静态检查】
强类型、支持静态和动态类型
最终编译成js代码，使浏览器可以理解
JS：一种脚本语言，用于创建动态网页
一种解释型语言，只能在运行时发现错误
弱类型，没有静态类型
可以直接在浏览器中使用
ts它是不能直接在浏览器或nodejs环境中来运行的，它是需要编译成js才能被运行
xxx.ts => tsc 命令来编译 ===> xxx.js
类型
内置类型全小写
let/const/var 变量名：类型 = 值
注：如果你在声明变量时就给值，则可以不指定类型，ts可以自动来推断出来变量的类型
=字符串=
let arg = '张三' arg不需要指定，自动识别出是字符串类型
let arg：string
arg = '字符串'
=bigint=
let oneHundred:bigint = BigInt（100）；
=symbol类型=
let s:symbol = Symbol（）;
let s:symbol
s = Symbol('key')
=数组=
字符串数组：数组里面的元素它的类型只能是字符串，不能是别的类型 （arr = [这里面只能写字符串]）
let arr:string[ ]
arr = ['aaa','bbb']
通过泛型类定义数组元素值类型
let arr: Array<string>
arr = ['aaa','bbb']
ts接口interface两个作用：一个为类所实现，一个定义类型
元素值是数字
let arr:number[ ]
arr = [1,2,3]
=元组tuple=
元组是数组的一种特殊形式，一个数组如果知道它的长度且它里面每个元素的类型是已知的，则它就为元组 （一般定义成元组之后不能改变长度和类型）
let tuple：[ string，number，boolean ]
tuple = [ ' a ', 1, true ]
=Any 与 Unknown=
都是可以赋值任意类型值，any没有类型检查，而unknown它是会有类型检查，在使用时会进行类型检查
unknown还可以进行类型转换，而any不具备，定义成any就相当于在ts中写js了
===any
let arg1：any
arg1 = 1
arg1 = 'aaa'
arg1 = true
arg1 = { id:1 }
any在赋值和调用时，都不会进行类型的检查，相当于写js
console.log（arg1 +1）
===unknown
let arg2：unknown
arg2 = 1
arg2 = 'aaa'
arg2 = true
arg2 = { id:1 }
unknown在赋值时可以给值，但在使用变量时，会进行类型的检查
所以就需要你在使用时，给unknown指定明确的类型 方法：断言 as
console.log（arg2 +1）×
console.log（（arg2 as number） +1）√
;(arg2 as { id:number }).id ;的作用？
let age:string = '10'
let aa:number
// unknown 用来转换类型，先将age转成大范围的类型，再转成具体的类型
aa = age as unknown as number
==函数
定义一个没有参数也没有返回值的函数
1、没有写return function fn() { }
2、写了return但只有return function fn() { return; }
3、写了return但后面是 undefined
如果函数没有返回值，可以给这个函数指定它没有返回值 void
function fn(): void {
return undefined
return;
}
定义一个函数它有参数，参数类型是指定的，且有返回值
function fn( id: number, name: string) :string {
return id + name //字符串和数字相加一定会转成字符串
}
//可选参数 给参数前面加一个? 表示当前参数它是可选的，可以有也可以没有
function fn( id: number, name ？: string) :string {
// 类型断言
return id + （ name as string ）
// 非空断言，name值它一定有值，一定不会为undefined
return id + name ！
// 类型收缩 typeof instanceof in extends
if （ typeof name === 'string' ）{
return id + name
return `编号: ${ id } `
}
自动类型
function fn () {
return 1
}
const fn = () => 1
==对象类型
声明了一个user变量，它的类型是一个对象，其中必须要有的属性为id和name分类对象类型的number和string，二age属性它是一个可选的，可以有也可以没有有的话，类型一定要有number
let user:{ id:number; name:string; age?:number }
user = { id: 1, name: ' aaaa', age: 20 }
user = { id: 1, name: ' aaaa' }
数组对象，数组的元素它是一个对象
let users: { id: number; name: string; age?: number } [ ]
let users : Array<{ id: number; name: string; age?: number }>
users = [ { id : 1, name: 'aaaa', age: 20 }]
动态属性，此对象它必须要有id和name属性，还可以有更多的其他属性，其他属性必须要满足key是string类型，值是any任意类型
下面用any还是unknown取决对于类型的要求严不严格
let user: { id: number; name: string; [ key: string ]: any }
let user: { id: number; name: string; [ key: string ]: unknown }
user = { id: 1, name: 'aa', a: 2,b: { other: 'bbb' }, c: 'aaa' }
索引类型
let user: { id: number; name: string; [ key: string ]: any }
typeof user => 得到user变量它的类型
let id: ( typeof user ) [ ' id ' ]
==定义类型 type[ 类型别名 ] / interface
type定义类型方式，它可以定义任意类型情况
type userType = { id: string; name: string; }
type userType = { id: string; name: string; age ?: number }
let user1：userType
let user2：userType
let id：userType[ ' id ' ]
let user = { id: 1, name: ' aa ' }
根据变量的值，来声明一个类型
type userType = typeof user
把原来的string，相当于起了一个别名，叫urlType
type urlType = string
type urlType = number
let url：urlType
url = ' aa '
给函数[ 赋值定义的函数 ]的参数及返回值来限制类型 函数签名
声明一个函数类型，它必须要有两个参数，参数1类型必须是number，参数2类型必须是string，返回值类型必须为string
注：参数的名称，可以任意去起名称，不重要
一流人才定义规则，二流去实现
type fnType = （ id：number， name：string） => string // id 和 name 只是占位，名字可以随便写；重要的是类型
const fn: fnType = （ id： string，name：string）=> ' aa '
type声明的类型，名称不能重复
type t1 = { id：number }
typet t1 = { name：string }
联合类型
一个变量它可以拥有多个类型
type idType = number | string // 既可以传数字也可以传字符串
let id: idType
id = ' a '
id = 1
type idType = number | string | boolean | null
// 根据上面已有的联合类型，派生出一个新的类型
type newIdType = Exclude<idType, string | null> // 在指定的联合类型中，排除掉不要的类型，生成一个新类型 【黑名单】
type newIdType = Extract<idType, string | null> // 保留要的联合类型，生成一个新类型 【白名单】
any 和 unknown在联合类型时它的最终类型
返回的还是any和unknown
任何类型和any或unknown联合时，最终类型都是any或unknown
type a = string | number | any
type b = string | number | unknown
*交叉类型
联合类型的交叉，它只会取交集
type t1 = number | string | boolean
type t2 = boolean | string | boolean
type t3 = t1 & t2 // 对于联合类型的交叉，t3取 t1 和 t2的交集
对象类型，取的是并集
交叉类型，可以用它来完成对已有类型属性的扩展
如果在合并时，有相同的字段，则类型最好是一致的；如果不一致，则前面的类型一定要比后面的类型范围要大
协变和逆变：让类型可用
字面量类型
type lessonType = 'css' | 0 | 1 | true | { id: 1 } | ' hahaha '
let lesson: lessonType
lesson = 'css' // 写成上面的那些值任意的一个就不会报错，不是上面的就会报错
lesson = { id: 1 }
let objType = { id: number, name: string }
let obj: objType = { id: 1, name: 'aaa' }
obj.id //不会报错
function getValue( obj: objType, key: string ) {
// key它可能不在你定义这个类型中
return obj [ key ] // 会报错
}
let objType = { id: number, name: string ；age：number }
let obj: objType = { id: 1, name: 'aaa' ，age: 10 }
// 绿色的就是字面量类型
function getValue( obj: objType, key: ' id ' | ' name ') {
// key它可能不在你定义这个类型中
return obj [ key ]
}
never ts特有
此类型，一般你用不到，除非你写ts很底层的方案
返回 never 的函数必须存在无法达到的终点
