ts的一些

以js为基础构建的语言
一个js的超集
引入了类型(type)的概念给变量赋予类型：让从动态类型语言(js)变成静态类型语言(ts)
让变量的类型明确
扩展了js 可以在任何支持js的平台中执行 比js复杂 可维护性更高
ts不能被js解析器执行 不能再浏览器中直接执行 ts会被编译为js
如果变量的声明和赋值是同时进行 ts可以自动对变量进行类型检测let c=false //现在c就是boolean
函数后加:number表示返回结果function sun(a:number,b:number):number{ return a+b }
有时候不需要运行ts代码把ts文件写入一个html 从script标签引入 运行html文件即可

类型

1. number
2. string
3. Boolean
4. 字面量 let a:10赋值一次不可修改，可以跟let a:boolean | string也可以写具体值竖线或
5. any任意类型关闭类型检测 声明变量不声明类型就会被ts设置为any any的类型值赋值给别的变量时会导致其它变量也会变成any
6. unknown未知类型 未知类型赋值给别的类型会报错 判断未知类型后可以赋值给对应的变量 类型断言：s = e as string 或 <atring>e告诉解析器变量的实际类型 不确定类型的变量尽量用unknown
7. void 表示为空 以函数为例 表示没有返回值的函数
8. never 没有值
9. object 很少使用 对对象的设置主要是对对象属性的限制 {}涌来指定对象中可以包含哪些属性let b:{ name:string，age?:number }属性名后面加一个？表示属性是可选的 表示任意属性let c:{name:string,[propName:string]:any}其它属性任意类型 要是写string value只能是string propName可以自行修改；设置函数类型声明 语法：(形参：类型，形参：类型…)=>{返回值} `let d:(a:number,b:number)=>number
10. array let e:string:[] //表示字符串数组 let g:Array<number> //表示数值数组
11. tuple元组 固定长度的数组let h:[string,string]
12. enum枚举 enum Gender={male=0,female=1} let i:{name:string,gender:Gender} i={name:"",gender:Gender.male}
    |或 &与

let j:{name:string}&{age:number}
j={name:'',age:}

//类型别名
type myType=1|2|3|4
let k:myType
k=5 //报错
//或者
type myType=string

编译选项

tsc xxx.ts -w
编译文件夹下所有文件tsc需要一个配置文件tsconfig.json
tsconfig.json是ts编译器的配置文件 ts编译器可以根据它的信息来对代码进行编译

1. include(包含) 用来指定哪些文件需要被编译 按目录检索 **表示任意目录 *表示任意文件"include":["./src/**/*"]
2. exclude(不包含) 不被编译的文件 默认值 node_modules、bower_components、jspm_packages
3. extends 定义被继承的配置文件
4. files 指定被编译的文件列表 只有编译很少的文件才会用到 需要列出文件
5. complierOptions编译器选项 决定编译器如何对ts文件进行编译 包含很多子选项

//默认情况下转换es3
"complierOptions":{
  "target":"ES6",//写错会报错 提供可选项 es2016=es6
  "module":"" //编译成的js指定要使用的模块化规范 推荐es6 可选项commonjs、none、amd、system、umd、es6、es2015、es2020、esnext
  "lib":[] //制定项目中需要的库 dom(指定后才可以使用document.) 一般情况不需要改 在浏览器中运行的代码不需要改 有默认值不需要改
  "outDir":"" //指定编译后文件所在目录 "./dist"
  "outFile":"./dist/app.js" //将代码合并为一个文件 全局作用域中的代码会合并到同一个文件夹 如果想合并多个模块的文件(一个文件中引入了其他文件) 需要把moudules改成 amd或者system 不经常用 这里会用打包工具来处理
  "allowJs":true //是否对js文件进行编译
  "checkJs":true //是否检查js代码
  "removeComments":true //是否编译注释 console
  "noEmit":false //不生成编译后的文件 执行编译 不生成js
  "noEmitOnError":false //当有错误时不生成编译后的文件
  "strict":false //所用严格检查总开关 包含下面四项 建议为true 代码更严谨
  "alwaysStrict":false //是否在编译后的js文件使用严格模式 在引入其它模块代码时 改文件会使用严格模式 不用设置
  "noImplicitAny":true //不允许隐式any 需要给变量加类型
  "noImplicitThis":true //不允许不明确类型的this
  "strictNullChecks":false //严格检查空值 比如获取不存在的值
}

6. webpack
   大型项目会结合webpack打包工具npm -init -y生成package.json

面向对象

比如
操作浏览器：window对象
操作网页：document对象
操作控制台：console对象
类
属性+方法 操作对象的属性或者方法
类对象的模型 定义对象 规定对象的属性和方法
加static用类访问 不加用实例访问 就是new一下

//用class定义一个类
//对象中主要包含属性和方法需要在类中表现
class Person{
  //直接定义的属性时实例属性 需要通过对象的实例去访问
  //使用static开头的属性时静态属性 可以直接通过类取访问
  //静态属性将不可以通过对象实例访问反之同样
  //定义实例属性
  //实例属性：前面加readonly只读属性；静态属性：static readonly
  name:string="xxx",
  static age:number=0，//静态属性
  //或者可以直接写 会自动判断类型 即赋值的变量会被定义类型
  name="",
  age=0
  //定义方法 也可以加static 
  sayHello(){}
}

const per = new Person() //只有new(实例化)之后才能访问
console.log(per)
console.log(Person.age)//会报错 想这么使用需要定义类属性 在属性前使用static关键字可以定义类属性(静态属性)

构造函数

class Cat{
  name:string,//在属性中定义构造函数时赋值
  age:number,
  constructor(name:string,age:number){
    //在实例方法中this表示当前实例 表示当前新建的对象
    this.name=name,
    this.age=age
  },
  voice(){
    //哪个对象调这个方法this就是谁 当前调用实例
  }
}
const cat=new Cat('1',0)//穿的值不同会创建不同对象
const cat2=new Cat('2',1)

我们需要调用时创建不同的对象 不能定义类中的属性 使用构造函数constructor
继承

//这里是一个立即执行函数
   
(function(){
  class Animal{
    name:string,
    constructor(name:string){
     this.name=name
   },
  }
  class Cat extends Animal{
  //使用继承后 子类会继承父类的所有属性方法
  //通过继承可以将多个类中共有的代码写在一个父类中 这样只需要写一次即可让所有的子类同时拥有父类的属性和方法
  //如果在子类添加和父类相同的方法会覆盖父类 方法重写
    run(){
      console.log(`${this.name}在跑`)
    }
  }
  //这是两个属性方法相同的类
  class Cat{
    name:string,
    constructor(name:string){
      this.name=name
    }
  }
  class Dog{
    name:string,
    constructor(name:string){
      this.name=name
    }
  }
})()

//super 代表当前类的父类
(function(){
  class Animal{
    name:string,
    say(){}
  }
  class Cat extends Animal{
    age:number,
    constructor(name:string,age:number){
     //如果在子类中写了构造函数需要调用父类构造函数 不然会报错 继承会出现问题
     super()
     this.age=age
    }
    say(){
     super.say()
    }
  }
})()

//抽象类 禁止父类创建对象 就是专门被继承的类 不能直接new这个类
//抽象类中可以添加抽象方法
abstract class Animal{
  //抽象方法只定义在抽象类中 子类必须对抽象方法进行重写
  abstract say():void;
}
class Cat extends Animal{
  say(){
  //写方法
  }
}

//接口 类似抽象类
(function(){
  type myType={
    name:string,
    age:number
  };//不能重复声明 接口可以重复声明
  const obj:myType={
    name:"xxx",
    age:0
  };
//接口用来定义一个类结构 用来定义一个类中应该包含的属性和方法
//同时接口也可以当成类型声明去使用
  interface myInterface{
    name:string;
    age:number
  }
})()

属性

//public 修饰的属性可以在任意位置访问修改默认值
//private 私有属性 智能在类内部访问  添加方法使私有属性在外部被访问getName(){return this.name}