TS的优势
VSCode的部分设置
- code ->Preferences(首选项) -> Settings(设置)
- 搜索
quote设置 typescript.preferences.quoteStyle: single - 搜索
save设置 formatOnSave: true
安装插件
Prettier
安装typescript
npm install typescript@3.6.4 -g
安装ts-node
npm install ts-node@8.4.1 -g
ts-node demo.ts
静态类型
不仅意味着变量的类型不能修改,基本也以为着变量上的方法和属性也不能修改该了。
类型注解(type annotation)
我们来告诉TS需要什么类型
let count : number
count = 123
类型推断 (type inference)
TS会自动去尝试分析变量的类型
let countInference = 123
基础类型
boolean number string void undefined symbol null
const count: number = 123
const count1 :number
count1 = 1
const tName: string = 'luoyi'
对象类型
{} class [] function
对象
const teacher: {
name: string,
age: number
} = {
name: 'luoyi',
age: 12
}
类:class
class Person { }
const dell: Person = new Person()
数组类型
const numbers: number[] = [1, 2, 3]
// 数组的每个值都是number类型
const numberArr: (number | string)[] = [1, 2, 3, 4]
const stringArr: string[] = ['a', 'b', 'c']
const undefinedArr: undefined[] = []
const objArr: { name: string }[] = [{ name: 'luoyi' }]
//类型别名
type User = {
name: string,
age: number
}
const objArrNew: User[] = [{
name: 'luoyi',
age: 2
}]
class Teacher {
name: string;
age: number;
}
const objArrNew1: Teacher[] = [
new Teacher(),
{
name: 'luoyi',
age: 3
}
]
元组
// 和数组非常类似的概念 叫元组 tuple
const teacherInfo: (number | string)[] = ['Dell', 'male', 18]
// 元组的使用场景 csv
const teacheList: [string, string, number][] = [
['dell', 'male', 19],
['sun', 'female', 26],
['jeny', 'female', 38]
]
函数类型
const getTotal: () => number = () => {
return 123
}
function add(first: number, second: number) {
return first + second
}
// 为了防止返回值不能准确的通过参数推断出来,最好给函数的返回值也增加类型约束
function add1(first: number, second: number): number {
return first + second
}
const total: number = add(1, 2)
//函数没有返回值
function sayHellow(): void {
console.log('hello')
// return ''
}
//函数永远不可能执行到最后
function errorEmitter(): never {
throw new Error()
console.log(123) //永远无法执行
}
//死循环导致永远无法执行循环下面的内容
function neverToEnd(): never {
while (true) {
}
console.log('循环执行完执行的内容')
}
//函数参数接收解构的内容的语法
function addNew({ first, second }: { first: number, second: number }): number {
return first + second
}
const totalNew = addNew({ first: 1, second: 2 })
function getNumber({ first }: { first: number }) {
return first
}
const getNumberResult = getNumber({ first: 1 })
const func = (str:string):number=>{
return parseInt(str,10)
}
const func:(str:string)=>number = (str)=>{
return parseInt(str,10)
}
data类型
const date = new Date()
元组
其他类型
interface Person {
name: 'string'
}
const rawData = '{"name:":"dell"}'
const newData: Person = JSON.parse(rawData)
let temp:number | string = 123
temp = '456'