TypeScript 中的非基础类型声明

前言

在使用 TypeScript 进行类型声明时，除了使用到 boolean 、number、string、Array 等基础类型，还会使用到 DOM 元素的声明，或者 setInterval 等常用方法的声明。自己刚开始使用 TypeScript 的时候，会对这些非基础类型的声明感到困扰，因此，本文将记录自己困扰过的 TypeScript 非基础类型的声明。

版本说明

TypeScipt 版本：TypeScript 3.1； PixiJS 版本：5.0.1;

非基础类型的声明

DOM 元素的类型声明

安装 TypeScript 时，默认会引入 lib.dom.d.ts 文件，该文件提供了 DOM 元素的类型，我们直接使用就可以。

// <div>
const div:HTMLDivElement = document.createElement(div);

// <img>
const img:HTMLImageElement = document.createElement(img);
const img:HTMLImageElement = new Image();

...
复制代码

canvas 的类型声明

const canvas:HTMLCanvasElement = document.createElement(canvas);
const ctx:CanvasRenderingContext2D = canvas.getContext(2d);
复制代码

setInterval 声明

let timer:number = setInterval(()=>{
    
},500);
复制代码

自定义类型的声明

嵌套数组的类型声明

// 自定义接口
interface Position {
    x:number;
    y:number;
}

// 声明一个嵌套数组
const positionArray:Array<Array<Array<Position>>> = [
     [
          {
               x:0,
               y:0,
          }
     ]
]
复制代码

PixiJS 中的类型声明

const bg:PIXI.Sprite = new PIXI.Sprite();
复制代码

bg.on(pointerdown,(e:PIXI.interaction.InteractionEvent):void=>{
    
});
复制代码

总结

以上是自己在使用 TypeScript 过程中用到的一些非基础类型声明，一些使用过但疏漏的会在日后补充到文章； 文档名词描述可能存在不恰当的情况，欢迎指正； 本文长期更新，如果你有遇到什么问题可以留言，我们一起探讨。

更多文章

查看 网易创意部 其他小伙伴的文章： 查看我的更多文章：

const div:HTMLDivElement = document.createElement(div); // const img:HTMLImageElement = document.createElement(img); const img:HTMLImageElement = new Image(); ... 复制代码 canvas 的类型声明 const canvas:HTMLCanvasElement = document.createElement(canvas); const ctx:CanvasRenderingContext2D = canvas.getContext(2d); 复制代码 setInterval 声明 let timer:number = setInterval(()=>{ },500); 复制代码 自定义类型的声明 嵌套数组的类型声明 // 自定义接口 interface Position { x:number; y:number; } // 声明一个嵌套数组 const positionArray:Array >> = [ [ { x:0, y:0, } ] ] 复制代码 PixiJS 中的类型声明 const bg:PIXI.Sprite = new PIXI.Sprite(); 复制代码 bg.on(pointerdown,(e:PIXI.interaction.InteractionEvent):void=>{ }); 复制代码 总结 以上是自己在使用 TypeScript 过程中用到的一些非基础类型声明，一些使用过但疏漏的会在日后补充到文章； 文档名词描述可能存在不恰当的情况，欢迎指正； 本文长期更新，如果你有遇到什么问题可以留言，我们一起探讨。 更多文章 查看 网易创意部 其他小伙伴的文章： 查看我的更多文章：