如何学习一门语言

是什么? 与es的关系?

代码格式的流转?

我们在做什么?

// C-D 强数据操作import { observable, action } from 'mobx'export default class StoreBase {  service: any  @observable state = ''  @observable list = []  @observable loading = false  @observable totalCount = 0  @observable counter = 0  @observable pageSize = 10  @observable pageIndex = 1  @observable submiting = false  @observable initialFormValue = {}  constructor(service) {    this.service = service  }  @action changeSize(pageSize) {    this.pageSize = pageSize  }

@action async getPageList(options: { pageIndex?: number, pageSize?: number }) {    options.pageIndex = options.pageIndex || this.pageIndex    options.pageSize = options.pageSize || this.pageSize    this.pageIndex = options.pageIndex    this.pageSize = options.pageSize    this.loading = true    const result = await this.service.list(options)    this.loading = false    this.list = result.data    this.totalCount = result.totalCount  }

@action async add(body) {    this.submiting = true    try {      const result = await this.service.add(body)      if (result.statusCode && result.statusCode !== 200) {        throw new Error(result.message)      }    } catch (error) {      throw error    } finally {      this.submiting = false    }  }

@action async edit(id, body) {    this.submiting = true    try {      const result = await this.service.update(id, body)      if (result.statusCode && result.statusCode !== 200) {        throw new Error(result.message)      }    } catch (error) {      throw error    } finally {      this.submiting = false    }  }  @action async remove(id) {    try {      await this.service.delete(id)      this.getPageList({ pageIndex: this.pageIndex })    } catch (error) {      throw error    }  }  @action initializeForm(form) {    this.initialFormValue = form  }}

我们做的web application是由组件集组装起来的, application的质量取决于 组件的质量

ts 有什么? 是如何使得我们能产出高质量组件

类型系统 之 原子类型

// booleanlet judge: boolean = true;// stringlet girl: string = `${family.join('======')}`;// anyconst think: any = {}think = [];think = '';think = 1037;// voidfunction select(): void {     return null;}// neverfunction logger(message: string): never {     throw new Error(message);}

类型系统 之 组合类型

// 数组类型let family: string[] = ["epuisite", "love", "detail"];let team: Array
    
      = [1, 3, 7];interface teamArray {     [index: number]: any}let t: teamArray = [1, 2, 3, {1: 3}];// 元组let structure: [string, Array
     
      ];structure = ['why', ['atomic element', 'what']];structure[2] = 'how';structure[3] = ['when'];
     
    

// function类型interface Doing {     (type: number, thing: string, when?: string|number): any[]}let mydoing: Doing;function f(type: number = 2, thing?: string, when?: string|number, ...items: any[]) {     return type;}function sf(message: number): number;function sf(message: string): string;function sf(message: number | string): number | string {     if (message as number) {        return 1;    } else {         return '123';    }}

// 枚举类型  数字类型的值const Color = {Red, Green, Blue};enum Direction{      Up=1,      Down,      Left,      Right  }

// 自定义类型// 对象类型 - 接口interface Mother {     readonly id: number,    detail: any[],    learning: string,    love: boolean,    housework?: boolean,    [proName: string]: any}let me: Mother = {    id: new Date().getTime(),    detail: ['water', 137, 'cloud', 'grass', 'nose'],    learning: 'a wider world',    love: true,    doing() {         return 137;    }};

工具 是什么? 怎么用? 为什么用?

泛型

function createArray
    
     (length: number, value: T): Array
     
       {     let result: T[] = [];    for (let i = 0; i < length; i++) {         result[i] = value;    }    return result;}function swap
      
       (tuple: [T, U]): [U, T] {     return [tuple[1], tuple[0]];}interface lengthwish {     length: number}function swap2
       
        (tuple: [T, U]): [U, T] {     return [tuple[1], tuple[0]];}interface createArrayFunc {     
        
         (length: number, value: T): Array
         
          ;}let myCreateArray: createArrayFunc;myCreateArray = function 
          
           (length: number, value: T): Array[T] { let result: T[] = []; for (let i = 0; i < length; i++) { result[i] = value; } return result;}
          
         
        
       
      
     
    

// 联合类型[共有的属性和方法 + 类型推论]let cooperation: string | number | boolean | null | undefined;cooperation = 1;cooperation = null;// 类型断言function determine(config: number[] | string ): boolean {    if ((
    
     config).length || (
     
      config).length) {        return true;    } else {         return false    } }type Name = string;type DoFn = () => string;type cof = Name | Dofn;function o(message: cof): Name {     return '';}