安装:npm install typescript -g
查看版本号:tsc -v
查看命令:tsc --help
运行:cls >>tsc 文件名.ts >>node 文件名.js
在node上直接运行:
安装:npm install @types/node -D >>> npm install ts-node -g
运行:ts-node 文件名.ts
html与ts文件连接(ts同步js)
tsc 文件名.ts --watch
创建ts文件:echo ''>index.ts,''表示内容为空
创建tsconfig文件:tsc -init
any和unknown区别:
1.unknown不可以调用属性和方法
//报错
let unkown:unknown={a:123}
unkown.a
//报错
let unkown:unknown={a:():number=>123}
unkown.a
2.unknown只能赋值给unknown或者any,any没有要求
//报错
let str:unknown='123'
let str1:string='1234'
str1=str
//不报错
let str:unknown='123'
let str1:any='1234'
str1=str
Object ,object, {}
1.Object表示包含所有类型,等于任何一个值,可以任意赋值
2.object只能赋值引用类型
let a:object='123'//错误 原始类型
let a1:object=123//错误 原始类型
let a2:object=false//错误 原始类型
let a3:object=[]//正确
let a4:object={}//正确
let a5:object=()=>123//正确
3.{}类似于Object ,但是无法对变量进行赋值操作
//报错
let a:{}={name:123}
a.age=234
interface中?表示非必须,[propName:string]:any表示任意属性 ,|表示联合类型,readonly表示只读,赋值报错
interface Person{
name:string,
age?:number,
cb():number,//接口里定义函数
[propName:string]:string | number
}
let p:Person={
name:"张三",
abc:123
cb:()=>{
return 123
}
}
//类型加中括号
let arr:number[] = [1,2,3]
//这样会报错定义了数字类型出现字符串是不允许的
let arr:number[] = [1,2,3,'1']
//操作方法添加也是不允许的
let arr:number[] = [1,2,3,]
arr.unshift('1')
// 普通类型
var arr: number[] = [1, 2, 3]; //数字类型的数组
var arr2: string[] = ["1", "2"]; //字符串类型的数组
var arr3: any[] = [1, "2", true]; //任意类型的数组
//泛型
let arr4:Array<number> = [1,2,3,4,5]
void表示没有返回值
fn(params:number):void{}表示没有return返回值,直接输出
let u:void=undefined
let n:void=null
let u:undefined=undefined
let n:null=null
//两种都行,但使用let u:undefined=undefined可赋值,使用void不可赋值
如果出现
终端:tsc -init 创建tsconfig.json找到strict,改为false
强转:0,1改成true或false !/!!
let fn =function(type:number|boolean):boolean{
return !!type
}
let res = fn(1)
函数类型:
const fn = function(name:string,age?:number):void{
console.log(age+name);
}
fn("11",11)
//接口类型
interface Use{
name:string,
age:number
}
const fn = function(use:Use):Use{
return use
}
fn({
name:"张三",
age:18
})
函数重载
function fn(params:string):void
function fn(params:string,params2:number):void
function fn(params:any,params2?:any):void{
console.log(params,params2);
}
fn("11")
交叉类型:
类型断言:
//断言
interface A{
run:string
}
interface B{
bulid:string
}
const fn =function(type:A | B):void{
console.log((<B>type).bulid);
}
//或者
interface A{
run:string
}
interface B{
bulid:string
}
const fn =function(type:A | B):void{
console.log((type as B).bulid);
}
window.abc=123//报错
(window as any).abc=123//不报错
class类
class Person{
//需定义否则报错
name:string
age:number
sub:boolean
constructor(name:string,age:number,sub:boolean){
this.name=name
this.age=age
this.sub=sub
}
}
new Person("张三", 18, false )
//或者
class Person{
//需定义否则报错
name:string
age:number=0
sub:boolean
constructor(name:string,age:number,sub:boolean){
this.name=name
// this.age=age
this.sub=sub
}
}
new Person("张三", 18, false )
类的修饰符public private protected,static
1.public内外部都可访问,不写默认public
2.private只有内部可访问
3.protected内部和子级访问
4.static只可访问静态
class Person{
//需定义否则报错
protected name:string
public age:number=0
sub:boolean
constructor(name:string,age:number,sub:boolean){
this.name=name
// this.age=age
this.sub=sub
}
}
let p=new Person("张三", 18, false )
p.age//正确
p.name//错误
class Person{
//需定义否则报错
protected name:string
public age:number=0
private sub:boolean
constructor(name:string,age:number,sub:boolean){
this.name=name
// this.age=age
this.sub=sub
}
}
class Man extends Person{
constructor(){
super("张三", 18, false )
this.name//正确
this.sub//错误
}
}
let p=new Person("张三", 18, false )
class Person{
name:string
age:number
sub:boolean
static aa:string='12345'
constructor(name:string,age:number,sub:boolean){
this.name=name
this.age=age
this.sub=sub
this.run()//报错
}
static run(){
this.aa//正确
this.age//报错
}
}
class Man extends Person{
constructor(){
super("张三",22,false)
this.age
}
}
let p=new Person("张三",22,false)
p.aa//报错
接口类,使用implements连接
interface A{
run():boolean
}
interface B{
set():void
}
class Man{
params:any
constructor(params:any){
this.params=params
}
}
class Person extends Man implements A,B{
run(): boolean {
return
}
set(): void {
}
}
interface A{
run():void
}
interface B{
name:string
}
class Man{
params
constructor(params){
this.params=params
}
}
class Person extends Man implements A,B{
name:"张三"
run():void{
}
}
抽象化类:类实例化后毫无用处,可定义为抽象类
抽象类中可以添加抽象方法抽象方法只能定义抽象类中,子类必须对抽象方法进行重写
abstract class A{
name:string
constructor(name:string){
this.name=name
}
setName(name:string){//普通方法
this.name=name
}
abstract getName():string
}
class B extends A{
constructor(){
super("张三")
}
getName(): string {
return this.name
}
}
let b =new B()
b.setName("11")
console.log(b.getName());
枚举enum(只能用const定义,不可用let或者var)
//数字枚举(默认从0开始)
enum Color{
red,
green,
blue
}
console.log(Color.red)//0
//增长枚举
enum Color{
red=1,
green,
blue
}
console.log(Color.red)//1
console.log(Color.green)//2
//字符串枚举
enum Color{
red='red',
green='green',
blue='blue'
}
console.log(Color.red)//red
console.log(Color.green)//green
//异构枚举
enum Color{
yes=1,
no='no'
}
console.log(Color.yes)//1
console.log(Color.no)//no
//接口枚举
enum Color{
yes=1,
no='no'
}
interface A{
red:Color.yes
}
let obj:A={
red:Color.yes
}
//反向映射(不支持字符串)
enum Types{
success
}
let aa:number = Types.success
let key =Types[aa]
console.log(`value---${success}`,`key---${key}`)//value---0 key---success
类型别名
type s =string|number
let str:s='22'
type cb=()=>string
let fn:cb=()=>"11"
type t='yes'|'no'|5
let type ='yes'
never
interface A{
type:'1'
}
interface B{
type:'2'
}
type All = A|B
function type(val:All){
switch(val.type){
case '1':
break
case "2":
break
default:
const check:never=val
break
}
}
symbol(只能传字符串和数字)
let s:symbol=Symbol('11')
let obj={
[s]:'value',
name:'22'
}
console.log(obj[s]);//obj[s]取值
//不能取到symbol
for(let key in obj){
console.log(key);
}
console.log(Object.keys(obj));
console.log(Object.getOwnPropertyNames(obj));
console.log(JSON.stringify(obj));
//可以取到
console.log(Object.getOwnPropertySymbols(obj));
console.log(Reflect.ownKeys(obj));
迭代器
type MapKeys=string|number
let arr:Array<number>=[1,2,3]
let set:Set<number>=new Set([1,2,3])
let map:Map<MapKeys,MapKeys>=new Map()
map.set('1','张三')
map.set("2",'李四')
function gen(erg:any){
let it=erg[Symbol.iterator]()
let next:any={done:false}
while(!next.done){
next=it.next()
if(!next.done){
console.log(next);
}
}
}
gen(map)
生成器
type MapKeys=string|number
let arr:Array<number>=[1,2,3]
let set:Set<number>=new Set([1,2,3])
let map:Map<MapKeys,MapKeys>=new Map()
map.set('1','张三')
map.set("2",'李四')
for(let key of arr){
console.log(key);
}
//如果用for in 生成的是索引值
for(let key in arr){
console.log(key);//0,1,2
}
es6新增拿到对象所有属性
Reflect.ownKeys(obj)
泛型:
function add<T>(a:T,b:T):Array<T>{
return [a,b]
}
add<number>(1,2) || add(1,2)
add<string>('1','2') || add('1','2')
定义多个类型的泛型
function sub<T,U>(a:T,b:U):Array<T|U>{
let arr:Array<T|U>=[a,b]
return arr
}
sub(a,false)
泛型约束
interface Len{
length:number
}
function getLength<T extends Len>(arg:T){
return arg.length
}
getLength([1,2,3])
//keyof约束泛型对象
function add<T,K extends keyof T>(obj:T,key:K){
return obj[key]
}
let s={
a:1,
b:2,
c:3
}
add(s,'a')//正确
add(s,'d')//报错
class pop<T>{
attr:T[]=[]
add(a:T):T[]{
return [a]
}
}
let a = new pop<number>()
a.attr=[1,2,3]
配置tsconfig文件)
https://xiaoman.blog.csdn.net/article/details/122525099?spm=1001.2014.3001.5502
namespace(利用namespace避免全局变量造成的污染)
1.加export解决
export const a=2
2.使用命名空间
namespace A{
export const a=2
}
console.log(A.a);
//嵌套
namespace A{
export namespace B{
export const a=2
}
}
console.log(A.B.a);
//通过import起别名
namespace A{
export namespace B{
export const a=2
}
}
import Q=A.B
console.log(Q.a);
//合并(与接口类似)
namespace A{
export const a=2
}
namespace A{
export const b=3
}
namespace A{
export const a=2
export const b=3
}
三斜线
//类似引入
///<reference path='XXXX'/>
//声明文件
///<reference types='node'/>
声明文件
declare var 声明全局变量
declare function 声明全局方法
declare class 声明全局类
declare enum 声明全局枚举类型
declare namespace 声明(含子属性的)全局对象