黄色电影一区二区,韩国少妇自慰A片免费看,精品人妻少妇一级毛片免费蜜桃AV按摩师 ,超碰 香蕉

TypeScript 聲明文件

typescript 聲明文件

typescript 作為 javascript 的超集,在開(kāi)發(fā)過(guò)程中不可避免要引用其他第三方的 javascript 的庫(kù)。雖然通過(guò)直接引用可以調(diào)用庫(kù)的類和方法,但是卻無(wú)法使用typescript 諸如類型檢查等特性功能。為了解決這個(gè)問(wèn)題,需要將這些庫(kù)里的函數(shù)和方法體去掉后只保留導(dǎo)出類型聲明,而產(chǎn)生了一個(gè)描述 javascript 庫(kù)和模塊信息的聲明文件。通過(guò)引用這個(gè)聲明文件,就可以借用 typescript 的各種特性來(lái)使用庫(kù)文件了。

假如我們想使用第三方庫(kù),比如 jquery,我們通常這樣獲取一個(gè) id 是 foo 的元素:

$('#foo');
// 或
jquery('#foo');

但是在 typescript 中,我們并不知道 $ 或 jquery 是什么東西:

jquery('#foo');

// index.ts(1,1): error ts2304: cannot find name 'jquery'.

這時(shí),我們需要使用 declare 關(guān)鍵字來(lái)定義它的類型,幫助 typescript 判斷我們傳入的參數(shù)類型對(duì)不對(duì):

declare var jquery: (selector: string) => any;

jquery('#foo');

declare 定義的類型只會(huì)用于編譯時(shí)的檢查,編譯結(jié)果中會(huì)被刪除。

上例的編譯結(jié)果是:

jquery('#foo');

聲明文件

聲明文件以 .d.ts 為后綴,例如:

yapf.d.ts

聲明文件或模塊的語(yǔ)法格式如下:

declare module module_name {
}

typescript 引入聲明文件語(yǔ)法格式:

/// <reference path = "yapf.d.ts" />

當(dāng)然,很多流行的第三方庫(kù)的聲明文件不需要我們定義了,比如 jquery 已經(jīng)有人幫我們定義好了:jquery in definitelytyped。

范例

以下定義一個(gè)第三方庫(kù)來(lái)演示:

calcthirdpartyjslib.js 文件代碼:

var codebaoku;  
(function(codebaoku) {
    var calc = (function () { 
        function calc() { 
        } 
    })
    calc.prototype.dosum = function (limit) {
        var sum = 0; 
 
        for (var i = 0; i <= limit; i++) { 
            sum = sum + i; 
        }
        return sum; 
    }
    codebaoku.calc = calc; 
    return calc; 
})(codebaoku || (codebaoku = {})); 
var test = new codebaoku.calc();

如果我們想在 typescript 中引用上面的代碼,則需要設(shè)置聲明文件 calc.d.ts,代碼如下:

declare module codebaoku { 
   export class calc { 
      dosum(limit:number) : number; 
   }
}

聲明文件不包含實(shí)現(xiàn),它只是類型聲明,把聲明文件加入到 typescript 中:

calctest.ts 文件代碼:

/// <reference path = "calc.d.ts" /> 
var obj = new codebaoku.calc(); 
// obj.dosum("hello"); // 編譯錯(cuò)誤
console.log(obj.dosum(10));

下面這行導(dǎo)致編譯錯(cuò)誤,因?yàn)槲覀冃枰獋魅霐?shù)字參數(shù):

obj.dosum("hello");

使用 tsc 命令來(lái)編譯以上代碼文件:

tsc calctest.ts

生成的 javascript 代碼如下:

calctest.js 文件代碼:

/// <reference path = "calc.d.ts" /> 
var obj = new codebaoku.calc();
//obj.dosum("hello"); // 編譯錯(cuò)誤
console.log(obj.dosum(10));

最后我們編寫一個(gè) yapf.html 文件,引入 calctest.js 文件及第三方庫(kù) calcthirdpartyjslib.js:

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>碩編程(yapf.com)</title>
<script src = "calcthirdpartyjslib.js"></script> 
<script src = "calctest.js"></script> 
</head>
<body>
    <h1>聲明文件測(cè)試</h1>
    <p>碩編程測(cè)試一下。</p>
</body>
</html>

我們可以用瀏覽器打開(kāi)該文件,輸出測(cè)試結(jié)果

相關(guān)文章