yarn init --yes//创建
yarn add typescript --dev //安装
yarn tsc 01-typescript.ts
yarn tsc --init //配置文件
标准库是内置对象所对应的声明文件
ts 变量作用域问题,不同的文件相同的变量名称,
(function(){
//把内容放到这个立即执行函数中
})()
或者使用 export {}
Object 类型
// 以下用ts来表示typeScript
// 在ts中 Object类型泛指 所有的非原始类型也就是对象、数组、函数
// Object类型
export{}//输出成一个模块 确保和其他没有冲突
//注意这里的object是纯小写的,这里的object类型不单单代表对象类型
const foo:object = {}//[]//function(){}
//如果我们需要一个普通的对象类型
const faa:{foo:number,bar:string} = {foo:123,bar:'123'}
//更好的定义对象类型的方式是使用接口
数组类型
//数组类型
export{}
//在ts中有俩种方式定义数组类型
const arr1:Array<number> = [1,23,4]
const arr2:number[] = [12,35,5]
//------------------------------------------------------在这里插入代码片
//在没有类型注解的时候,我们需要判断传入的参数是否是数字
function sum(...args:number[]){
return args.reduce((prev,current)=>prev+current,0)
}
sum(1,2,45)
Tuple元组类型
//元组类型
export{}
//固定长度的数组
const tuple:[number,string] = [12,'12']
//可以通过下标来获取
const a =tuple[0]
//通过数组解构方式获取
const [age,bar] = tuple
console.log(age,bar)
枚举类型
//枚举类型 Enum
export {}
// enum PostStatus {
// Draft=0,
// Unpublished=1,
// Published=2,
// }
// 如果是数字型枚举会自增长
// enum PostStatus {
// Draft=6,
// Unpublished,
// Published,
// }
//字符串枚举,不能自增长,所以需要全部定义
// enum PostStatus {
// Draft='212',
// Unpublished='1',
// Published=1,
// }
//枚举类型会影响我们编译后的代码 建议使用常量枚举
const enum PostStatus {
Draft='212',
Unpublished='1',
Published=1,
}
// 这里的status是一个固定切换的值,js中并没有这种对象,一般都是模拟一个对象来使用,在ts中有专门的枚举类型来处理这种情况
const con = {
title:'122121',
content:'11111111111111111111111111111111111111111222222222222222',
status:PostStatus.Draft//2//1//0
}
函数类型
export {}
//函数类型
//声明式函数
// 参数的类型放到参数后面,返回值类型放到参数括号之后
// function fun1(a:number,b:number):string{
// return 'fun1'
// }
// fun1(100,200)//这里参数的个数也是固定的,类型必须是数字
// 也可以通过参数后面加问号变成可选参数,或者设置参数默认值 但是必须放到参数的最后
// function fun1(a:number,b?:number):string{
// return 'fun1'
// }
// function fun1(a:number,b:number=1):string{
// return 'fun1'
// }
// 如果要接收任意个数的参数 可以使用es6 rest操作符
function fun1(a:number,b:number=1,...rest:number[]):string{
return 'fun1'
}
//-----------------------------------------
// 函数表达式
// 利用以下方法定义变量的类型
const fun2:(a: number, b?: number, ...rest: number[]) => string = function(a:number,b:number=1,...rest:number[]):string{
return 'fun1'
}
Any类型
export {}
//任意类型 弱类型
function aaa(value:any){
return JSON.stringify(value)
}
aaa(100)
aaa('stri')
aaa(null)
// 这里any类型可以接收任意类型。语法上都不会报错
//any类型不安全
隐式类型推断
export{}
let a = 18//number
// a='111'//会报错
let foo
foo ='11'
foo =11
// 虽然隐式类型推断可以帮我们省略一部分代码,但是为了代码的可阅读性尽量在添加类型注解
接口
//接口
export{}
//这里使用分号(;)分隔 可省略
interface Post{
title:string
content:string
subtitle?:string//加问号代表可选
readonly summary:string// 只读 成员
}
function foo(post:Post){
console.log(post.title)
console.log(post.content)
}
// foo({
// title:'111111111',
// content:'hhhhhhhhhhhhhhhhhhhhhhhh'
// })
//编译后 并不会出现接口的定义,只是为约束有结构的数据类型做的
//*------------------------------------
// 动态成员
interface hhh{
[key:string]:string
}
const abc:hhh = {}
abc.f = '111'
abc.b = '222'
class 类和类的修饰符
export{}
class person {
//可以在这里给赋值默认值,也可在执行器中动态赋值二选一不然报错
public name:string //='swh' public代表公有成员 默认值
private age:number //private 代表私有属性
protected readonly gened:boolean //protected 代表受保护的 只允许在子类中访问 readonly代表只读属性,如果已有修饰符,需要放到修饰符之后
constructor(name:string,age:number){
//使用前必须先声明
this.name = name
this.age = age
this.gened =true
}
sayHi(msg:string):void{
console.log(`${this.name},${msg}`)
console.log(this.age)
}
}
class student extends person{
private constructor(name:string,age:number){//关于构造函数的修饰符
super(name,age)
// console.log(this.age)//不能访问age属性
console.log(this.gened)//可以访问
}
static yoo(name:string,age:number){
return new student(name,age)
}
}
const aaa = new person('swh',19)
console.log(aaa.name)
// console.log(aaa.gened)
// console.log(aaa.age)//在外部访问私有属性会报错
// const bbb =new student()//报错访问不到
const bbb = student.yoo('swh',12)
类与接口
export{}
//类与接口
interface eat{
eat(food:string):void
}
interface run{
run(distance:string):void
}
class ren implements eat{
eat(food:string):void{
console.log(`吃${food}`)
}
run(distance:string):void{
console.log(`怎么跑?${distance}`)
}
}
class dongwu implements eat,run{
eat(food:string):void{
console.log(`吃${food}`)
}
run(distance:string):void{
console.log(`怎么爬?${distance}`)
}
}
抽象类
export {}
abstract class Animal {//定义抽象类的关键词 abstract
eat(food:string):void{
console.log(`hhh${food}`)
}
abstract run(distance:number):void
}
// const dongwu =new Animal()//抽象类之后不能直接创建
class Dog extends Animal{
run(distance: number): void {
console.log('跑跑跑',distance)
}
}
const dog =new Dog()
dog.eat('mian')
dog.run(20)
泛型
//泛型
//在创建的时候不去指定类型,在使用的时候在指定
function arr(length:number,value:number):number[]{
// const arr1 = Array(length).fill(value)//这里的Array就是一个泛型需要在使用的时候指定类型
const arr1 = Array<number>(length).fill(value)
return arr1
}
const res = arr(5,100)//这样只能创建 一个全是数字的数组
// 如果我们需要创建一个字符串的数组 最笨就是复制一个,但是这样 代码会有冗余
function arr2(length:number,value:string):string[]{
const arr3 = Array<string>(length).fill(value)
return arr3
}
//-------------------------------------
function arrall<T>(length:number,value:T):T[]{
const arr3 = Array<T>(length).fill(value)
return arr3
}
const all = arrall<string>(5,'100')
const all2 = arrall<number>(5,50)
console.log(all,all2)