TypeScript学习（四）声明⽂件和declare关键字
前⾔
当使⽤第三⽅库时，我们需要引⽤它的声明⽂件，才能获得对应的代码补全、接⼝提⽰等功能。这是因为前端第三⽅库⼤多都是⾮TypeScript 库，基本上都是使⽤ JS 编写的，在 TS 中使⽤⾮ TS 编写的第三⽅库，需要有个 xx.d.ts 声明⽂件。
【TypeScript 作为 JavaScript 的超集，在开发过程中不可避免要引⽤其他第三⽅的 JavaScript 的库。虽然通过直接引⽤可以调⽤库的类和⽅法，但是却⽆法使⽤TypeScript 诸如类型检查等特性功能。为了解决这个问题，需要将这些库⾥的函数和⽅法体去掉后只保留导出类型声明，⽽产⽣了⼀个描述 JavaScript 库和模块信息的声明⽂件。通过引⽤这个声明⽂件，就可以借⽤ TypeScript 的各种特性来使⽤库⽂件了。】
⾃⼰定义声明⽂件
当我们使⽤的第三⽅npm包没有声明⽂件时需要⾃⼰写，⽅式如下：
// 例1 verify.d.ts
declare module "@ks/mina-verify-page" {
import minaVerify from"@ks/mina-verify-page";
export default minaVerify;
}
// 例2 yoda.d.ts高中报名
declare module "@ks/yoda-kuaishou-plugin" {
import YodaKuaishouPlugin from"@ks/yoda-kuaishou-plugin";
export default YodaKuaishouPlugin;
}
// 例3 vue.d.ts
declare module "*.vue" {
import Vue from'vue'
export default Vue
}
// 例4 ks_ksbridge.d.ts
declare module '@ks/ks-bridge' {
export interface PostVideoParams {
tag?: string;
topic?: string;
magicFaceId?: string;
magicName?: string;
musicId?: string,
musicType?: Number,
name?: string;
id?: string;
imageUrl?: string;
resourceUrl?: string;
version?: string;
showNativeTagPage?: boolean;
activity?: string;
}
export interface CommonShareParam {
platform?: ('timeline' | 'weixin' | 'qq' | 'weibo' | 'qz' | 'copylink' | 'imfriend' | 'imfriend_list')[];
imgUrl?: string;
caption?: string;
desc?: string;
siteName?: string;
siteUrl?: string;
}
export interface ShareParam {
// 必选，分享对应的业务
subBiz: string;
// 必选，分享业务对象的唯⼀标识，举例：urId，photoId等
shareObjectId: string;
// 可选，分享业务对象的类型（可以⽤来区分场景）
shareResourceType?: string;
shareContent?: string;
// 可选，若为fal，则不展⽰⾯板直接发起分享，否则展⽰⾯板
showSharePanel?: boolean;
// 直接发起分享的必要参数
shareDirectActionUrl?: string;
logParams?: string;
// 可选，定制化回流的⽂案，图⽚等，具体会在中台的show/any接⼝⽣效。
tokenStoreParams?: object;
commonConfigs?: object;
forceCommonConfigs?: object;
extraChannelOptions?: Array;
}
export interface Sf2020ShareParam {
subBiz: string;
kwaiTokenTargetUrl?: string;
coverUrls?: Array;
shareUrl?: string;
extTransientParams?: {
shareMessage?: string
}
enableShareToIM?: boolean
}
export interface OpenLiveProfileCardParmes {
targetUrId: string | number;
isDimEnabled?: boolean;
extraInfo?: {
profileOriginSource?: number; // 埋点上报⽤
followSource?: number; // 埋点上报⽤
}
}
interface KsBridge {
ndGiftToGuest: any;
exitWebView();
isSupportAsync(arg0: { api: string; complete: (res: any)=> void; });
getLiveRoomInfo(arg0: { success: (result: any)=> void; fail: (err: any)=> void; });
showConfirmDialog(arg0: {
content: string;
title?: string;
onConfirm: ()=> void;
onCancel: ()=> void;
confirmBtnText?: string;
cancelBtnText?: string;
});
showAlertDialog(arg0: {
content: string;
title?: string;
onConfirm: ()=> void;
confirmBtnText?: string;
});
sniff: {
browrDesc: string; // 浏览器类型，例如 "uc"
deviceHeightAndWidth: any; // 例如 { dph: 1334, dpw: 750 }
iOSVersion: number; // iOS 系统版本，例如 11
isAndroid: boolean;
isIOS: boolean;
isInApp: boolean; // 快⼿主 APP，概念版，极速版，直播伴侣等
isInKwai: boolean; // 快⼿，现不推荐使⽤，后续该字段将被废弃，请改使⽤ isInApp
isInBaidu: boolean; // 百度⼿机客户端
isInWeChat: boolean; // 微信
isInEnterpr: boolean; // 企业微信
isInQQ: boolean; // QQ
isInQQWebBrowr: boolean; // QQ浏览器
isInQzone: boolean; // QQ空间
isInTBS: boolean; // 腾讯浏览服务(Tencent Browr Service) 简称TBS
isInUC: boolean; // UC浏览器
isInWeibo: boolean; // 微博
isInXiaomi: boolean; // ⼩⽶
isInKakaoTalk: boolean; // KaKaoTalk
isInPinterest: boolean; // Pinterest
isInZalo: boolean; // Zalo
isInAcFun: boolean; // A站
supportUniversalLink: boolean;
};听不懂英语
on(options: {
type: string; // 客户端事件类型
handler(ret: any): any; // 事件触发的回调
success?(ret: any): any; // on回调成功的回调
fail?(err: any): any; // on回调失败的回调
complete?(ret: any): any;
}): any;
startGatewayWithdraw(options?: {
url: string
}): any;
config(options?: {
debug?: boolean; // 默认fal
name?: string; // 客户端在 window 上挂载的变量名，如果是其他客户端，例如直播伴侣，可以指定 'livemate' }): any;
commonShare(options: {
param: CommonShareParam;
success?(ret: any): any;
fail?(err: any): any;
}): any;
launchApp(options: {
identifier: string;
success?(ret: any): any;
fail?(err: any): any;
}): any;
startHalfScreenRecharge(options: {
source: string;
卡罗拉和思域
}): any
resister(name: string, bridgeName: string, nameSpace: string, option: object): any; download(options: {
action: string;
url: string;
success?(ret: any): any;
fail?(err: any): any;
complete?(ret: any): any;
}): any;
gameDownload(options: {
action: string;
url: string;
success?(ret: any): any;
fail?(err: any): any;
complete?(ret: any): any;
}): any;
installApk(options: {
action: string;
url: string;
downloadId: string;
downloadName: string;
success?(ret: any): any;
fail?(err: any): any;
complete?(ret: any): any;
}): any;
hasInstalledApp(options: {
identifier: string;
success?(ret: any): any;
fail?(err: any): any;
complete?(ret: any): any;
}): any;
downloadProgress(options: {
action: string;
url: string;
downloadId: string;
success?(ret: any): any;
fail?(err: any): any;
complete?(ret: any): any;
}): any;
gameDownloadProgress(options: {
action: string;
url: string;
downloadId: string;
汽车保养success?(ret: any): any;
fail?(err: any): any;
表示听的词语complete?(ret: any): any;
}): any;
// 视频拍摄和发布
postVideo(options: {
param: PostVideoParams;
tag?: string;
topic?: string;
magicFaceId?: string;
magicName?: string;
name?: string;
id?: string;
activity?: string;
success?(ret: any): any;
fail?(err: any): any;
complete?(ret: any): any;
}): any;
// 设置顶部右侧按钮
tTopRightBtn(options: {
show: boolean;
icon?: 'camera' | 'share' | 'custom';
北京保障房
text?: string;
textColor?: string;
iconUrl?: {
normal: string;
presd: string;
};
onClick?(event: any): any;
}): any;
// 设置顶部右侧按钮
tTopRightSecondBtn(options: {
show: boolean;
icon?: 'camera' | 'share' | 'custom';
text?: string;
textColor?: string;
iconUrl?: {
normal: string;
presd: string;
};
onClick?(event: any): any;
}): any;
// WebView
// 打开新的webview
loadUrlOnNewPage(options: {
url: string;
type: 'back' | 'clo'
}): any;
showToast(options: {
type: 'normal' | 'success' | 'error',
text: string
}): void;
gameTaskSelectImage(options: {
gameId: string,
text: string,
source: string,
requestParam: string,
callback?(ret: any): any
}): void;
tSlideBack(options: {
enabled: boolean;
}): void;
register(name: string, bridgeName: string, nameSpace?: string, option?: object): any;
isSupport(api: String, namespace?: String): boolean;
share(options: {
param: ShareParam,
success?(ret: any): any;
fail?(err: any): any;
complete?(ret: any): any;
})
sf2020Share(options: {
param: Sf2020ShareParam,
success?(ret: any): any;
fail?(err: any): any;
complete?(ret: any): any;
})
成都滴滴
// openLiveProfileCard(options: openLiveProfileCardParmes)
openLiveProfileCard(options: { param: OpenLiveProfileCardParmes, complete?(ret: any): any }) tTopLeftBtn(options: {
show: boolean;
icon: string;
iconUrl?: any
onClick?(ret: any): any;
}): any
tPageTitle(options: {
title?: string;
titleTextColor?: string;
titleBackgroundColor?: string;
}): any
isSupportAsync(options: {
api?: string;
namespace?: string;
complete?(ret: any): any,
component: any
getLiveRoomInfo(options: {
success?(ret: any): any
})
exitWebView(): any
exitCurrentWebview(): any
openWechatMiniProgram(options: {
originalID: string,
path: string,
success?(ret: any): any;
fail?(err: any): any;
complete?(ret: any): any;
}): any
hideNavigationBar(options?: {
success?(ret: any): any;
fail?(err: any): any;
complete?(ret: any): any;
})
getLiveRoomInfo(options: {
success?(ret: any): any;
fail?(err: any): any;
complete?(ret: any): any;
})
popBack()
login(options?: {
checkFromServer?: boolean
success?(ret: any): any;
fail?(err: any): any;
complete?(ret: any): any;
})
tStatusBarStyle(options: { style: 0 | 1 }) exitAll()
openWechatMiniProgram(options: {
originalID: string
path: string
success?(ret: any): any
fail?(err: any): any;
complete?(ret: any): any;
})
requestFollowUrV2(options: {
urId: string
following: boolean
activityId: string,
success?(ret: any): any
fail?(err: any): any;
complete?(ret: any): any;
})
tPhysicalBackButton(options: {
onClick?(ret: any): any;
})
lectImage(options: {
count?: number
sourceType?: string[]
maxFileSize?: number
maxWidth?: number
maxHeight?: number
success?(ret: any): any
fail?(err: any): any
})
getDeviceInfo(options: {
success?(ret: any): any
fail?(err: any): any
})
collapKeyboard()
tBounceStyle(options: {
15个月宝宝身高体重标准表
enable: boolean
})
openBrowr(options: {
url: string
success?(ret: any): any
fail?(err: any): any
})
submitData(options: {
type: string;
data: any;
})
lectAndUploadMedia(options: {
sourceType?: string | string[],
uploadToken?: string,
mediaType: string,
