<ruby id="bdb3f"></ruby>

    <p id="bdb3f"><cite id="bdb3f"></cite></p>

      <p id="bdb3f"><cite id="bdb3f"><th id="bdb3f"></th></cite></p><p id="bdb3f"></p>
        <p id="bdb3f"><cite id="bdb3f"></cite></p>

          <pre id="bdb3f"></pre>
          <pre id="bdb3f"><del id="bdb3f"><thead id="bdb3f"></thead></del></pre>

          <ruby id="bdb3f"><mark id="bdb3f"></mark></ruby><ruby id="bdb3f"></ruby>
          <pre id="bdb3f"><pre id="bdb3f"><mark id="bdb3f"></mark></pre></pre><output id="bdb3f"></output><p id="bdb3f"></p><p id="bdb3f"></p>

          <pre id="bdb3f"><del id="bdb3f"><progress id="bdb3f"></progress></del></pre>

                <ruby id="bdb3f"></ruby>

                ??一站式輕松地調用各大LLM模型接口,支持GPT4、智譜、豆包、星火、月之暗面及文生圖、文生視頻 廣告
                [TOC] >[success] # 枚舉(Enum) 本章節講一下 **枚舉(Enum)** ,**枚舉(Enum)** 對于 **前端開發者** 也是一個全新的概念,它非常好理解,在 **js** 中有 **常量( const)** ,**常量( const)** 是指在**執行程序中,不會改變的值** ,在 **js** 中我們會用 **const 聲明常量** ,但是 **有些取值是在一定范圍內的一系列的常量,比如說我們一周內的七天(周一到周日),三原色(紅、黃、藍),四個方位(上、下、左、右)** 等等,這些值就可以用 **枚舉(Enum)** 來表示。 >[success] ## 數字枚舉(Enum) 1. **數字枚舉(Enum)舉例** **枚舉(Enum)** 成員會被 **賦值成 0 開始 ,自動遞增的一個數字** ,**Up** 是 **0** , **Down** 是 **1** **index.ts** ~~~ enum Direction { Up, Down, Left, Right } console.log(Direction.Up) // 0 console.log(Direction[0]) // Up ~~~ **枚舉(Enum)** 就像一個雙向映射一樣,可以用 **數組** 來 **取枚舉成員的屬性字符串** ,用 **對象來取枚舉成員的值** 。 **編譯后** : 編譯成 **js文件** 就是下面這樣,首先是一個**自執行函數** ,封裝了自己的一個 **作用域** ,其中 **Direction["Up"] = 0** 是用來 **自我解釋** ,它會將 **Direction["Up"] = 0** 中的 **0** ,設為 **Direction[0] = "Up"** 的 **索引** ~~~ var Direction; (function (Direction) { Direction[Direction["Up"] = 0] = "Up"; Direction[Direction["Down"] = 1] = "Down"; Direction[Direction["Left"] = 2] = "Left"; Direction[Direction["Right"] = 3] = "Right"; })(Direction || (Direction = {})); console.log(Direction.Up); // 0 console.log(Direction[0]); // Up ~~~ 2. **值遞增** 如果 **給枚舉成員賦一個 number 值** ,它會 **從賦值這個成員開始向后遞增數字** ,如下代碼: **index.ts** ~~~ enum Direction { Up, // 0 Down = 10, // 10 Left, // 11 Right // 12 } console.log(Direction.Down) // 10 console.log(Direction[2]) // undefined ~~~ 上面 **Direction[2]** 為什么會是 **undefined** 呢?正常情況下 **0 是 Up** 、 **1 是 Down** 、 **2 是 Left** , 因為 **Down** 被 **賦值成 10** ,也就是說**Down** 的 **索引是 10** ,**Left** 的 **索引** 應該是 **11** ,要這樣寫 **console.log(Direction[11])** 才能打印出 **Left** >[success] ## 字符串枚舉(Enum) **字符串枚舉** 就是 **給它每一項都加一個字符串的值** , **不可以有的成員有字符串值,有的成員沒有字符串值** , **字符串枚舉** 可以用來做一個 **簡單的字符串的比較** ,如下: **index.ts** ~~~ enum Direction { Up = 'UP', Down = 'DOWN', Left = 'LEFT', Right = 'RIGHT' } const value = 'UP' // 用來做判斷 if(value === Direction.Up){ console.log('go Up!') } ~~~ >[success] ## 常量枚舉(Enum) **常量枚舉(Enum)** 可以**提升性能** ,因為 **Typescript 文件** 在編譯后, **枚舉(Enum)** 會 **多出來一大堆的代碼** ,那是不是所有的 **Enum** 都可以使用 **常量枚舉** 呢, **答案是否定的** , **枚舉的值有 2 種類型** ,一種是 **常量(cosnt)值** ,一種是 **計算(computed)值** ,**只有常量值可以進行常量枚舉** ,我們這里舉例的都是 **常量值** , **計算值** 我們后期會講到。 1. **未用const 的 枚舉(Enum)** **index.ts** ~~~ enum Direction { Up = 'UP', Down = 'DOWN', Left = 'LEFT', Right = 'RIGHT' } const value = 'UP' // 用來做判斷 if(value === Direction.Up){ console.log('go Up!') } ~~~ **編譯之后成 js 文件 之后** ~~~ var Direction; (function (Direction) { Direction["Up"] = "UP"; Direction["Down"] = "DOWN"; Direction["Left"] = "LEFT"; Direction["Right"] = "RIGHT"; })(Direction || (Direction = {})); var value = 'UP'; // 用來做判斷 if (value === Direction.Up) { console.log('go Up!'); } ~~~ 2. **用 const 的 枚舉(Enum)** ~~~ const enum Direction { Up = 'UP', Down = 'DOWN', Left = 'LEFT', Right = 'RIGHT' } const value = 'UP' // 用來做判斷 if(value === Direction.Up){ console.log('go Up!') } ~~~ **編譯之后成 js 文件 之后** ~~~ var value = 'UP'; // 用來做判斷 if (value === "UP" /* Up */) { console.log('go Up!'); } ~~~
                  <ruby id="bdb3f"></ruby>

                  <p id="bdb3f"><cite id="bdb3f"></cite></p>

                    <p id="bdb3f"><cite id="bdb3f"><th id="bdb3f"></th></cite></p><p id="bdb3f"></p>
                      <p id="bdb3f"><cite id="bdb3f"></cite></p>

                        <pre id="bdb3f"></pre>
                        <pre id="bdb3f"><del id="bdb3f"><thead id="bdb3f"></thead></del></pre>

                        <ruby id="bdb3f"><mark id="bdb3f"></mark></ruby><ruby id="bdb3f"></ruby>
                        <pre id="bdb3f"><pre id="bdb3f"><mark id="bdb3f"></mark></pre></pre><output id="bdb3f"></output><p id="bdb3f"></p><p id="bdb3f"></p>

                        <pre id="bdb3f"><del id="bdb3f"><progress id="bdb3f"></progress></del></pre>

                              <ruby id="bdb3f"></ruby>

                              哎呀哎呀视频在线观看