TypeScript基礎(chǔ)入門(mén)之Javascript文件類型檢查(五)

轉(zhuǎn)發(fā) ## TypeScript基礎(chǔ)入門(mén)之Javascript文件類型檢查(五)

繼續(xù)上篇文章【TypeScript基礎(chǔ)入門(mén)之Javascript文件類型檢查(四)

@constructor

編譯器根據(jù)此屬性賦值推斷構(gòu)造函數(shù),但如果添加@constructor標(biāo)記,則可以更好地檢查更嚴(yán)格和更好的建議:

/**
 * @constructor
 * @param {number} data
 */
function C(data) {
  this.size = 0;
  this.initialize(data); // Should error, initializer expects a string
}
/**
 * @param {string} s
 */
C.prototype.initialize = function (s) {
  this.size = s.length
}

var c = new C(0);
var result = C(1); // C should only be called with new

使用@constructor,在構(gòu)造函數(shù)C中檢查它,因此您將獲得初始化方法的建議,如果您傳遞一個(gè)數(shù)字,則會(huì)出錯(cuò)。 如果您調(diào)用C而不是構(gòu)造它,您也會(huì)收到錯(cuò)誤。

不幸的是,這意味著也可以調(diào)用的構(gòu)造函數(shù)不能使用@constructor。

@this

當(dāng)編譯器有一些上下文可以使用時(shí),它通??梢哉页鏊念愋?。 如果沒(méi)有,您可以使用@this顯式指定此類型:

/**
 * @this {HTMLElement}
 * @param {*} e
 */
function callbackForLater(e) {
    this.clientHeight = parseInt(e) // should be fine!
}

@extends

當(dāng)Javascript類擴(kuò)展通用基類時(shí),無(wú)處可指定類型參數(shù)應(yīng)該是什么。 @extends標(biāo)記為該類型參數(shù)提供了一個(gè)位置:

/**
 * @template T
 * @extends {Set<T>}
 */
class SortableSet extends Set {
  // ...
}

請(qǐng)注意,@ extends僅適用于類。 目前,構(gòu)造函數(shù)沒(méi)有辦法擴(kuò)展一個(gè)類。

@enum

@enum標(biāo)記允許您創(chuàng)建一個(gè)對(duì)象文字,其成員都是指定的類型。 與Javascript中的大多數(shù)對(duì)象文字不同,它不允許其他成員。

/** @enum {number} */
const JSDocState = {
  BeginningOfLine: 0,
  SawAsterisk: 1,
  SavingComments: 2,
}

請(qǐng)注意,@enum與Typescript的枚舉完全不同,并且簡(jiǎn)單得多。 但是,與Typescript的枚舉不同,@enum可以有任何類型:

/** @enum {function(number): number} */
const Math = {
  add1: n => n + 1,
  id: n => -n,
  sub1: n => n - 1,
}

更多示例

var someObj = {
  /**
   * @param {string} param1 - Docs on property assignments work
   */
  x: function(param1){}
};

/**
 * As do docs on variable assignments
 * @return {Window}
 */
let someFunc = function(){};

/**
 * And class methods
 * @param {string} greeting The greeting to use
 */
Foo.prototype.sayHi = (greeting) => console.log("Hi!");

/**
 * And arrow functions expressions
 * @param {number} x - A multiplier
 */
let myArrow = x => x * x;

/**
 * Which means it works for stateless function components in JSX too
 * @param {{a: string, b: number}} test - Some param
 */
var sfc = (test) => <div>{test.a.charAt(0)}</div>;

/**
 * A parameter can be a class constructor, using Closure syntax.
 *
 * @param {{new(...args: any[]): object}} C - The class to register
 */
function registerClass(C) {}

/**
 * @param {...string} p1 - A 'rest' arg (array) of strings. (treated as 'any')
 */
function fn10(p1){}

/**
 * @param {...string} p1 - A 'rest' arg (array) of strings. (treated as 'any')
 */
function fn9(p1) {
  return p1.join();
}

已知的模式不受支持

引用值空間中的對(duì)象,因?yàn)轭愋筒黄鹱饔茫菍?duì)象也創(chuàng)建類型,如構(gòu)造函數(shù)。

function aNormalFunction() {

}
/**
 * @type {aNormalFunction}
 */
var wrong;
/**
 * Use 'typeof' instead:
 * @type {typeof aNormalFunction}
 */
var right;

對(duì)象文字類型中的屬性類型的Postfix等于未指定可選屬性:

/**
 * @type {{ a: string, b: number= }}
 */
var wrong;
/**
 * Use postfix question on the property name instead:
 * @type {{ a: string, b?: number }}
 */
var right;

如果啟用了strictNullChecks,則可空類型僅具有意義:

/**
 * @type {?number}
 * With strictNullChecks: true -- number | null
 * With strictNullChecks: off  -- number
 */
var nullable;

非可空類型沒(méi)有任何意義,并且被視為原始類型:

/**
 * @type {!number}
 * Just has type number
 */
var normal;

與JSDoc的類型系統(tǒng)不同,Typescript只允許您將類型標(biāo)記為包含null或不包含null。 沒(méi)有明確的非可空性 - 如果啟用了strictNullChecks,則number不可為空。 如果它關(guān)閉,則number可以為空。

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書(shū)系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容