TypeScript 描述文件中的全局类型
index.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.js"></script> <script src="./page.ts"></script> </body> </html>
page.ts
$(function () {
$(‘body‘).html(‘<div>121212</div>‘);
new $.fn.init()
})执行 npm start("start": "parcel ./src/index.html")。这个时候浏览器弹出了111，但是编辑器还是会报错，提示 Cannot find name ‘$‘. Do you need to install type definitions for jQuery? Try `npm i @types/jquery`。让我们安装 @types/jquery。因为在 ts 里面直接引用了 js，所以不能正确的识别，这个时候需要去写个类型注解文件，帮助去打通 ts 和 js 的鸿沟
之前我们是安装别人写好的 .d.ts 文件。这次我们自己去写
page.d.ts
// 声明一个全局变量，叫做 $，接收一个函数，返回值是 void
// declare var $: (param: () => void) => void;
interface JqueryInstance {
html: (html: string) => JqueryInstance
}
// 函数重载
declare function $(readyFunc: () => void): void;// 定义全局函数 $可以接收一个函数，函数重载
declare function $(selector: string): JqueryInstance;// 定义全局函数 $可以接收一个字符串，函数重载
// 如何对对象进行定义，以及对类进行类型定义，以及命名空间的嵌套
declare namespace $ { // $.fn.init
namespace fn{
class init{}
}
}
// 使用 interface 的语法，实现函数重载
// interface JQuery{
// (readyFunc: () => void): void;
// (selector: string): JqueryInstance
// }// 直接这样写 ts 文件的 $ 还是会报错的，还需要定义
// declare var $: JQuery; 相关推荐
彤庆的技术 2020-09-02
锅哥 2020-06-12
changcongying 2020-11-02
changcongying 2020-10-30
苗疆三刀的随手记 2020-10-29
zouph000 2020-10-25
Jruing 2020-10-23
ctg 2020-10-14
PMJ0 2020-10-13
ChaITSimpleLove 2020-10-06
小飞侠V 2020-09-25
QiaoranC 2020-09-25
changcongying 2020-09-17
taizuduojie 2020-09-15
淼寒儿 2020-09-13
lyjava 2020-09-11
锅哥 2020-08-27
ruanhongbiao 2020-08-16