{
  "$type": "site.standard.document",
  "bskyPostRef": {
    "cid": "bafyreibjzf6bkzmukxid3ghx5cx4vwk6w3uei7sjenxol4qw26fevs67uu",
    "uri": "at://did:plc:25rdn5elo5izoxrmtis34zuk/app.bsky.feed.post/3mommy3tlgif2"
  },
  "coverImage": {
    "$type": "blob",
    "ref": {
      "$link": "bafkreiespszxybah6dbg6n2ddsq6wulq5m4d22ekyf5v22aneqlz43bzoi"
    },
    "mimeType": "image/webp",
    "size": 53232
  },
  "path": "/jsha/introduction-to-typescript-function-types-hin",
  "publishedAt": "2026-06-19T05:21:42.000Z",
  "site": "https://dev.to",
  "tags": [
    "beginners",
    "javascript",
    "tutorial",
    "typescript"
  ],
  "textContent": "##  Basic syntax\n\nSince everything in TypeScript has to have type, functions are also wrapped in the type system: inputs must have types, output must have one, let's look at the example:\n\n\n\n    function add(x: number, y: number): number {\n      return x + y;\n    }\n\n    console.log(add(1, 3)); //4\n\n\nActually, we don't have to explicitly assign type for an ouput:\n\n\n\n    function add(x: number, y: number) {\n      return x + y;\n    }\n\n    console.log(add(1, 3)); //4\n\n\nThe compiler won't see any problem with it, since it implicitly set `number` type for an output. The following code is also valid:\n\n\n\n    function add(x: number, y: number) {\n      if (x === 0) {\n        return \"zero!\"\n      }\n      return x + y;\n    }\n\n    console.log(add(1, 3));\n\n\n> Here, the compiler defines output type of the function as either `number` or `\"zero!\"`.\n\n###  Arrow function\n\n##  Special return type\n\n  * **void** - function return type that is used to indicate that function returns nothing.\n\n\n\n\n    function action(): void {\n      // your code here\n    }\n\n\n  * **never** - function return type indicating that the function throws an exception or terminates execution of the program.\n\n\n\n##  Optional parameter ?:\n\n\n    function makeProfile(name: string, age: number, url?: string) {\n\n    }\n\n    let profile = makeProfile(\"Mary\", 81);\n\n\n> A parameter `url` is optional, but if it exists, it must have `string` type.\n\n##  Default parameter\n\nDefault parameter is an optional parameter that doesn't need special character:\n\n\n\n    function makeProfile(\n      name: string,\n      age: number,\n      url: string = \"www.example.com\"\n    ) {\n      return `${name} is ${age} years old and visits ${url}.`\n    }\n\n    let profile = makeProfile(\"Mary\", 81);\n\n    console.log(profile); //Mary is 81 years old and visits www.example.com.\n\n\n##  Callback\n\nAs we know in JavaScript functions are treated as all values, they can be an argument in other functions. So, how would we define callback type?\n\n\n\n    function makeProfile(\n      name: string,\n      age: number,\n      url: string = \"www.example.com\"\n    ) {\n      return `${name} is ${age} years old and visits ${url}.`;\n    }\n\n    function makePage(\n      func: (n: string, a: number, u?: string) => string,\n      param1: string,\n      param2: number\n    ) {\n      func(param1, param2);\n    }\n\n    let profile = makePage(makeProfile, \"Mary\", 81);\n\n\n> parameters names in callback don't matter, but the same types do.\n\n###  Multiple callbacks\n\nWhat if we have several callbacks with the same parameters types? How is better to define them?\n\n\n\n    function mathOperation1(x: number, y: number): number {\n      return x + y;\n    }\n\n    function mathOperation2(x: number, y: number): number {\n      return x - y;\n    }\n\n    function applyMath(\n      funcs: ((a: number, b: number) => number)[],\n      x: number,\n      y: number\n    ){\n\n    }\n\n    applyMath(\n      [mathOperation1, mathOperation2],\n      1,\n    2\n    );\n\n\n> `((a: number, b: number) => number)[]` type tells the compiler that it has to be an array of functions with two parameters of `number` types.\n\n##  Rest parameter\n\n\n    function sum(...numbers: number[]) {\n    // code\n    }\n\n    sum(1,2,3);\n    sum();\n    sum(1,2,3,4,5,6);\n\n\n> arguments of this function will be stored inside `numbers` array.",
  "title": "Introduction to TypeScript. Function Types"
}