最近大部分时间再写dart,突然用到js,发现js不能直接声明一个枚举。搜索发现还是有实现的方式,于是总结一下。

目录

枚举特点

  • 枚举值不能重复
  • 不能被修改
  • switch case可以直接判断

Object.freeze()

Object.freeze() 方法可以冻结一个对象。一个被冻结的对象再也不能被修改;冻结了一个对象则不能向这个对象添加新的属性,不能删除已有属性,不能修改该对象已有属性的可枚举性、可配置性、可写性,以及不能修改已有属性的值。此外,冻结一个对象后该对象的原型也不能被修改。freeze() 返回和传入的参数相同的对象。(来自MDN

总结:让被冻结的对象,不能再修改。

Symbol

ES5 的对象属性名都是字符串,这容易造成属性名的冲突。比如,你使用了一个他人提供的对象,但又想为这个对象添加新的方法(mixin 模式),新方法的名字就有可能与现有方法产生冲突。如果有一种机制,保证每个属性的名字都是独一无二的就好了,这样就从根本上防止属性名的冲突。这就是 ES6 引入Symbol的原因。(来自ECMAScript 6 入门-阮一峰)

总结:凡是属性名属于 Symbol 类型,就都是独一无二的,可以保证不会与其他属性名产生冲突。

实现

体现不可更改

const EnumSex = Object.freeze({
man: Symbol('男'),
woman: Symbol('女')
}) EnumSex.man = 1;
console.log(EnumSex.man); // Symbol(男)

体现值的唯一性

const EnumSex = Object.freeze({
man: Symbol('男'),
woman: Symbol('男')
}) console.log(EnumSex.man === EnumSex.woman); // false

需要注意的地方

开始实现体现值的唯一性的时候,看到man和woman都是Symbol('男'),感觉执行的时候应该会报错,结果没有报错,还有点怀疑Symbol的唯一性。最后一对比发现是不同的。

Symbol中的参数只是对Symbol的一个描述,为了我们好区分它。

js学习-es6实现枚举的更多相关文章

  1. 用vue.js学习es6(一):基本工具及配置

    一.工具: sublime,node.js,npm 1.安装sublime 的es6插件: (1).在sublime中按Ctrl+`调出console (2).粘贴以下代码到底部命令行并回车(subl ...

  2. 用vue.js学习es6(六):Iterator和for...of循环

    一.Iterator (遍历器)的概念: 遍历器(Iterator)就是这样一种机制.它是一种接口,为各种不同的数据结构提供统一的访问机制.任何数据结构只 要部署Iterator接口,就可以完成遍历操 ...

  3. 用vue.js学习es6(五):set和map的使用

    一:Set用法: ES6提供了新的数据结构Set.它类似于数组,但是成员的值都是唯一的,没有重复的值. (1).打印:console.log var data = new Set([1,2,3]); ...

  4. 用vue.js学习es6(四):Symbol类型

    一.Symbol类型: 1.ES6引入了一种新的原始数据类型Symbol,表示独一无二的值.它是JavaScript语言的第七种数据类型,前六种是:Undefined.Null. 布尔值(Boolea ...

  5. 用vue.js学习es6(二):let和const使用

    一.运行及关闭运行: 在上一节中我们用shift+右击在C:\vue\es6文件夹中打开命令行使用:npm run dev,打开了我们的vue界面. 如果要关闭则在命令行中按住ctrl+C则可以关闭. ...

  6. 用vue.js学习es6(三):数组、对象和函数的解构

    一.数组的解构: 以前的方式: var arr = [1,2,3]; console.log(arr[0]); //1 console.log(arr[1]); //2 现在的方式: var [a,b ...

  7. JS学习- ES6 async await使用

    async 函数是什么?一句话,它就是 Generator 函数的语法糖. 使用场景常常会遇到,请求完一个接口,拿完值再去请求另外一个接口,我们之前回调callback函数处理,如果很多的情况下,看起 ...

  8. vue.js 学习笔记3——TypeScript

    目录 vue.js 学习笔记3--TypeScript 工具 基础类型 数组 元组 枚举 字面量 接口 类类型 类类型要素 函数 函数参数 this对象和类型 重载 迭代器 Symbol.iterat ...

  9. Vue.js学习笔记(2)vue-router

    vue中vue-router的使用:

随机推荐

  1. CUDA C++编程手册(总论)

    CUDA C++编程手册(总论) CUDA C++ Programming Guide The programming guide to the CUDA model and interface. C ...

  2. 解决使用Git找不到.ssh文件夹的办法

    解决使用Git找不到.ssh文件夹的办法 首先生成git密钥 git config --global user.name "你的名字(最好是中文全名)" git config -- ...

  3. Java IO学习笔记六:NIO到多路复用

    作者:Grey 原文地址:Java IO学习笔记六:NIO到多路复用 虽然NIO性能上比BIO要好,参考:Java IO学习笔记五:BIO到NIO 但是NIO也有问题,NIO服务端的示例代码中往往会包 ...

  4. 【NX二次开发】获得屏幕矩阵并设置WCS为屏幕方向

    说明:获得屏幕矩阵并设置WCS为屏幕方向(Z朝向自己,X轴朝右,Y轴超上). 方法: 1 extern DllExport void ufusr(char *param, int *retcode, ...

  5. Java第二次博客作业

    Java第二次博客作业 时间过的很快啊,在不知不觉中这门课程的学习也就快要过去一半了,现在就来总结一下在这个第二个月的学习当中存在的问题以及得到的心得. 1.前言 第四次题目集和第五次题目集给我的感觉 ...

  6. v-for和v-if不能同时使用

    如果使用v-for遍历数据时,想筛选出URL不为空的项并进行渲染 <ul> <li v-for="(item,index) in list" v-if=" ...

  7. 惊艳面试官的 Cookie 介绍

    Cookie 是什么 Cookie 是用户浏览器保存在本地的一小块数据,它会在浏览器下次向同一服务器再发起请求时被携带并发送到服务器上. Cookie 主要用于以下三个方面: 会话状态管理(如用户登录 ...

  8. asp.net core配合vue实现后端验证码逻辑

    概述 网上的前端验证码逻辑总感觉不安全,验证码建议还是使用后端配合验证. 如果产品确定可以上网的话,就可以使用腾讯,百度等第三方验证,对接方便.但是产品可能内网部署,就必须自己写了. 本文章就是基于这 ...

  9. NOIP模拟测试「简单的区间·简单的玄学·简单的填数·简单的序列」

    简单的区间 $update$ 终于$AC$了 找到$(sum[r]+sum[l](sum表示以中间点为基准的sum)-mx)\%k==0$的点 注意这里$sum$表示是以$mid$为基准点,(即$su ...

  10. mapboxgl绘制3D线

    最近遇到个需求,使用mapboxgl绘制行政区划图层,要求把行政区划拔高做出立体效果,以便突出显示. 拿到这个需求后,感觉很简单呀,只需要用fill-extrusion方式绘制就可以啦,实现出来是这个 ...