您的位置:首页> 前端教程> TS教程

TypeScript declare

2019-5-1 00:16| 作者: admin| 查看: 2292| 评论: 0|来自: 蚂蚁部落

为了增加人性化程度,在IDE编写代码的时候,通常会有智能提示效果。

以VScode为例子,截图如下:

a:3:{s:3:\"pic\";s:43:\"portal/201905/01/001707lakag6mdsg5cj6bl.jpg\";s:5:\"thumb\";s:0:\"\";s:6:\"remote\";N;}

当键入document.的时候,会自动弹出可能的选项,这是VScode内置的功能。

但是当编写jQuery或者其他一些库的代码时候,则没有类似的提示,非常的不方便。

不过可以自定义或者使用已经定义好的d.ts文件来解决此问题。

declare可以向TypeScript域中引入一个变量,在编写代码的时候就能够实现智能提示的功能。

代码实例如下:

[typescript] 纯文本查看 复制代码
declare function func(str: string): void;

应用截图如下:

a:3:{s:3:\"pic\";s:43:\"portal/201905/01/001810m7v3il4vlgl93l4s.jpg\";s:5:\"thumb\";s:0:\"\";s:6:\"remote\";N;}

当输入func会出现智能提示效果;通常代码不是直接写在当前ts文件,而是集中在.d.ts文件,然后引入。

下面给出一些常用的声明演示。

一.声明变量:

[typescript] 纯文本查看 复制代码
declare var ant:string

上面声明一个字符串类型变量ant。

[typescript] 纯文本查看 复制代码
declare const min:1

上面声明一个常量min并赋值1。

二.声明函数:

[typescript] 纯文本查看 复制代码
declare function func(str:string):string

声明一个传递string参数,返回值也是string类型的函数。

三.声明class类:

[typescript] 纯文本查看 复制代码
declare class Person {
  static maxAge: number //静态变量
  static getMaxAge(): number //静态方法
 
  constructor(name: string, age: number)  //构造函数
  getName(id: number): string
}

声明一个类,并且规定若干类成员的类型和访问修饰符等。

四.声明命名空间:

[typescript] 纯文本查看 复制代码
declare namespace space {
  function func(str: string): string;
  let num: number;
}

声明一个命名空间,里面有一个函数成员和变量成员。

五.混合类型:

有些只可能不但是函数,而且又是类或者对象,比如jQuery:

[JavaScript] 纯文本查看 复制代码
new $()
$.ajax()
$()

代码实例如下:

[typescript] 纯文本查看 复制代码
declare function Minx(str:string): void
declare namespace Minx{
  let num:number
}

六.模块化:

很多时候需要通过require的方式引入模块化的代码:

例如以下效果:

a:3:{s:3:\"pic\";s:43:\"portal/201905/01/002109idxwj1qnfrrj40x3.png\";s:5:\"thumb\";s:0:\"\";s:6:\"remote\";N;}

对应的写法如下:

[typescript] 纯文本查看 复制代码
declare module "abcde" {
  export let a: number
  export function b(): number
  export namespace c{
    let cd: string
  }
 }

非常的简单,不再多介绍。


鲜花

握手

雷人

路过

鸡蛋

最新评论

返回顶部