{"id":2355,"date":"2022-11-08T16:33:20","date_gmt":"2022-11-08T15:33:20","guid":{"rendered":"https:\/\/nguenkam.com\/blog\/?p=2355"},"modified":"2022-11-08T16:33:20","modified_gmt":"2022-11-08T15:33:20","slug":"typescript-type-definition-files-ts-d-ts","status":"publish","type":"post","link":"https:\/\/nguenkam.com\/blog\/index.php\/2022\/11\/08\/typescript-type-definition-files-ts-d-ts\/","title":{"rendered":"Typescript &#038; type definition files (.ts, d.ts)"},"content":{"rendered":"\n<p><code>.ts<\/code>\u00a0is the standard TypeScript files. The content then will be compiled to JavaScript.<\/p>\n\n\n\n<p><code>*.d.ts<\/code>\u00a0is the type definition files that allow to use existing JavaScript code in TypeScript.<\/p>\n\n\n\n<p>Let&#8221;s  assume, we have a simple JavaScript function that calculates the sum of two numbers:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>\/\/ math.js\r\nconst sum = (a, b) => a + b;\r\n\r\nexport { sum };<\/code><\/pre>\n\n\n\n<p>We can not use it yet, in a .ts file, because TypeScript doesn&#8217;t have any information about the function including the name, the type of parameters. In order to use the function in a TypeScript file, we provide its definition in a\u00a0<code>d.ts<\/code>\u00a0file:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>\/\/ math.d.ts\r\ndeclare function sum(a: number, b: number): number;<\/code><\/pre>\n\n\n\n<p><\/p>\n\n\n\n<p>From now on, we can use the function in TypeScript without any compile errors.<\/p>\n\n\n\n<p>The\u00a0<code>d.ts<\/code>\u00a0file doesn&#8217;t contain any implementation, and isn&#8217;t compiled to JavaScript at all.<\/p>\n\n\n\n<div style=\"height:100px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<p><strong>PS: <\/strong>TypeScript provides an option named\u00a0<code>allowJs<\/code>\u00a0which allows to use plain JavaScript code in TypeScript.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>\/\/ tsconfig.json\r\n{\r\n    \"compilerOptions\": {\r\n        \"allowJs\": true,\r\n        ...\r\n    }\r\n}<\/code><\/pre>\n\n\n\n<p>It&#8217;s very useful when we want to migrate the existing code base from plain JavaScript to TypeScript. So we can convert each JavaScript file to TypeScript one by one without having to convert entire code completely.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>.ts\u00a0is the standard TypeScript files. The content then will be compiled to JavaScript. *.d.ts\u00a0is the type definition files that allow to use existing JavaScript code in TypeScript. Let&#8221;s assume, we have a simple JavaScript function that calculates the sum of two numbers: We can not use it yet, in a .ts file, because TypeScript doesn&#8217;t [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":1963,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[5,83],"tags":[629,631],"_links":{"self":[{"href":"https:\/\/nguenkam.com\/blog\/index.php\/wp-json\/wp\/v2\/posts\/2355"}],"collection":[{"href":"https:\/\/nguenkam.com\/blog\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/nguenkam.com\/blog\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/nguenkam.com\/blog\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/nguenkam.com\/blog\/index.php\/wp-json\/wp\/v2\/comments?post=2355"}],"version-history":[{"count":1,"href":"https:\/\/nguenkam.com\/blog\/index.php\/wp-json\/wp\/v2\/posts\/2355\/revisions"}],"predecessor-version":[{"id":2356,"href":"https:\/\/nguenkam.com\/blog\/index.php\/wp-json\/wp\/v2\/posts\/2355\/revisions\/2356"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/nguenkam.com\/blog\/index.php\/wp-json\/wp\/v2\/media\/1963"}],"wp:attachment":[{"href":"https:\/\/nguenkam.com\/blog\/index.php\/wp-json\/wp\/v2\/media?parent=2355"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/nguenkam.com\/blog\/index.php\/wp-json\/wp\/v2\/categories?post=2355"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/nguenkam.com\/blog\/index.php\/wp-json\/wp\/v2\/tags?post=2355"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}