TS枚举 —— 数字枚举可以互相映射的原因

TS数字枚举可以互相映射的原因

• 数字枚举

  • TS的数字枚举是枚举的一种，TS的枚举如果不为它的枚举成员定义字符串等值的话，那么默认是数字枚举。
  • 数字枚举也就是，枚举中所有枚举成员的值都是number类型。
  • 如果不为数字枚举的枚举成员定义值，那么将从0开始递增。

• 数字枚举互相映射

  • 数字枚举是可以互相映射的。（其他如字符串枚举都不行）

    enum LivingStatus{
      preview,
      living,
      replay,
      ended
    }
    LivingStatus['preview'] // 0
    LivingStatus[0] //'preview'
    

• 数字枚举能够互相映射的原理

  • 首先我们来看一下，上面的TS枚举，被编译成JS后是什么样子

    var LivingStatus;
    (function(LivingStatus){
      LivingStatus[(LivingStatus['preview'] = 0)] = 'preview'
      LivingStatus[(LivingStatus['living'] = 1)] = 'living'
      LivingStatus[(LivingStatus['reply'] = 2)] = 'reply
      LivingStatus[(LivingStatus['ended'] = 3)] = 'ended'
    })(LivingStatus || (LivingStatus = {}))
    

    这里我们可以看到，首先声明了一个变量LivingStatus，然后是一个立即执行的函数，在执行这个立即执行的函数时，首先JS引擎准备执行第一行

    LivingSatus[(LivingStatus['preview'] = 0)] = 'preview'

    JS引擎发现这是一句赋值语句，所以首先会对LivingSatus[(LivingStatus['preview'] = 0)]

    进行LHS查询，在找到LivingStatus对象之后，查找

    (LivingStatus['preview'] = 0)成员，然后JS引擎发现，这时一个赋值操作，所以会先将0赋予LivingStatus['preview']，但是由于JS的赋值操作符是会返回值的，并且返回的是被赋予的值，所以

    LivingSatus[(LivingStatus['preview'] = 0)]变成了

    LivingStatus[0]。