title: Declaration Reference
layout: docs
permalink: /ja/docs/handbook/declaration-files/by-example.html

oneline: "How to create a .d.ts file for a module"

The purpose of this guide is to show you how to write a good declaration file.
This guide consists of a specification of an API and an example of how to use it.
It explains how to write the corresponding declaration.

The following samples are listed in order of most complexity.

Object with properties

specification

Globals variablemyLibMake a greetingmakeGreetingFunctions and
Properties that indicate the number of greetings made so farnumberOfGreetingsI have.

Code example

let result = myLib.makeGreeting("hello, world");
console.log("The computed greeting is:" + result);

let count = myLib.numberOfGreetings;

declaration

To describe the types and values that can be accessed by dot notation,declare namespaceuse .

declare namespace myLib {
  function makeGreeting(s: string): string;
  let numberOfGreetings: number;
}

Overloaded functions

specification

getWidgetThe function takes a number and returns a widget, or it receives a string to return an array of widgets.

Code example

let x: Widget = getWidget(43);

let arr: Widget[] = getWidget("all of them");

declaration

declare function getWidget(n: number): Widget;
declare function getWidget(s: string): Widget[];

Reusable types (interface)

specification

GreetingSettingsPass the object and specify a greeting.
This object has properties such as:

1 - greeting: required string

2 - duration: the length of any time in milliseconds

3 - color: any string (e.g. '#ff00ff')

Code example

greet({
  greeting: "hello world",
  duration: 4000,
});

declaration

interfaceUse to define the type that has properties.

interface GreetingSettings {
  greeting: string;
  duration?: number;
  color?: string;
}

declare function greet(setting: GreetingSettings): void;

Reusable type (type alias)

specification

To where greetings are expected,string、stringor a function that returnsGreeterYou can give an instance.

Code example

function getGreeting() {
  return "howdy";
}
class MyGreeter extends Greeter {}

greet("hello");
greet(getGreeting);
greet(new MyGreeter());

declaration

You can use type aliases to create an abbreviation of a type:

type GreetingLike = string | (() => string) | MyGreeter;

declare function greet(g: GreetingLike): void;

Organizing types

specification

greeterObjects can log files and display alerts.
The logging options are.log(...)the alert options are.alert(...)can be given to.

Code example

const g = new Greeter("Hello");
g.log({ verbose: true });
g.alert({ modal: false, title: "Current Greeting" });

declaration

Use namespaces to organize types.

declare namespace GreetingLib {
  interface LogOptions {
    verbose?: boolean;
  }
  interface AlertOptions {
    modal: boolean;
    title?: string;
    color?: string;
  }
}

You can also create namespaces nested with declarations:

declare namespace GreetingLib.Options {
  // GreetingLib.Options.Logで参照します
  interface Log {
    verbose?: boolean;
  }
  interface Alert {
    modal: boolean;
    title?: string;
    color?: string;
  }
}

class

specification

GreeterYou can instantiate an object to create a greeter, or extend it to create a customized greeter.

Code example

const myGreeter = new Greeter("hello, world");
myGreeter.greeting = "howdy";
myGreeter.showGreeting();

class SpecialGreeter extends Greeter {
  constructor() {
    super("Very special greetings");
  }
}

declaration

To write a class or class-like object, clickdeclare classuse .
A class can have properties and methods, not just constructors.

declare class Greeter {
  constructor(greeting: string);

  greeting: string;
  showGreeting(): void;
}

Global variables

specification

Global variablesfoocontains the number of widgets that exist.

Code example

console.log("Half the number of widgets is " + foo / 2);

declaration

To declare a variable:declare varuse .
If the variable is read-only,declare constYou can use .
Also, if the variable is limited to block scope,declare letYou can also use .

/** 存在する widget の数 */
declare var foo: number;

Global functions

specification

Function given a stringgreetto display greetings to the user.

Code example

greet("hello, world");

declaration

To declare a function:declare functionUse .

declare function greet(greeting: string): void;