TypeScript常用知识之--模块和类型组合这是我参与8月更文挑战的第8天，活动详情查看：8月更文挑战模块 1.导

这是我参与8月更文挑战的第8天，活动详情查看：8月更文挑战

因为Typescript的持续火爆，分享下TS的常用知识点，我们一起学习交流，一起加油！

模块

1.模块在其自身的作用域里执行，而不是在全局作用域里；这意味着定义在一个模块里的变量，函数，类等等在模块外部是不可见的，除非你明确地使用 export形式之一导出它们。

相反，如果想使用其它模块导出的变量，函数，类，接口等的时候，你必须要导入它们，可以使用 import形式之一。

2.模块的导入使用import 而导出使用export

3.如果没有import 或者 export 被 import "./a.ts" 将改变全局变量产生副作用，所以不推荐

1.导出

export const a: string = "1";
  // 导出函数
  export const fn = function (a: string) {};
  // 默认导出 字符串 (名字可以省略)
  // export default "string";

  // 默认导出 对象 (名字可以省略)
  // export default {
  //   a:1,
  //   b:'s'
  // }

  // 导出接口
  export interface Person {
    name: string;
  }

  // 导出类型
  export type Fish = {};

  // 导出类
  export class PoliceMan implements Person {
    name: string = "policeMan";
  }

  //导出重命名
  export {PoliceMan as PlM}

  //重新导出
  //先引入在改名重新导出
  export {A as B} from "./a";

  // 把多个模块合并到一起，先把其他的地方的模块引入进来，在联合导出
  export * from "./StringValidator";
  export * from "./LettersOnlyValidator";
  export * from "./ZipCodeValidator";

  // commonjs 导出 validator.ts
  class Validator {
       isAcceptable(s: string) {
           return s.length === 5
       }
   }
  export = Validator;

2.导入

// 针对 export const a ='str' 的导入
 import { a } from './a'

// 针对 export default的导入
 import B from './b'

// 导入的重命名
 import {Aclass as A } from './a';
 A.fn();

// 具有副作用的导入,不推荐这样可能会修改全局变量
 import "./my-module.js";

// commonjs 导入
 import zip = require("./validator.ts");

3.命名空间

export namespace zoom {
    export class Dog {
        eat() {}
    }

    export namespace moneyArea {
        export class Monkey {
            eat() {}
        }
    }
}
let dogOfZoom = new zoom.Dog();
let dogOfZoom1 = new zoom.moneyArea.Monkey();
    
// 命名空间别名
namespace Shapes {
    export namespace Polygons {
         export class Triangle {}
            export class Square {}
        }
 }

import polygons = Shapes.Polygons;
let sq = new polygons.Square();

类型组合

类型在TS中很重要，所以有时候通过一些类型的组合会产生新的类型

1. any 组合类型

any和任何元素组合的都是any类型

function addOne(a: any) {
    return a + 1;
}

function sum(a: number, b: number) {
    return a + addOne(b);
}

let res2 = sum(1, 2); // any 类型

2.交叉类型

当交叉属性的时候是取并集，但是当交叉对象的时候是取交集

interface X {
    name: string;
    age: number;
}

interface Y {
    gender: string;
}

// 这个时候取并集
type C = X & Y;

let res3: C = {
    name: "z",
    age: 11,
    gender: "male",
};

// 这个时候是取交集
type XX = string | boolean;
type YY = number | boolean;

type CC = XX & YY; // CC是boolean
let res4: CC = true;

3.联合类型

interface X1 {
    name: string;
    age: number;
}

interface Y2 {
    gender: string;
    hasName: boolean;
}

// 这个时候取并集
type C1 = X1 | Y2;

// 可以是 Y2 也可以是X1类型
let res5: C1 = {
    hasName: false,
    gender: "male",
};

let res6: C1 = {
    name: "name",
    age: 11,
};

4.嵌套类型

interface DD {
    name: "z";
    age: 11;
    person: {
        canSwim: boolean;
    };
}

let d: DD["person"] = {
    canSwim: true,
};

5.克隆类型

通过keyof来克隆一个类型

interface Person6 {
    name: string;
    age: number;
    canSwim: boolean;
}

type ClonePerson6 = {
    // 一定要加keyof
    [key in keyof Person6]: Person6[key];
};
let res7: ClonePerson6 = {
    name: "string",
    age: 1,
    canSwim: false,
};

TypeScript常用知识之--模块和类型组合

模块

1.导出

2.导入

3.命名空间

类型组合

1. any 组合类型

2.交叉类型

3.联合类型

4.嵌套类型

5.克隆类型

相关资料