在ts文件中引入js模塊編寫聲明文件的寫法示例
更新時間：2023年08月29日 09:25:29 作者：z1625000762
這篇文章主要給大家介紹了關于在ts文件中引入js模塊編寫聲明文件的寫法示例,TypeScript是JavaScript的超集,TypeScript會進類型檢查,需要的朋友可以參考下
一、聲明文件的作用
在ts文件中引入js文件，由于js代碼中沒有類型約束，所以ts無法獲得js代碼的類型信息，進而會隱式推斷js中類型為any,失去了ts代碼類型推斷和約束的作用，聲明文件就是將一個js模塊中所有對外暴露的變量、函數(shù)、類使用ts語法進行類型聲明，進而讓ts編譯器在檢測到該聲明文件之后（只要被檢測到寫在哪都可以）就可以獲取js文件中對應變量、函數(shù)、類的類型信息
二、聲明文件的寫法
1、需要導入的*.js代碼
/*test.js*/
//導出變量
export const test1 = '變量'
//導出函數(shù)
export function test2(name){
return name
}
//導出類
export class Test3{
name='類'
constructor(){
console.log(this.name);
}
}2、js代碼的*.d.ts聲明代碼
/*test.d.ts*/
//聲明模塊(被匹配的文件都屬于該模塊)
declare module '*/test.js'{
//聲明變量類型
export const test1:string
//聲明函數(shù)類型
export function test2(name:string):string
//聲明class接口
interface Tests{
name:string
//new()代表構造函數(shù)
new():Tests
}
//聲明class類型
export const Test:Tests;
}3、引入ts文件
/*test.ts*/
import { test1,test2,Test } from './test.js'
console.log(test1);
console.log(test2('函數(shù)'));
new Test()4、運行結果
三、聲明文件的配置
聲明文件必須被ts檢索到，如果聲明文件不生效需要到tsconfig.json文件中添加
{
"include": ["*/*.ts"] //需要檢索的文件位置
}詳細內容：
介紹 · 聲明文件 · TypeScript中文網 · TypeScript——JavaScript的超集
總結
到此這篇關于在ts文件中引入js模塊編寫聲明文件的文章就介紹到這了,更多相關ts引入js模塊編寫聲明文件內容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家！
相關文章
這篇文章主要為大家介紹了前端JS可視化學習利用向量判斷多邊形邊界示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2023-12-12
JS如何設置cookie有效期為當天24點并彈出歡迎登陸界面
這篇文章主要介紹了JS如何設置cookie有效期為當天24點并彈出歡迎登陸界面的代碼，代碼比較簡單，好理解，需要的朋友可以參考下2016-08-08
本篇文章主要是對js中replace的用法進行了詳細的總結介紹，需要的朋友可以過來參考下，希望對大家有所幫助2013-12-12
詳解MVC如何使用開源分頁插件（shenniu.pager.js）
本文主要分享了shenniu.pager.js整個插件內容，不多且清晰。具有很好的參考價值，需要的朋友一起來看下吧2016-12-12
這篇文章主要介紹了Bootstrap v4 sass設計的相關資料,需要的朋友可以參考下2016-05-05
這篇文章主要介紹了Javascript中的Callback方法淺析,本文講解了什么是callback、Javscript Callback、Callback是什么、Callback實例等內容,需要的朋友可以參考下2015-03-03
這篇文章主要介紹了js中的事件捕捉模型與冒泡模型,實例分析了js事件的執(zhí)行順序與冒泡模型的原理,具有一定參考借鑒價值,需要的朋友可以參考下2015-01-01
用JavaScript獲取頁面文檔內容的實現(xiàn)代碼
下面小編就為大家?guī)硪黄肑avaScript獲取頁面文檔內容的實現(xiàn)代碼。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2016-06-06
這篇文章主要介紹了小程序實現(xiàn)簡單語音聊天的示例代碼，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2020-07-07
這篇文章通過圖文詳細的給大家介紹了關于Javascript中的上下文與作用域背后的機制，主要涉及到執(zhí)行上下文（execution context）、作用域鏈（scope chain）、閉包（closure）、this等概念。需要的朋友可以參考借鑒，下面來一起看看吧。2017-02-02