{"componentChunkName":"component---src-templates-handbook-tsx","path":"/docs/handbook/utility-types.html","result":{"data":{"allSitePage":{"nodes":[{"path":"/dev-404-page/"},{"path":"/docs/handbook/advanced-types.html"},{"path":"/docs/handbook/basic-types.html"},{"path":"/docs/handbook/classes.html"},{"path":"/docs/handbook/compiler-options-in-msbuild.html"},{"path":"/docs/handbook/compiler-options.html"},{"path":"/docs/handbook/configuring-watch.html"},{"path":"/docs/handbook/declaration-merging.html"},{"path":"/docs/handbook/decorators.html"},{"path":"/docs/handbook/enums.html"},{"path":"/docs/handbook/functions.html"},{"path":"/docs/handbook/generics.html"},{"path":"/docs/handbook/integrating-with-build-tools.html"},{"path":"/docs/handbook/interfaces.html"},{"path":"/docs/handbook/iterators-and-generators.html"},{"path":"/docs/handbook/jsdoc-supported-types.html"},{"path":"/docs/handbook/jsx.html"},{"path":"/docs/handbook/literal-types.html"},{"path":"/docs/handbook/mixins.html"},{"path":"/docs/handbook/module-resolution.html"},{"path":"/docs/handbook/modules.html"},{"path":"/docs/handbook/namespaces-and-modules.html"},{"path":"/docs/handbook/namespaces.html"},{"path":"/docs/handbook/nightly-builds.html"},{"path":"/docs/handbook/project-references.html"},{"path":"/docs/handbook/symbols.html"},{"path":"/docs/handbook/"},{"path":"/docs/handbook/triple-slash-directives.html"},{"path":"/docs/handbook/type-checking-javascript-files.html"},{"path":"/docs/handbook/type-compatibility.html"},{"path":"/docs/handbook/type-inference.html"},{"path":"/docs/handbook/unions-and-intersections.html"},{"path":"/docs/handbook/utility-types.html"},{"path":"/docs/handbook/variable-declarations.html"},{"path":"/docs/handbook/writing-declaration-files.html"},{"path":"/docs/handbook/declaration-files/by-example.html"},{"path":"/docs/handbook/declaration-files/consumption.html"},{"path":"/docs/handbook/declaration-files/deep-dive.html"},{"path":"/docs/handbook/declaration-files/do-s-and-don-ts.html"},{"path":"/docs/handbook/declaration-files/introduction.html"},{"path":"/docs/handbook/declaration-files/library-structures.html"},{"path":"/docs/handbook/declaration-files/publishing.html"},{"path":"/docs/handbook/declaration-files/templates.html"},{"path":"/docs/handbook/release-notes/typescript-1-1.html"},{"path":"/docs/handbook/release-notes/typescript-1-3.html"},{"path":"/docs/handbook/release-notes/typescript-1-4.html"},{"path":"/docs/handbook/release-notes/typescript-1-5.html"},{"path":"/docs/handbook/release-notes/typescript-1-6.html"},{"path":"/docs/handbook/release-notes/typescript-1-7.html"},{"path":"/docs/handbook/release-notes/typescript-1-8.html"},{"path":"/docs/handbook/release-notes/typescript-2-0.html"},{"path":"/docs/handbook/release-notes/typescript-2-2.html"},{"path":"/docs/handbook/release-notes/typescript-2-1.html"},{"path":"/docs/handbook/release-notes/typescript-2-3.html"},{"path":"/docs/handbook/release-notes/typescript-2-4.html"},{"path":"/docs/handbook/release-notes/typescript-2-5.html"},{"path":"/docs/handbook/release-notes/typescript-2-6.html"},{"path":"/docs/handbook/release-notes/typescript-2-7.html"},{"path":"/docs/handbook/release-notes/typescript-2-8.html"},{"path":"/docs/handbook/release-notes/typescript-2-9.html"},{"path":"/docs/handbook/release-notes/typescript-3-0.html"},{"path":"/docs/handbook/release-notes/typescript-3-1.html"},{"path":"/docs/handbook/release-notes/typescript-3-2.html"},{"path":"/docs/handbook/release-notes/typescript-3-3.html"},{"path":"/docs/handbook/release-notes/typescript-3-4.html"},{"path":"/docs/handbook/release-notes/typescript-3-5.html"},{"path":"/docs/handbook/release-notes/typescript-3-6.html"},{"path":"/docs/handbook/release-notes/typescript-3-7.html"},{"path":"/docs/handbook/release-notes/typescript-3-8.html"},{"path":"/docs/handbook/asp-net-core.html"},{"path":"/docs/handbook/angular.html"},{"path":"/docs/handbook/dom-manipulation.html"},{"path":"/docs/handbook/gulp.html"},{"path":"/docs/handbook/migrating-from-javascript.html"},{"path":"/docs/handbook/react-&-webpack.html"},{"path":"/docs/handbook/react.html"},{"path":"/docs/handbook/typescript-in-5-minutes-func.html"},{"path":"/docs/handbook/typescript-in-5-minutes.html"},{"path":"/docs/handbook/typescript-in-5-minutes-oop.html"},{"path":"/docs/handbook/typescript-from-scratch.html"},{"path":"/docs/handbook/typescript-tooling-in-5-minutes.html"},{"path":"/docs/handbook/tsconfig-json.html"},{"path":"/docs/handbook/declaration-files/templates/global-modifying-module-d-ts.html"},{"path":"/docs/handbook/declaration-files/templates/global-plugin-d-ts.html"},{"path":"/docs/handbook/declaration-files/templates/global-d-ts.html"},{"path":"/docs/handbook/declaration-files/templates/module-class-d-ts.html"},{"path":"/docs/handbook/declaration-files/templates/module-function-d-ts.html"},{"path":"/docs/handbook/declaration-files/templates/module-plugin-d-ts.html"},{"path":"/docs/handbook/declaration-files/templates/module-d-ts.html"},{"path":"/docs/handbook/release-notes/overview.html"},{"path":"/tsconfig"},{"path":"/en/tsconfig"},{"path":"/ja/tsconfig"},{"path":"/vo/tsconfig"},{"path":"/play"},{"path":"/en/play"},{"path":"/es/play"},{"path":"/vo/play"},{"path":"/zh/play"},{"path":"/ja/play"},{"path":"/play/3-7/fixits/big-number-literals.ts"},{"path":"/play/3-7/fixits/const-to-let.ts"},{"path":"/play/3-7/fixits/infer-from-usage-changes.ts"},{"path":"/play/3-7/syntax-and-messaging/flattened-error-reporting.ts"},{"path":"/play/3-7/syntax-and-messaging/nullish-coalescing.ts"},{"path":"/play/3-7/syntax-and-messaging/optional-chaining.ts"},{"path":"/play/3-7/types-and-code-flow/assertion-functions.ts"},{"path":"/play/3-7/types-and-code-flow/recursive-type-references.ts"},{"path":"/play/3-7/types-and-code-flow/uncalled-function-checks.ts"},{"path":"/play/3-8/breaking-changes/checking-unions-with-index-signatures.ts"},{"path":"/play/3-8/jsdoc-improvements/accessibility-modifiers.js"},{"path":"/play/3-8/syntax-and-messaging/export-modules-from.ts"},{"path":"/play/3-8/syntax-and-messaging/private-class-fields.ts"},{"path":"/play/javascript/external-apis/typescript-with-deno.ts"},{"path":"/play/javascript/external-apis/typescript-with-node.js"},{"path":"/play/javascript/external-apis/typescript-with-web.js"},{"path":"/play/javascript/external-apis/typescript-with-webgl.js"},{"path":"/play/javascript/functions-with-javascript/function-chaining.ts"},{"path":"/play/javascript/functions-with-javascript/generic-functions.ts"},{"path":"/play/javascript/functions-with-javascript/typing-functions.ts"},{"path":"/play/javascript/helping-with-javascript/errors.ts"},{"path":"/play/javascript/helping-with-javascript/quick-fixes.ts"},{"path":"/play/javascript/javascript-essentials/code-flow.ts"},{"path":"/play/javascript/javascript-essentials/functions.ts"},{"path":"/play/javascript/javascript-essentials/hello-world.ts"},{"path":"/play/javascript/javascript-essentials/objects-and-arrays.ts"},{"path":"/play/javascript/modern-javascript/async-await.ts"},{"path":"/play/javascript/modern-javascript/immutability.ts"},{"path":"/play/javascript/modern-javascript/import-export.ts"},{"path":"/play/javascript/modern-javascript/jsdoc-support.js"},{"path":"/play/javascript/working-with-classes/classes-101.ts"},{"path":"/play/javascript/working-with-classes/generic-classes.ts"},{"path":"/play/javascript/working-with-classes/mixins.ts"},{"path":"/play/javascript/working-with-classes/this.ts"},{"path":"/play/playground/config/javascript-playgrounds.js"},{"path":"/play/playground/config/new-compiler-defaults.ts"},{"path":"/play/playground/language/automatic-type-acquisition.ts"},{"path":"/play/playground/language/fixits.ts"},{"path":"/play/playground/tooling/mobile-support.ts"},{"path":"/play/playground/tooling/sharable-urls.ts"},{"path":"/play/playground/tooling/typescript-versions.ts"},{"path":"/play/typescript/language/soundness.ts"},{"path":"/play/typescript/language/structural-typing.ts"},{"path":"/play/typescript/language/type-guards.ts"},{"path":"/play/typescript/language/type-widening-and-narrowing.ts"},{"path":"/play/typescript/language-extensions/enums.ts"},{"path":"/play/typescript/language-extensions/nominal-typing.ts"},{"path":"/play/typescript/language-extensions/types-vs-interfaces.ts"},{"path":"/play/typescript/meta-types/conditional-types.ts"},{"path":"/play/typescript/meta-types/discriminate-types.ts"},{"path":"/play/typescript/meta-types/indexed-types.ts"},{"path":"/play/typescript/meta-types/mapped-types.ts"},{"path":"/play/typescript/primitives/any.ts"},{"path":"/play/typescript/primitives/literals.ts"},{"path":"/play/typescript/primitives/union-and-intersection-types.ts"},{"path":"/play/typescript/primitives/unknown-and-never.ts"},{"path":"/play/typescript/type-primitives/built-in-utility-types.ts"},{"path":"/play/typescript/type-primitives/nullable-types.ts"},{"path":"/play/typescript/type-primitives/tuples.ts"},{"path":"/es/play/javascript/external-apis/typescript-with-deno.ts"},{"path":"/es/play/javascript/external-apis/typescript-with-node.js"},{"path":"/es/play/javascript/external-apis/typescript-with-web.js"},{"path":"/es/play/javascript/functions-with-javascript/function-chaining.ts"},{"path":"/es/play/javascript/functions-with-javascript/generic-functions.ts"},{"path":"/es/play/javascript/javascript-essentials/hello-world.ts"},{"path":"/es/play/javascript/javascript-essentials/objects-and-arrays.ts"},{"path":"/es/play/typescript/type-primitives/built-in-utility-types.ts"},{"path":"/es/play/typescript/type-primitives/nullable-types.ts"},{"path":"/es/play/typescript/type-primitives/tuples.ts"},{"path":"/ja/play/typescript/language-extensions/enums.ts"},{"path":"/ja/play/typescript/language-extensions/nominal-typing.ts"},{"path":"/ja/play/typescript/language-extensions/types-vs-interfaces.ts"},{"path":"/ja/play/typescript/primitives/any.ts"},{"path":"/ja/play/typescript/primitives/literals.ts"},{"path":"/ja/play/typescript/primitives/union-and-intersection-types.ts"},{"path":"/ja/play/typescript/type-primitives/built-in-utility-types.ts"},{"path":"/vo/play/javascript/javascript-essentials/code-flow.ts"},{"path":"/vo/play/javascript/javascript-essentials/functions.ts"},{"path":"/vo/play/javascript/javascript-essentials/hello-world.ts"},{"path":"/vo/play/javascript/javascript-essentials/objects-and-arrays.ts"},{"path":"/zh/play/javascript/external-apis/typescript-with-deno.ts"},{"path":"/zh/play/javascript/external-apis/typescript-with-node.js"},{"path":"/zh/play/javascript/external-apis/typescript-with-web.js"},{"path":"/zh/play/javascript/external-apis/typescript-with-webgl.js"},{"path":"/zh/play/javascript/functions-with-javascript/function-chaining.ts"},{"path":"/zh/play/javascript/functions-with-javascript/generic-functions.ts"},{"path":"/zh/play/javascript/functions-with-javascript/typing-functions.ts"},{"path":"/zh/play/javascript/helping-with-javascript/errors.ts"},{"path":"/zh/play/javascript/helping-with-javascript/quick-fixes.ts"},{"path":"/zh/play/javascript/javascript-essentials/code-flow.ts"},{"path":"/zh/play/javascript/javascript-essentials/functions.ts"},{"path":"/zh/play/javascript/javascript-essentials/hello-world.ts"},{"path":"/zh/play/javascript/modern-javascript/import-export.ts"},{"path":"/zh/play/javascript/modern-javascript/jsdoc-support.js"},{"path":"/zh/play/javascript/working-with-classes/classes-101.ts"},{"path":"/zh/play/javascript/working-with-classes/generic-classes.ts"},{"path":"/zh/play/javascript/working-with-classes/mixins.ts"},{"path":"/zh/play/javascript/working-with-classes/this.ts"},{"path":"/zh/play/playground/config/javascript-playgrounds.js"},{"path":"/zh/play/playground/config/new-compiler-defaults.ts"},{"path":"/zh/play/playground/language/automatic-type-acquisition.ts"},{"path":"/zh/play/playground/language/fixits.ts"},{"path":"/zh/play/playground/tooling/mobile-support.ts"},{"path":"/zh/play/playground/tooling/sharable-urls.ts"},{"path":"/zh/play/playground/tooling/typescript-versions.ts"},{"path":"/zh/play/typescript/language/soundness.ts"},{"path":"/zh/play/typescript/language/structural-typing.ts"},{"path":"/zh/play/typescript/language/type-guards.ts"},{"path":"/zh/play/typescript/language/type-widening-and-narrowing.ts"},{"path":"/zh/play/typescript/language-extensions/enums.ts"},{"path":"/zh/play/typescript/language-extensions/nominal-typing.ts"},{"path":"/zh/play/typescript/language-extensions/types-vs-interfaces.ts"},{"path":"/zh/play/typescript/meta-types/conditional-types.ts"},{"path":"/zh/play/typescript/meta-types/discriminate-types.ts"},{"path":"/zh/play/typescript/meta-types/indexed-types.ts"},{"path":"/zh/play/typescript/meta-types/mapped-types.ts"},{"path":"/zh/play/typescript/primitives/any.ts"},{"path":"/zh/play/typescript/primitives/literals.ts"},{"path":"/zh/play/typescript/primitives/union-and-intersection-types.ts"},{"path":"/zh/play/typescript/primitives/unknown-and-never.ts"},{"path":"/zh/play/typescript/type-primitives/built-in-utility-types.ts"},{"path":"/zh/play/typescript/type-primitives/nullable-types.ts"},{"path":"/zh/play/typescript/type-primitives/tuples.ts"},{"path":"/zh/play/javascript/modern-javascript/immutability.ts"},{"path":"/zh/play/javascript/modern-javascript/async-await.ts"},{"path":"/zh/play/javascript/javascript-essentials/objects-and-arrays.ts"},{"path":"/community"},{"path":"/es/community"},{"path":"/ja/community"},{"path":"/vo/community"},{"path":"/zh/community"},{"path":"/download"},{"path":"/es/download"},{"path":"/ja/download"},{"path":"/vo/download"},{"path":"/zh/download"},{"path":"/empty"},{"path":"/es/empty"},{"path":"/ja/empty"},{"path":"/vo/empty"},{"path":"/zh/empty"},{"path":"/"},{"path":"/es/"},{"path":"/ja/"},{"path":"/vo/"},{"path":"/zh/"},{"path":"/tools"},{"path":"/es/tools"},{"path":"/ja/tools"},{"path":"/vo/tools"},{"path":"/zh/tools"},{"path":"/why-create-typescript"},{"path":"/es/why-create-typescript"},{"path":"/ja/why-create-typescript"},{"path":"/vo/why-create-typescript"},{"path":"/zh/why-create-typescript"},{"path":"/docs/home"},{"path":"/es/docs/home"},{"path":"/ja/docs/home"},{"path":"/vo/docs/home"},{"path":"/zh/docs/home"},{"path":"/dev/playground-plugins/"},{"path":"/dev/sandbox/"},{"path":"/dev/twoslash/"},{"path":"/dev/typescript-vfs/"}]},"markdownRemark":{"id":"ec503eb7-425c-5064-a12a-dff2fbc70672","excerpt":"Introduction TypeScript provides several utility types to facilitate common type transformations. These utilities are available globally. Partial<T> Constructs…","html":"<h1 id=\"introduction\" style=\"position:relative;\"><a href=\"#introduction\" aria-label=\"introduction permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Introduction</h1>\n<p>TypeScript provides several utility types to facilitate common type transformations. These utilities are available globally.</p>\n<h1 id=\"partialt\" style=\"position:relative;\"><a href=\"#partialt\" aria-label=\"partialt permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a><code>Partial&#x3C;T></code></h1>\n<p>Constructs a type with all properties of <code>T</code> set to optional. This utility will return a type that represents all subsets of a given type.</p>\n<h5 id=\"example\" style=\"position:relative;\"><a href=\"#example\" aria-label=\"example permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Example</h5>\n<pre class=\"shiki\"><div class=\"language-id\">ts</div><div class='code-container'><code><span style=\"color: #0000FF\">interface</span><span style=\"color: #000000\"> Todo {</span>\n<span style=\"color: #000000\">  title: string;</span>\n<span style=\"color: #000000\">  description: string;</span>\n<span style=\"color: #000000\">}</span>\n\n<span style=\"color: #0000FF\">function</span><span style=\"color: #000000\"> updateTodo(todo: Todo, fieldsToUpdate: Partial&lt;Todo&gt;) {</span>\n<span style=\"color: #000000\">  </span><span style=\"color: #0000FF\">return</span><span style=\"color: #000000\"> { ...todo, ...fieldsToUpdate };</span>\n<span style=\"color: #000000\">}</span>\n\n<span style=\"color: #0000FF\">const</span><span style=\"color: #000000\"> todo1 = {</span>\n<span style=\"color: #000000\">  title: </span><span style=\"color: #A31515\">\"organize desk\"</span><span style=\"color: #000000\">,</span>\n<span style=\"color: #000000\">  description: </span><span style=\"color: #A31515\">\"clear clutter\"</span>\n<span style=\"color: #000000\">};</span>\n\n<span style=\"color: #0000FF\">const</span><span style=\"color: #000000\"> todo2 = updateTodo(todo1, {</span>\n<span style=\"color: #000000\">  description: </span><span style=\"color: #A31515\">\"throw out trash\"</span>\n<span style=\"color: #000000\">});</span></code></div></pre>\n<h1 id=\"readonlyt\" style=\"position:relative;\"><a href=\"#readonlyt\" aria-label=\"readonlyt permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a><code>Readonly&#x3C;T></code></h1>\n<p>Constructs a type with all properties of <code>T</code> set to <code>readonly</code>, meaning the properties of the constructed type cannot be reassigned.</p>\n<h5 id=\"example-1\" style=\"position:relative;\"><a href=\"#example-1\" aria-label=\"example 1 permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Example</h5>\n<pre class=\"shiki\"><div class=\"language-id\">ts</div><div class='code-container'><code><span style=\"color: #0000FF\">interface</span><span style=\"color: #000000\"> Todo {</span>\n<span style=\"color: #000000\">  title: string;</span>\n<span style=\"color: #000000\">}</span>\n\n<span style=\"color: #0000FF\">const</span><span style=\"color: #000000\"> todo: Readonly&lt;Todo&gt; = {</span>\n<span style=\"color: #000000\">  title: </span><span style=\"color: #A31515\">\"Delete inactive users\"</span>\n<span style=\"color: #000000\">};</span>\n\n<span style=\"color: #000000\">todo.title = </span><span style=\"color: #A31515\">\"Hello\"</span><span style=\"color: #000000\">; </span><span style=\"color: #008000\">// Error: cannot reassign a readonly property</span></code></div></pre>\n<p>This utility is useful for representing assignment expressions that will fail at runtime (i.e. when attempting to reassign properties of a <a href=\"https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/freeze\">frozen object</a>).</p>\n<h5 id=\"objectfreeze\" style=\"position:relative;\"><a href=\"#objectfreeze\" aria-label=\"objectfreeze permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a><code>Object.freeze</code></h5>\n<pre class=\"shiki\"><div class=\"language-id\">ts</div><div class='code-container'><code><span style=\"color: #0000FF\">function</span><span style=\"color: #000000\"> freeze&lt;T&gt;(obj: T): Readonly&lt;T&gt;;</span></code></div></pre>\n<h1 id=\"recordkt\" style=\"position:relative;\"><a href=\"#recordkt\" aria-label=\"recordkt permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a><code>Record&#x3C;K,T></code></h1>\n<p>Constructs a type with a set of properties <code>K</code> of type <code>T</code>. This utility can be used to map the properties of a type to another type.</p>\n<h5 id=\"example-2\" style=\"position:relative;\"><a href=\"#example-2\" aria-label=\"example 2 permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Example</h5>\n<pre class=\"shiki\"><div class=\"language-id\">ts</div><div class='code-container'><code><span style=\"color: #0000FF\">interface</span><span style=\"color: #000000\"> PageInfo {</span>\n<span style=\"color: #000000\">  title: string;</span>\n<span style=\"color: #000000\">}</span>\n\n<span style=\"color: #0000FF\">type</span><span style=\"color: #000000\"> Page = </span><span style=\"color: #A31515\">\"home\"</span><span style=\"color: #000000\"> | </span><span style=\"color: #A31515\">\"about\"</span><span style=\"color: #000000\"> | </span><span style=\"color: #A31515\">\"contact\"</span><span style=\"color: #000000\">;</span>\n\n<span style=\"color: #0000FF\">const</span><span style=\"color: #000000\"> x: Record&lt;Page, PageInfo&gt; = {</span>\n<span style=\"color: #000000\">  about: { title: </span><span style=\"color: #A31515\">\"about\"</span><span style=\"color: #000000\"> },</span>\n<span style=\"color: #000000\">  contact: { title: </span><span style=\"color: #A31515\">\"contact\"</span><span style=\"color: #000000\"> },</span>\n<span style=\"color: #000000\">  home: { title: </span><span style=\"color: #A31515\">\"home\"</span><span style=\"color: #000000\"> }</span>\n<span style=\"color: #000000\">};</span></code></div></pre>\n<h1 id=\"picktk\" style=\"position:relative;\"><a href=\"#picktk\" aria-label=\"picktk permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a><code>Pick&#x3C;T,K></code></h1>\n<p>Constructs a type by picking the set of properties <code>K</code> from <code>T</code>.</p>\n<h5 id=\"example-3\" style=\"position:relative;\"><a href=\"#example-3\" aria-label=\"example 3 permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Example</h5>\n<pre class=\"shiki\"><div class=\"language-id\">ts</div><div class='code-container'><code><span style=\"color: #0000FF\">interface</span><span style=\"color: #000000\"> Todo {</span>\n<span style=\"color: #000000\">  title: string;</span>\n<span style=\"color: #000000\">  description: string;</span>\n<span style=\"color: #000000\">  completed: boolean;</span>\n<span style=\"color: #000000\">}</span>\n\n<span style=\"color: #0000FF\">type</span><span style=\"color: #000000\"> TodoPreview = Pick&lt;Todo, </span><span style=\"color: #A31515\">\"title\"</span><span style=\"color: #000000\"> | </span><span style=\"color: #A31515\">\"completed\"</span><span style=\"color: #000000\">&gt;;</span>\n\n<span style=\"color: #0000FF\">const</span><span style=\"color: #000000\"> todo: TodoPreview = {</span>\n<span style=\"color: #000000\">  title: </span><span style=\"color: #A31515\">\"Clean room\"</span><span style=\"color: #000000\">,</span>\n<span style=\"color: #000000\">  completed: </span><span style=\"color: #0000FF\">false</span>\n<span style=\"color: #000000\">};</span></code></div></pre>\n<h1 id=\"omittk\" style=\"position:relative;\"><a href=\"#omittk\" aria-label=\"omittk permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a><code>Omit&#x3C;T,K></code></h1>\n<p>Constructs a type by picking all properties from <code>T</code> and then removing <code>K</code>.</p>\n<h5 id=\"example-4\" style=\"position:relative;\"><a href=\"#example-4\" aria-label=\"example 4 permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Example</h5>\n<pre class=\"shiki\"><div class=\"language-id\">ts</div><div class='code-container'><code><span style=\"color: #0000FF\">interface</span><span style=\"color: #000000\"> Todo {</span>\n<span style=\"color: #000000\">  title: string;</span>\n<span style=\"color: #000000\">  description: string;</span>\n<span style=\"color: #000000\">  completed: boolean;</span>\n<span style=\"color: #000000\">}</span>\n\n<span style=\"color: #0000FF\">type</span><span style=\"color: #000000\"> TodoPreview = Omit&lt;Todo, </span><span style=\"color: #A31515\">\"description\"</span><span style=\"color: #000000\">&gt;;</span>\n\n<span style=\"color: #0000FF\">const</span><span style=\"color: #000000\"> todo: TodoPreview = {</span>\n<span style=\"color: #000000\">  title: </span><span style=\"color: #A31515\">\"Clean room\"</span><span style=\"color: #000000\">,</span>\n<span style=\"color: #000000\">  completed: </span><span style=\"color: #0000FF\">false</span>\n<span style=\"color: #000000\">};</span></code></div></pre>\n<h1 id=\"excludetu\" style=\"position:relative;\"><a href=\"#excludetu\" aria-label=\"excludetu permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a><code>Exclude&#x3C;T,U></code></h1>\n<p>Constructs a type by excluding from <code>T</code> all properties that are assignable to <code>U</code>.</p>\n<h5 id=\"example-5\" style=\"position:relative;\"><a href=\"#example-5\" aria-label=\"example 5 permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Example</h5>\n<pre class=\"shiki\"><div class=\"language-id\">ts</div><div class='code-container'><code><span style=\"color: #0000FF\">type</span><span style=\"color: #000000\"> T0 = Exclude&lt;</span><span style=\"color: #A31515\">\"a\"</span><span style=\"color: #000000\"> | </span><span style=\"color: #A31515\">\"b\"</span><span style=\"color: #000000\"> | </span><span style=\"color: #A31515\">\"c\"</span><span style=\"color: #000000\">, </span><span style=\"color: #A31515\">\"a\"</span><span style=\"color: #000000\">&gt;; </span><span style=\"color: #008000\">// \"b\" | \"c\"</span>\n<span style=\"color: #0000FF\">type</span><span style=\"color: #000000\"> T1 = Exclude&lt;</span><span style=\"color: #A31515\">\"a\"</span><span style=\"color: #000000\"> | </span><span style=\"color: #A31515\">\"b\"</span><span style=\"color: #000000\"> | </span><span style=\"color: #A31515\">\"c\"</span><span style=\"color: #000000\">, </span><span style=\"color: #A31515\">\"a\"</span><span style=\"color: #000000\"> | </span><span style=\"color: #A31515\">\"b\"</span><span style=\"color: #000000\">&gt;; </span><span style=\"color: #008000\">// \"c\"</span>\n<span style=\"color: #0000FF\">type</span><span style=\"color: #000000\"> T2 = Exclude&lt;string | number | (() </span><span style=\"color: #0000FF\">=&gt;</span><span style=\"color: #000000\"> void), Function&gt;; </span><span style=\"color: #008000\">// string | number</span></code></div></pre>\n<h1 id=\"extracttu\" style=\"position:relative;\"><a href=\"#extracttu\" aria-label=\"extracttu permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a><code>Extract&#x3C;T,U></code></h1>\n<p>Constructs a type by extracting from <code>T</code> all properties that are assignable to <code>U</code>.</p>\n<h5 id=\"example-6\" style=\"position:relative;\"><a href=\"#example-6\" aria-label=\"example 6 permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Example</h5>\n<pre class=\"shiki\"><div class=\"language-id\">ts</div><div class='code-container'><code><span style=\"color: #0000FF\">type</span><span style=\"color: #000000\"> T0 = Extract&lt;</span><span style=\"color: #A31515\">\"a\"</span><span style=\"color: #000000\"> | </span><span style=\"color: #A31515\">\"b\"</span><span style=\"color: #000000\"> | </span><span style=\"color: #A31515\">\"c\"</span><span style=\"color: #000000\">, </span><span style=\"color: #A31515\">\"a\"</span><span style=\"color: #000000\"> | </span><span style=\"color: #A31515\">\"f\"</span><span style=\"color: #000000\">&gt;; </span><span style=\"color: #008000\">// \"a\"</span>\n<span style=\"color: #0000FF\">type</span><span style=\"color: #000000\"> T1 = Extract&lt;string | number | (() </span><span style=\"color: #0000FF\">=&gt;</span><span style=\"color: #000000\"> void), Function&gt;; </span><span style=\"color: #008000\">// () =&gt; void</span></code></div></pre>\n<h1 id=\"nonnullablet\" style=\"position:relative;\"><a href=\"#nonnullablet\" aria-label=\"nonnullablet permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a><code>NonNullable&#x3C;T></code></h1>\n<p>Constructs a type by excluding <code>null</code> and <code>undefined</code> from <code>T</code>.</p>\n<h5 id=\"example-7\" style=\"position:relative;\"><a href=\"#example-7\" aria-label=\"example 7 permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Example</h5>\n<pre class=\"shiki\"><div class=\"language-id\">ts</div><div class='code-container'><code><span style=\"color: #0000FF\">type</span><span style=\"color: #000000\"> T0 = NonNullable&lt;string | number | undefined&gt;; </span><span style=\"color: #008000\">// string | number</span>\n<span style=\"color: #0000FF\">type</span><span style=\"color: #000000\"> T1 = NonNullable&lt;string[] | null | undefined&gt;; </span><span style=\"color: #008000\">// string[]</span></code></div></pre>\n<h1 id=\"parameterst\" style=\"position:relative;\"><a href=\"#parameterst\" aria-label=\"parameterst permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a><code>Parameters&#x3C;T></code></h1>\n<p>Constructs a tuple type of the types of the parameters of a function type <code>T</code>.</p>\n<h5 id=\"example-8\" style=\"position:relative;\"><a href=\"#example-8\" aria-label=\"example 8 permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Example</h5>\n<pre class=\"shiki\"><div class=\"language-id\">ts</div><div class='code-container'><code><span style=\"color: #0000FF\">declare</span><span style=\"color: #000000\"> </span><span style=\"color: #0000FF\">function</span><span style=\"color: #000000\"> f1(arg: { a: number; b: string }): void;</span>\n<span style=\"color: #0000FF\">type</span><span style=\"color: #000000\"> T0 = Parameters&lt;() </span><span style=\"color: #0000FF\">=&gt;</span><span style=\"color: #000000\"> string&gt;; </span><span style=\"color: #008000\">// []</span>\n<span style=\"color: #0000FF\">type</span><span style=\"color: #000000\"> T1 = Parameters&lt;(s: string) </span><span style=\"color: #0000FF\">=&gt;</span><span style=\"color: #000000\"> void&gt;; </span><span style=\"color: #008000\">// [string]</span>\n<span style=\"color: #0000FF\">type</span><span style=\"color: #000000\"> T2 = Parameters&lt;&lt;T&gt;(arg: T) </span><span style=\"color: #0000FF\">=&gt;</span><span style=\"color: #000000\"> T&gt;; </span><span style=\"color: #008000\">// [unknown]</span>\n<span style=\"color: #0000FF\">type</span><span style=\"color: #000000\"> T4 = Parameters&lt;</span><span style=\"color: #0000FF\">typeof</span><span style=\"color: #000000\"> f1&gt;; </span><span style=\"color: #008000\">// [{ a: number, b: string }]</span>\n<span style=\"color: #0000FF\">type</span><span style=\"color: #000000\"> T5 = Parameters&lt;any&gt;; </span><span style=\"color: #008000\">// unknown[]</span>\n<span style=\"color: #0000FF\">type</span><span style=\"color: #000000\"> T6 = Parameters&lt;never&gt;; </span><span style=\"color: #008000\">// never</span>\n<span style=\"color: #0000FF\">type</span><span style=\"color: #000000\"> T7 = Parameters&lt;string&gt;; </span><span style=\"color: #008000\">// Error</span>\n<span style=\"color: #0000FF\">type</span><span style=\"color: #000000\"> T8 = Parameters&lt;Function&gt;; </span><span style=\"color: #008000\">// Error</span></code></div></pre>\n<h1 id=\"constructorparameterst\" style=\"position:relative;\"><a href=\"#constructorparameterst\" aria-label=\"constructorparameterst permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a><code>ConstructorParameters&#x3C;T></code></h1>\n<p>The <code>ConstructorParameters&#x3C;T></code> type lets us extract all parameter types of a constructor function type. It produces a tuple type with all the parameter types (or the type <code>never</code> if <code>T</code> is not a function).</p>\n<h5 id=\"example-9\" style=\"position:relative;\"><a href=\"#example-9\" aria-label=\"example 9 permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Example</h5>\n<pre class=\"shiki\"><div class=\"language-id\">ts</div><div class='code-container'><code><span style=\"color: #0000FF\">type</span><span style=\"color: #000000\"> T0 = ConstructorParameters&lt;ErrorConstructor&gt;; </span><span style=\"color: #008000\">// [(string | undefined)?]</span>\n<span style=\"color: #0000FF\">type</span><span style=\"color: #000000\"> T1 = ConstructorParameters&lt;FunctionConstructor&gt;; </span><span style=\"color: #008000\">// string[]</span>\n<span style=\"color: #0000FF\">type</span><span style=\"color: #000000\"> T2 = ConstructorParameters&lt;RegExpConstructor&gt;; </span><span style=\"color: #008000\">// [string, (string | undefined)?]</span></code></div></pre>\n<h1 id=\"returntypet\" style=\"position:relative;\"><a href=\"#returntypet\" aria-label=\"returntypet permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a><code>ReturnType&#x3C;T></code></h1>\n<p>Constructs a type consisting of the return type of function <code>T</code>.</p>\n<h5 id=\"example-10\" style=\"position:relative;\"><a href=\"#example-10\" aria-label=\"example 10 permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Example</h5>\n<pre class=\"shiki\"><div class=\"language-id\">ts</div><div class='code-container'><code><span style=\"color: #0000FF\">declare</span><span style=\"color: #000000\"> </span><span style=\"color: #0000FF\">function</span><span style=\"color: #000000\"> f1(): { a: number; b: string };</span>\n<span style=\"color: #0000FF\">type</span><span style=\"color: #000000\"> T0 = ReturnType&lt;() </span><span style=\"color: #0000FF\">=&gt;</span><span style=\"color: #000000\"> string&gt;; </span><span style=\"color: #008000\">// string</span>\n<span style=\"color: #0000FF\">type</span><span style=\"color: #000000\"> T1 = ReturnType&lt;(s: string) </span><span style=\"color: #0000FF\">=&gt;</span><span style=\"color: #000000\"> void&gt;; </span><span style=\"color: #008000\">// void</span>\n<span style=\"color: #0000FF\">type</span><span style=\"color: #000000\"> T2 = ReturnType&lt;&lt;T&gt;() </span><span style=\"color: #0000FF\">=&gt;</span><span style=\"color: #000000\"> T&gt;; </span><span style=\"color: #008000\">// {}</span>\n<span style=\"color: #0000FF\">type</span><span style=\"color: #000000\"> T3 = ReturnType&lt;&lt;T </span><span style=\"color: #0000FF\">extends</span><span style=\"color: #000000\"> U, U </span><span style=\"color: #0000FF\">extends</span><span style=\"color: #000000\"> number[]&gt;() </span><span style=\"color: #0000FF\">=&gt;</span><span style=\"color: #000000\"> T&gt;; </span><span style=\"color: #008000\">// number[]</span>\n<span style=\"color: #0000FF\">type</span><span style=\"color: #000000\"> T4 = ReturnType&lt;</span><span style=\"color: #0000FF\">typeof</span><span style=\"color: #000000\"> f1&gt;; </span><span style=\"color: #008000\">// { a: number, b: string }</span>\n<span style=\"color: #0000FF\">type</span><span style=\"color: #000000\"> T5 = ReturnType&lt;any&gt;; </span><span style=\"color: #008000\">// any</span>\n<span style=\"color: #0000FF\">type</span><span style=\"color: #000000\"> T6 = ReturnType&lt;never&gt;; </span><span style=\"color: #008000\">// any</span>\n<span style=\"color: #0000FF\">type</span><span style=\"color: #000000\"> T7 = ReturnType&lt;string&gt;; </span><span style=\"color: #008000\">// Error</span>\n<span style=\"color: #0000FF\">type</span><span style=\"color: #000000\"> T8 = ReturnType&lt;Function&gt;; </span><span style=\"color: #008000\">// Error</span></code></div></pre>\n<h1 id=\"instancetypet\" style=\"position:relative;\"><a href=\"#instancetypet\" aria-label=\"instancetypet permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a><code>InstanceType&#x3C;T></code></h1>\n<p>Constructs a type consisting of the instance type of a constructor function type <code>T</code>.</p>\n<h5 id=\"example-11\" style=\"position:relative;\"><a href=\"#example-11\" aria-label=\"example 11 permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Example</h5>\n<pre class=\"shiki\"><div class=\"language-id\">ts</div><div class='code-container'><code><span style=\"color: #0000FF\">class</span><span style=\"color: #000000\"> C {</span>\n<span style=\"color: #000000\">  x = </span><span style=\"color: #09835A\">0</span><span style=\"color: #000000\">;</span>\n<span style=\"color: #000000\">  y = </span><span style=\"color: #09835A\">0</span><span style=\"color: #000000\">;</span>\n<span style=\"color: #000000\">}</span>\n\n<span style=\"color: #0000FF\">type</span><span style=\"color: #000000\"> T0 = InstanceType&lt;</span><span style=\"color: #0000FF\">typeof</span><span style=\"color: #000000\"> C&gt;; </span><span style=\"color: #008000\">// C</span>\n<span style=\"color: #0000FF\">type</span><span style=\"color: #000000\"> T1 = InstanceType&lt;any&gt;; </span><span style=\"color: #008000\">// any</span>\n<span style=\"color: #0000FF\">type</span><span style=\"color: #000000\"> T2 = InstanceType&lt;never&gt;; </span><span style=\"color: #008000\">// any</span>\n<span style=\"color: #0000FF\">type</span><span style=\"color: #000000\"> T3 = InstanceType&lt;string&gt;; </span><span style=\"color: #008000\">// Error</span>\n<span style=\"color: #0000FF\">type</span><span style=\"color: #000000\"> T4 = InstanceType&lt;Function&gt;; </span><span style=\"color: #008000\">// Error</span></code></div></pre>\n<h1 id=\"requiredt\" style=\"position:relative;\"><a href=\"#requiredt\" aria-label=\"requiredt permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a><code>Required&#x3C;T></code></h1>\n<p>Constructs a type consisting of all properties of <code>T</code> set to required.</p>\n<h5 id=\"example-12\" style=\"position:relative;\"><a href=\"#example-12\" aria-label=\"example 12 permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Example</h5>\n<pre class=\"shiki\"><div class=\"language-id\">ts</div><div class='code-container'><code><span style=\"color: #0000FF\">interface</span><span style=\"color: #000000\"> Props {</span>\n<span style=\"color: #000000\">  a?: number;</span>\n<span style=\"color: #000000\">  b?: string;</span>\n<span style=\"color: #000000\">}</span>\n\n<span style=\"color: #0000FF\">const</span><span style=\"color: #000000\"> obj: Props = { a: </span><span style=\"color: #09835A\">5</span><span style=\"color: #000000\"> }; </span><span style=\"color: #008000\">// OK</span>\n\n<span style=\"color: #0000FF\">const</span><span style=\"color: #000000\"> obj2: Required&lt;Props&gt; = { a: </span><span style=\"color: #09835A\">5</span><span style=\"color: #000000\"> }; </span><span style=\"color: #008000\">// Error: property 'b' missing</span></code></div></pre>\n<h1 id=\"thisparametertype\" style=\"position:relative;\"><a href=\"#thisparametertype\" aria-label=\"thisparametertype permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a><code>ThisParameterType</code></h1>\n<p>Extracts the type of the <code>this</code> parameter of a function type, or <code>unknown</code> if the function type has no <code>this</code> parameter.</p>\n<p>Note: This type only works correctly if <code>--strictFunctionTypes</code> is enabled. See <a href=\"https://github.com/microsoft/TypeScript/issues/32964\">#32964</a>.</p>\n<h5 id=\"example-13\" style=\"position:relative;\"><a href=\"#example-13\" aria-label=\"example 13 permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Example</h5>\n<pre class=\"shiki\"><div class=\"language-id\">ts</div><div class='code-container'><code><span style=\"color: #0000FF\">function</span><span style=\"color: #000000\"> toHex(this: Number) {</span>\n<span style=\"color: #000000\">  </span><span style=\"color: #0000FF\">return</span><span style=\"color: #000000\"> </span><span style=\"color: #0000FF\">this</span><span style=\"color: #000000\">.toString(</span><span style=\"color: #09835A\">16</span><span style=\"color: #000000\">);</span>\n<span style=\"color: #000000\">}</span>\n\n<span style=\"color: #0000FF\">function</span><span style=\"color: #000000\"> numberToString(n: ThisParameterType&lt;</span><span style=\"color: #0000FF\">typeof</span><span style=\"color: #000000\"> toHex&gt;) {</span>\n<span style=\"color: #000000\">  </span><span style=\"color: #0000FF\">return</span><span style=\"color: #000000\"> toHex.apply(n);</span>\n<span style=\"color: #000000\">}</span></code></div></pre>\n<h1 id=\"omitthisparameter\" style=\"position:relative;\"><a href=\"#omitthisparameter\" aria-label=\"omitthisparameter permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a><code>OmitThisParameter</code></h1>\n<p>Removes the ‘this’ parameter from a function type.</p>\n<p>Note: This type only works correctly if <code>--strictFunctionTypes</code> is enabled. See <a href=\"https://github.com/microsoft/TypeScript/issues/32964\">#32964</a>.</p>\n<h5 id=\"example-14\" style=\"position:relative;\"><a href=\"#example-14\" aria-label=\"example 14 permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Example</h5>\n<pre class=\"shiki\"><div class=\"language-id\">ts</div><div class='code-container'><code><span style=\"color: #0000FF\">function</span><span style=\"color: #000000\"> toHex(this: Number) {</span>\n<span style=\"color: #000000\">  </span><span style=\"color: #0000FF\">return</span><span style=\"color: #000000\"> </span><span style=\"color: #0000FF\">this</span><span style=\"color: #000000\">.toString(</span><span style=\"color: #09835A\">16</span><span style=\"color: #000000\">);</span>\n<span style=\"color: #000000\">}</span>\n\n<span style=\"color: #008000\">// The return type of `bind` is already using `OmitThisParameter`, this is just for demonstration.</span>\n<span style=\"color: #0000FF\">const</span><span style=\"color: #000000\"> fiveToHex: OmitThisParameter&lt;</span><span style=\"color: #0000FF\">typeof</span><span style=\"color: #000000\"> toHex&gt; = toHex.bind(</span><span style=\"color: #09835A\">5</span><span style=\"color: #000000\">);</span>\n\n<span style=\"color: #000000\">console.log(fiveToHex());</span></code></div></pre>\n<h1 id=\"thistypet\" style=\"position:relative;\"><a href=\"#thistypet\" aria-label=\"thistypet permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a><code>ThisType&#x3C;T></code></h1>\n<p>This utility does not return a transformed type. Instead, it serves as a marker for a contextual <code>this</code> type. Note that the <code>--noImplicitThis</code> flag must be enabled to use this utility.</p>\n<h5 id=\"example-15\" style=\"position:relative;\"><a href=\"#example-15\" aria-label=\"example 15 permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Example</h5>\n<pre class=\"shiki\"><div class=\"language-id\">ts</div><div class='code-container'><code><span style=\"color: #008000\">// Compile with --noImplicitThis</span>\n\n<span style=\"color: #0000FF\">type</span><span style=\"color: #000000\"> ObjectDescriptor&lt;D, M&gt; = {</span>\n<span style=\"color: #000000\">  data?: D;</span>\n<span style=\"color: #000000\">  methods?: M & ThisType&lt;D & M&gt;; </span><span style=\"color: #008000\">// Type of 'this' in methods is D & M</span>\n<span style=\"color: #000000\">};</span>\n\n<span style=\"color: #0000FF\">function</span><span style=\"color: #000000\"> makeObject&lt;D, M&gt;(desc: ObjectDescriptor&lt;D, M&gt;): D & M {</span>\n<span style=\"color: #000000\">  </span><span style=\"color: #0000FF\">let</span><span style=\"color: #000000\"> data: object = desc.data || {};</span>\n<span style=\"color: #000000\">  </span><span style=\"color: #0000FF\">let</span><span style=\"color: #000000\"> methods: object = desc.methods || {};</span>\n<span style=\"color: #000000\">  </span><span style=\"color: #0000FF\">return</span><span style=\"color: #000000\"> { ...data, ...methods } </span><span style=\"color: #0000FF\">as</span><span style=\"color: #000000\"> D & M;</span>\n<span style=\"color: #000000\">}</span>\n\n<span style=\"color: #0000FF\">let</span><span style=\"color: #000000\"> obj = makeObject({</span>\n<span style=\"color: #000000\">  data: { x: </span><span style=\"color: #09835A\">0</span><span style=\"color: #000000\">, y: </span><span style=\"color: #09835A\">0</span><span style=\"color: #000000\"> },</span>\n<span style=\"color: #000000\">  methods: {</span>\n<span style=\"color: #000000\">    moveBy(dx: number, dy: number) {</span>\n<span style=\"color: #000000\">      </span><span style=\"color: #0000FF\">this</span><span style=\"color: #000000\">.x += dx; </span><span style=\"color: #008000\">// Strongly typed this</span>\n<span style=\"color: #000000\">      </span><span style=\"color: #0000FF\">this</span><span style=\"color: #000000\">.y += dy; </span><span style=\"color: #008000\">// Strongly typed this</span>\n<span style=\"color: #000000\">    }</span>\n<span style=\"color: #000000\">  }</span>\n<span style=\"color: #000000\">});</span>\n\n<span style=\"color: #000000\">obj.x = </span><span style=\"color: #09835A\">10</span><span style=\"color: #000000\">;</span>\n<span style=\"color: #000000\">obj.y = </span><span style=\"color: #09835A\">20</span><span style=\"color: #000000\">;</span>\n<span style=\"color: #000000\">obj.moveBy(</span><span style=\"color: #09835A\">5</span><span style=\"color: #000000\">, </span><span style=\"color: #09835A\">5</span><span style=\"color: #000000\">);</span></code></div></pre>\n<p>In the example above, the <code>methods</code> object in the argument to <code>makeObject</code> has a contextual type that includes <code>ThisType&#x3C;D &#x26; M></code> and therefore the type of <code>this</code> in methods within the <code>methods</code> object is <code>{ x: number, y: number } &#x26; { moveBy(dx: number, dy: number): number }</code>. Notice how the type of the <code>methods</code> property simultaneously is an inference target and a source for the <code>this</code> type in methods.</p>\n<p>The <code>ThisType&#x3C;T></code> marker interface is simply an empty interface declared in <code>lib.d.ts</code>. Beyond being recognized in the contextual type of an object literal, the interface acts like any empty interface.</p>","headings":[{"value":"Introduction","depth":1},{"value":"Partial<T>","depth":1},{"value":"Example","depth":5},{"value":"Readonly<T>","depth":1},{"value":"Example","depth":5},{"value":"Object.freeze","depth":5},{"value":"Record<K,T>","depth":1},{"value":"Example","depth":5},{"value":"Pick<T,K>","depth":1},{"value":"Example","depth":5},{"value":"Omit<T,K>","depth":1},{"value":"Example","depth":5},{"value":"Exclude<T,U>","depth":1},{"value":"Example","depth":5},{"value":"Extract<T,U>","depth":1},{"value":"Example","depth":5},{"value":"NonNullable<T>","depth":1},{"value":"Example","depth":5},{"value":"Parameters<T>","depth":1},{"value":"Example","depth":5},{"value":"ConstructorParameters<T>","depth":1},{"value":"Example","depth":5},{"value":"ReturnType<T>","depth":1},{"value":"Example","depth":5},{"value":"InstanceType<T>","depth":1},{"value":"Example","depth":5},{"value":"Required<T>","depth":1},{"value":"Example","depth":5},{"value":"ThisParameterType","depth":1},{"value":"Example","depth":5},{"value":"OmitThisParameter","depth":1},{"value":"Example","depth":5},{"value":"ThisType<T>","depth":1},{"value":"Example","depth":5}],"frontmatter":{"permalink":"/docs/handbook/utility-types.html","title":"Utility Types"}}},"pageContext":{"slug":"/docs/handbook/utility-types.html","isOldHandbook":true}}}