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

这是我参与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 官网

你们喜欢的能够看看个人专栏 (TypeScript经常使用知识) 我会尽可能保持天天晚上更新，若是喜欢的麻烦帮我点个赞，十分感谢

你们若是喜欢“算法”的话，能够看看我分享的另一个专栏（前端搞算法）里面有更多关于算法的题目的分享,但愿能帮助你们更深的理解算法

文章内容目的在于学习讨论与分享学习算法过程当中的心得体会，文中部分素材来源网络，若有侵权，请联系删除，邮箱 182450609@qq.com