The basic use of.d.ts and some common sense analysis

D. ts are mainly type definition files that qualify some methods, objects, data, etc. Used to define type information and interface specifications.

Why do we have d.ts

This causes a problem: a lot of ts data types are missing, so you need a d.ts file to mark a js library surface object type.

  • When introducing some third-party libraries, there is no type qualification and you need to use TS
  • Custom some objects, methods, complex data, etc., need TS
  • The.d.ts file is used by the IDE(editor only) when writing code.

Which the use of the s

declare const model:number

Declare is a keyword that identifies the meaning of the declaration. In the d.ts file, declare variables or functions or classes in the outermost layer before the keyword. In typescript rules, if a.ts or.d.ts file does not use the import or export syntax, the topmost declared variables are global variables.

Global usage pattern

variable

Here we declare a global variable aaa of type number. It can also be a string or something else or:

Declare the let aaa: number | the string / / note that there is a vertical bar says “or” mean If is constant with the keyword const said:

declare const max:200

function

From the above global variable writing we can naturally infer a global function writing as follows:

/** id is the user ID, which can be number or string */
decalre function getName(id:number|string) :string
Copy the code

If some parameters are optional, you can add one, right? Not required.

declare function render(callback? : () = >void) :string
jsWhen called, the callback can be passed with or without:render()

render(function () {
    alert('finish.')})
Copy the code

object

 declare class Person {

    static maxAge: number // Static variables
    static getMaxAge(): number // Static method

    constructor(name: string, age: number) // ConstructorgetName(id: number) :string 
}
Copy the code

Modular Usage (CommonJS)

Declare var aaa: 1 declare var BBB: 2 declare var CCC: 3 declare var aaa: 1 declare var BBB: 2 declare var CCC: 3

Export {aaa} uses:

import { a1, a2 } from "./A"

Console. log(a1) console.log(a2)

declare var a1: 1 declare var a2: 2

Export {a1,a2} export {a1,a2}

Export Declare var A1:1 export Declare var A2:2 Export Declare var A2:2

Default: default:

Declare var a1: 1 export default a1; declare var a1: 1 export default a1;

import a1 from "./A";

console.log(a1)

The advantages of which s

  • You can qualify data, methods, and object types
  • The biggest advantage is that there can be corresponding methods, parameters prompt information, easy to choose

D.t file location

It is often asked which directory to put the written D.d.ts files in. If it is modularizable it should be in the same directory as the source code (A.js) files. If it is a global variable it should be anywhere in theory – unless of course you have specifically configured it in the tsconfig.json file.

Reference documentation

  • How to write a D.ts file
  • How to write a d.ts file steps detailed explanation