<p dir="auto">It would be nice if we could write some kind of validation on user defined types. Something like:</p>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="type Integer(n:number) =&gt; String(n).macth(/^[0-9]+$/)
let x:Integer = 3 //OK
let y:Integer = 3.6 //wrong

type ColorLevel(n:number) =&gt; n&gt;0 &amp;&amp; n&lt;= 255
type RGB = {red:ColorLevel, green:ColorLevel, blue:ColorLevel};
let redColor:RGB = {red:255, green:0, blue:0}   //OK
let wrongColor:RGB = {red:255, green:900, blue:0} //wrong

type Hex(n:string) =&gt; n.match(/^([0-9]|[A-F])+$/)
let hexValue:Hex = &quot;F6A5&quot; //OK
let wrongHexValue:Hex = &quot;F6AZ5&quot; //wrong"><pre class="notranslate"><span class="pl-s1">type</span> <span class="pl-v">Integer</span><span class="pl-kos">(</span><span class="pl-s1">n</span>:<span class="pl-s1">number</span><span class="pl-kos">)</span> <span class="pl-c1">=</span><span class="pl-c1">&gt;</span> <span class="pl-v">String</span><span class="pl-kos">(</span><span class="pl-s1">n</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">macth</span><span class="pl-kos">(</span><span class="pl-pds"><span class="pl-c1">/</span><span class="pl-cce">^</span><span class="pl-kos">[</span>0-9<span class="pl-kos">]</span><span class="pl-c1">+</span><span class="pl-cce">$</span><span class="pl-c1">/</span></span><span class="pl-kos">)</span>
<span class="pl-k">let</span> <span class="pl-s1">x</span>:<span class="pl-v">Integer</span> <span class="pl-c1">=</span> <span class="pl-c1">3</span> <span class="pl-c">//OK</span>
<span class="pl-k">let</span> <span class="pl-s1">y</span>:<span class="pl-v">Integer</span> <span class="pl-c1">=</span> <span class="pl-c1">3.6</span> <span class="pl-c">//wrong</span>

<span class="pl-en">type</span> <span class="pl-v">ColorLevel</span><span class="pl-kos">(</span><span class="pl-s1">n</span>:<span class="pl-s1">number</span><span class="pl-kos">)</span> <span class="pl-c1">=</span><span class="pl-c1">&gt;</span> <span class="pl-s1">n</span><span class="pl-c1">&gt;</span><span class="pl-c1">0</span> <span class="pl-c1">&amp;&amp;</span> <span class="pl-s1">n</span><span class="pl-c1">&lt;=</span> <span class="pl-c1">255</span>
<span class="pl-s1">type</span> <span class="pl-c1">RGB</span> <span class="pl-c1">=</span> <span class="pl-kos">{</span><span class="pl-c1">red</span>:<span class="pl-v">ColorLevel</span><span class="pl-kos">,</span> <span class="pl-c1">green</span>:<span class="pl-v">ColorLevel</span><span class="pl-kos">,</span> <span class="pl-c1">blue</span>:<span class="pl-v">ColorLevel</span><span class="pl-kos">}</span><span class="pl-kos">;</span>
<span class="pl-k">let</span> <span class="pl-s1">redColor</span>:<span class="pl-c1">RGB</span> <span class="pl-c1">=</span> <span class="pl-kos">{</span><span class="pl-c1">red</span>:<span class="pl-c1">255</span><span class="pl-kos">,</span> <span class="pl-c1">green</span>:<span class="pl-c1">0</span><span class="pl-kos">,</span> <span class="pl-c1">blue</span>:<span class="pl-c1">0</span><span class="pl-kos">}</span>   <span class="pl-c">//OK</span>
<span class="pl-k">let</span> <span class="pl-s1">wrongColor</span>:<span class="pl-c1">RGB</span> <span class="pl-c1">=</span> <span class="pl-kos">{</span><span class="pl-c1">red</span>:<span class="pl-c1">255</span><span class="pl-kos">,</span> <span class="pl-c1">green</span>:<span class="pl-c1">900</span><span class="pl-kos">,</span> <span class="pl-c1">blue</span>:<span class="pl-c1">0</span><span class="pl-kos">}</span> <span class="pl-c">//wrong</span>

<span class="pl-en">type</span> <span class="pl-v">Hex</span><span class="pl-kos">(</span><span class="pl-s1">n</span>:<span class="pl-s1">string</span><span class="pl-kos">)</span> <span class="pl-c1">=</span><span class="pl-c1">&gt;</span> <span class="pl-s1">n</span><span class="pl-kos">.</span><span class="pl-en">match</span><span class="pl-kos">(</span><span class="pl-pds"><span class="pl-c1">/</span><span class="pl-cce">^</span><span class="pl-kos">(</span><span class="pl-kos">[</span>0-9<span class="pl-kos">]</span><span class="pl-c1">|</span><span class="pl-kos">[</span>A-F<span class="pl-kos">]</span><span class="pl-kos">)</span><span class="pl-c1">+</span><span class="pl-cce">$</span><span class="pl-c1">/</span></span><span class="pl-kos">)</span>
<span class="pl-k">let</span> <span class="pl-s1">hexValue</span>:<span class="pl-v">Hex</span> <span class="pl-c1">=</span> <span class="pl-s">"F6A5"</span> <span class="pl-c">//OK</span>
<span class="pl-k">let</span> <span class="pl-s1">wrongHexValue</span>:<span class="pl-v">Hex</span> <span class="pl-c1">=</span> <span class="pl-s">"F6AZ5"</span> <span class="pl-c">//wrong</span></pre></div>
<p dir="auto">The value that the type can accept would be determined by the function parameter type and by the function evaluation itself. That would solve other issues like <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="131370314" data-permission-text="Title is private" data-url="https://github.com/microsoft/TypeScript/issues/6902" data-hovercard-type="issue" data-hovercard-url="/microsoft/TypeScript/issues/6902/hovercard" href="https://github.com/microsoft/TypeScript/issues/6902">#6902</a>, <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="128264906" data-permission-text="Title is private" data-url="https://github.com/microsoft/TypeScript/issues/6579" data-hovercard-type="issue" data-hovercard-url="/microsoft/TypeScript/issues/6579/hovercard" href="https://github.com/microsoft/TypeScript/issues/6579">#6579</a> or <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="147105246" data-permission-text="Title is private" data-url="https://github.com/microsoft/TypeScript/issues/7982" data-hovercard-type="issue" data-hovercard-url="/microsoft/TypeScript/issues/7982/hovercard" href="https://github.com/microsoft/TypeScript/issues/7982">#7982</a></p>
<p dir="auto">There are cases, where a property can not just be any string (or a set of strings), but needs to match a pattern.</p>
<div class="highlight highlight-source-ts notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="let fontStyle: 'normal' | 'italic' = 'normal'; // already available in master
let fontColor: /^#([0-9a-f]{3}|[0-9a-f]{6})$/i = '#000'; // my suggestion"><pre class="notranslate"><span class="pl-k">let</span> <span class="pl-s1">fontStyle</span>: <span class="pl-s">'normal'</span> <span class="pl-c1">|</span> <span class="pl-s">'italic'</span> <span class="pl-c1">=</span> <span class="pl-s">'normal'</span><span class="pl-kos">;</span> <span class="pl-c">// already available in master</span>
<span class="pl-k">let</span> <span class="pl-s1">fontColor</span>: <span class="pl-pds"><span class="pl-c1">/</span><span class="pl-cce">^</span>#<span class="pl-kos">(</span><span class="pl-kos">[</span>0-9a-f<span class="pl-kos">]</span><span class="pl-kos">{</span>3<span class="pl-kos">}</span><span class="pl-c1">|</span><span class="pl-kos">[</span>0-9a-f<span class="pl-kos">]</span><span class="pl-kos">{</span>6<span class="pl-kos">}</span><span class="pl-kos">)</span><span class="pl-cce">$</span><span class="pl-c1">/</span>i</span> <span class="pl-c1">=</span> <span class="pl-s">'#000'</span><span class="pl-kos">;</span> <span class="pl-c">// my suggestion</span></pre></div>
<p dir="auto">It's common practice in JavaScript to store color values in css notation, such as in the css style reflection of DOM nodes or various 3rd party libraries.</p>
<p dir="auto">What do you think?</p>