typescript文档知识点

定义类型

// any：和js无异
let a: any = false
a = 1

// 定义数值、字符串、布尔值，对象，数组类型，而且都可以给变量赋值null和undefined
// 基本类型
let num: number = 1
let str: string = 'abc'
let isShow: boolean = false
let a: string | number = 1
a = '123'

// 解构赋值
let [x, y]: [number, string] = [1, '2']
let { a, b }: { a: string, b: number } = { a: '1', b: 2 }

// 数组
let arr1: Array<number> = [1,2,3] // 知道类型
let arr2: number[] = [1,2,3] // 知道类型
let arr3: [string, number] = ['1', 2] // 知道个数和类型顺序

// 对象：对象可以变为任何类型，但是只能用对象的api
let obj: Object = 4
obj = 'string'
obj = {age: 18}
obj.name = 'Ethan' // error，因为obj虽赋值了对象，但是不能添加属性
obj = [1,2]
obj.push(3) // error，因为obj是被定义为对象的，不能用数组的api
let o: { name: string } = { name: 'Ethan' }

函数

// void:函数返回值为空,void设定函数返回值的类型
function ddd (): void { alert('hello') }

// never: 函数返回值永远不存在：意思为报错
function never1 ():never { throw Error('str') }

// ?: 只有一个实参的时候
function fn(x: number, y?: string){
  console.log(x); y && console.log(y)
}
fn(1)

// 箭头函数定义方法
var fn: (a: string, b?: number) => string = function (a, b) { // 假如定义void检验就不准确
  return '1'
}

// 默认参数
var fn = function (name: string, age: number = 20):void {
  console.log(`${name}:${age}`)
}
fn('Ethan', 30)

// 剩余参数：不知道参数有几个
function sum(...res): number {
  return res.reduce((v1, v2) => {
    return v1 + v2
  }, 0)
}
console.log(sum(1,2,3,4,5)) // 15

// 箭头函数
let antzone = (webName:string, age:number):string => {
  return webName + age
}

类

// 存取器：get/set
class User {
  a: string
  get name(): string {
    return this.a
  }
  set name(name: string) {
    this.a = name
  }
}
let b = new User()
b.name = 'Ethan'
console.log(b.a)

class Father {
  // public: 跟正常一样，父类子类外部都能用。protected: 父类子类和各自实例能用，外部不能用。private: 自己和实例能用，外部不能用
  private name: string 
  static sex = '男' // 静态属性,es6也有
  constructor (name:string) {
    this.name = name
  }
  say(): void {
    console.log(`我的名字${this.name}`)
  }
  static saySex(): void { // 静态方法，只能获取静态属性,es6也有
    console.log(111, this.sex)
  }}

class Child extends Father {
  constructor (name: string) {
    super(name)
  }
  say2(): void {
    console.log(`我父亲的名字${this.name}`)
  }}

Father.saySex() // 调用静态方法
var son = new Child('Ethan')
console.log(son.name)
son.say2()

// 抽象类：不能new一个实例，只是约束子类的作用，abstract的say必须在子类中有定义
abstract class Animal {
  public name: string;
  constructor (name: string) {
    this.name = name
  }
  abstract say (): void; // 在子类必须定义
}

class Cat extends Animal {
  constructor (name: string) {
    super(name)
  }
  say (): void {
    console.log(this.name)
  }}

接口

变量写法

// 复杂类型使用接口，可以简化代码
interface Imap {
  x: string, y: string
}
let obj: Imap = { x: '1', y: '2' }

// 可选属性
interface Imap {
  x: string, y?: string
}
let obj1: Imap = { x: '2' }

// 只读属性
interface IPoint {
  readonly x: number, readonly y: string
}
let point: IPoint = { x: 1, y: 'str' }
point.x = 3 // error

// 约定key
interface IIndexType {
  [key: string] = number;
}
let ints: IIndexType = { a: 1 }

// 其他属性不定
interface ImyObj {
  name: string,
  [key: string]: any
}

// 对象中的对象
interface Ichild {
  name: string
}
let obj: { a: Ichild } = { a: { name: 'Ethan' } }

// 数组中的数组
interface Ichild1 {
  [key: number]: string
}
let arr: Ichild1[] = [['1'], ['2', '3']]

函数写法

interface IMap {
  x: number;
}
function fn(obj: IMap):void {
  console.log(obj.x)
}
fn(obj)

// 可选参数
interface IMap {
  x: number, y?: string
}
function fn(obj: IMap):void {
  console.log(obj.x)
  obj.y && console.log(obj.y)
}

// 函数的约定
interface ISearchFunc {
  (source: string, subString: string): boolean;
  输入的实参source和subString是string类型，输出的值为boolean类型
}
简化版：let mySearch: ISearchFunc = function(source, subString) {
  let result = source.search(subString)
  return result > -1
}

// 方法里的函数
interface IObj {
  list: string[]
  changeList: (val: string) => number
}
let obj: IObj = {
  list: [], changeList: (val) => 123
}

对类和基本类型的接口类型写法

// 理解：一般我们可以用基本方法规定基本数据类型的类型，也可以使用下面方法规定
type aStrType = string;
let ass: aStrType = '1';

// 对类进行接口写法：很像抽象类
interface Animal {
  name: string
  eat(str: string): void
}
class Dog implements Animal {
  name: string
  constructor(name: string) {
    this.name = name
  }
  eat(){
    console.log(this.name + '吃粮食')
  }
}
var d = new Dog('小黑')
d.eat()

接口的扩展

对一个接口进行扩展接口属性和方法

interface IPeople {
  eyes: number;
}
enum: computerNum {
  huawei, lenovo, apple, IBM
}
interface IProgramer extends IPeople { // IProgramer接口继承IPeople的属性并添加新的
  computerType: computerNum;
}
let Ethan: IProgramer = {
  computerType: computerNum.apple,
  eyes: 2
}

泛型

给变量设置多个类型，虽然可以设为any，但也就是放弃了类型判断

// 泛型函数：参数可以多个类型
function getData<T>(value: T):T {
  return value
}
interface Demo {
  title: string, name: string
}
getData(123)
getData<string>('123')
getData<Demo>({title: '标题', name: 'Ethan'})

// 泛型接口函数：参数可以多个类型
interface Fn{
  <T>(firstName: T): T
}
let fn1:Fn = function(firstName) {
  return firstName
}
fn1<string>('zhuang')
fn1(123)

// 泛型类
class MinClass<T> {
  public list: T[] = []
  add(value: T): void {
    this.list.push(value)
  }
  min():T {
    var minNum = this.list[0]
    for(var i = 0; i < this.list.length; i++) {
      if (minNum > this.list[i]) {
        minNum = this.list[i]
      }
    }
    return minNum
  }
}
var m1 = new MinClass<number>()
m1.add(1)
m1.add(6)
console.log(m1.min())

// 泛型类深入
class MysqlDb<T> {
  add(info: T): void {
    console.log(info)
  }
}
interface User{
  username: string; password: string
}

interface Article{
  title: string; subTitle: string
}
var u: User = { username: '张三', password: '123456' }
var Db = new MysqlDb<User>()
Db.add(u)
var article: Article = { title: '新闻', subTitle: '国家新闻' }
var Db1 = new MysqlDb<Article>()
Db1.add(article)

枚举

// 枚举：有限且有序的集合
enum Color {red, green, blue}
console.log(Color) // {0: "red", 1: "green", 2: "blue", red: 0, green: 1, blue: 2}
let d = Color;
console.log(d[0]) // 'red'
let c: Color = Color.green;
console.log(c) // 1

enum Color1 {Red = 1, Green, Blue}
// {1: "Red", 2: "Green", 3: "Blue", Red: 1, Green: 2, Blue: 3}

enum Color2 {Red = 1, Green = 2, Blue = 4}
// {1: "Red", 2: "Green", 4: "Blue", Red: 1, Green: 2, Blue: 4}

enum Color3 {Red = 1, Green, Blue}
let colorName: string = Color[2];

断言

// 断言:意思为程序员自己去判断变量的类型，编程判断是否正确
let someValue: any = 'this is a str'
let someNumber: number = (someValue as string).length