<p dir="auto"><strong>TypeScript Version:</strong><br>
type-script playground</p>
<p dir="auto"><strong>Code</strong><br>
<em>TS</em></p>
<div class="highlight highlight-source-ts notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="enum Color {Red = 6, Green=5, Blue};
let colorName: string = Color[2];

alert(colorName);"><pre class="notranslate"><span class="pl-k">enum</span> <span class="pl-smi">Color</span> <span class="pl-kos">{</span><span class="pl-c1">Red</span> <span class="pl-c1">=</span> <span class="pl-c1">6</span><span class="pl-kos">,</span> <span class="pl-c1">Green</span><span class="pl-c1">=</span><span class="pl-c1">5</span><span class="pl-kos">,</span> <span class="pl-c1">Blue</span><span class="pl-kos">}</span><span class="pl-kos">;</span>
<span class="pl-k">let</span> <span class="pl-s1">colorName</span>: <span class="pl-smi">string</span> <span class="pl-c1">=</span> <span class="pl-smi">Color</span><span class="pl-kos">[</span><span class="pl-c1">2</span><span class="pl-kos">]</span><span class="pl-kos">;</span>

<span class="pl-en">alert</span><span class="pl-kos">(</span><span class="pl-s1">colorName</span><span class="pl-kos">)</span><span class="pl-kos">;</span></pre></div>
<p dir="auto">**<br>
<em>JS</em></p>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="var Color;
(function (Color) {
    Color[Color[&quot;Red&quot;] = 6] = &quot;Red&quot;;
    Color[Color[&quot;Green&quot;] = 5] = &quot;Green&quot;;
    Color[Color[&quot;Blue&quot;] = 6] = &quot;Blue&quot;;
})(Color || (Color = {}));
;
var colorName = Color[2];
alert(colorName);"><pre class="notranslate"><span class="pl-k">var</span> <span class="pl-v">Color</span><span class="pl-kos">;</span>
<span class="pl-kos">(</span><span class="pl-k">function</span> <span class="pl-kos">(</span><span class="pl-v">Color</span><span class="pl-kos">)</span> <span class="pl-kos">{</span>
    <span class="pl-v">Color</span><span class="pl-kos">[</span><span class="pl-v">Color</span><span class="pl-kos">[</span><span class="pl-s">"Red"</span><span class="pl-kos">]</span> <span class="pl-c1">=</span> <span class="pl-c1">6</span><span class="pl-kos">]</span> <span class="pl-c1">=</span> <span class="pl-s">"Red"</span><span class="pl-kos">;</span>
    <span class="pl-v">Color</span><span class="pl-kos">[</span><span class="pl-v">Color</span><span class="pl-kos">[</span><span class="pl-s">"Green"</span><span class="pl-kos">]</span> <span class="pl-c1">=</span> <span class="pl-c1">5</span><span class="pl-kos">]</span> <span class="pl-c1">=</span> <span class="pl-s">"Green"</span><span class="pl-kos">;</span>
    <span class="pl-v">Color</span><span class="pl-kos">[</span><span class="pl-v">Color</span><span class="pl-kos">[</span><span class="pl-s">"Blue"</span><span class="pl-kos">]</span> <span class="pl-c1">=</span> <span class="pl-c1">6</span><span class="pl-kos">]</span> <span class="pl-c1">=</span> <span class="pl-s">"Blue"</span><span class="pl-kos">;</span>
<span class="pl-kos">}</span><span class="pl-kos">)</span><span class="pl-kos">(</span><span class="pl-v">Color</span> <span class="pl-c1">||</span> <span class="pl-kos">(</span><span class="pl-v">Color</span> <span class="pl-c1">=</span> <span class="pl-kos">{</span><span class="pl-kos">}</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
<span class="pl-kos">;</span>
<span class="pl-k">var</span> <span class="pl-s1">colorName</span> <span class="pl-c1">=</span> <span class="pl-v">Color</span><span class="pl-kos">[</span><span class="pl-c1">2</span><span class="pl-kos">]</span><span class="pl-kos">;</span>
<span class="pl-en">alert</span><span class="pl-kos">(</span><span class="pl-s1">colorName</span><span class="pl-kos">)</span><span class="pl-kos">;</span></pre></div>
<p dir="auto">**</p>
<p dir="auto"><strong>Expected behavior:</strong><br>
Since 'Red' is number 6, and 'Blue' defined automatically to follow 'Green's 5, 'Blue' should be getting any number that not listed yet,<br>
The alert should not call 'Blue'.</p>
<p dir="auto"><strong>Actual behavior:</strong><br>
The 'Blue' element in the enum get 6 because it follows 'Green' 5 and did not get a pre-set.</p>
<p dir="auto">Enum value incrementation does not consider previously defined values, nor does the compiler throws an error on duplicate values.</p>
<p dir="auto">Which means you can end up with potential bugs:</p>
<div class="highlight highlight-source-ts notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="enum Color {Red = 3, Green = 2, Blue};

Color.Red == Color.Blue; //true"><pre class="notranslate"><span class="pl-k">enum</span> <span class="pl-smi">Color</span> <span class="pl-kos">{</span><span class="pl-c1">Red</span> <span class="pl-c1">=</span> <span class="pl-c1">3</span><span class="pl-kos">,</span> <span class="pl-c1">Green</span> <span class="pl-c1">=</span> <span class="pl-c1">2</span><span class="pl-kos">,</span> <span class="pl-c1">Blue</span><span class="pl-kos">}</span><span class="pl-kos">;</span>

<span class="pl-smi">Color</span><span class="pl-kos">.</span><span class="pl-c1">Red</span> <span class="pl-c1">==</span> <span class="pl-smi">Color</span><span class="pl-kos">.</span><span class="pl-c1">Blue</span><span class="pl-kos">;</span> <span class="pl-c">//true</span></pre></div>