（vue项目）巧用ES6中的数据类型Map

Posted 2023-03-23

参考技术A

表单添加项的某个选择器的选项,大致是这个格式，而且是可维护的，是从后端请求并返回的：

表单列表的显示是要显示label，如下:

页面展示的内容
第1行：品种名称1，设施
第2行：品种名称2，大田

这个时候也不方便用filter，因为选项是异步获取的

这样option1就是我们最后处理完的数据

页面上（此处ui框架是element）：

Map是一组键值对的结构，具有 极快 的查找速度。

JS中的数据类型，包含ES6,set和map等等

ES6中一共12个数据类型，分为两类，每类6个
基本数据类型 -> 栈 （6个）
string number（NaN） boolean null undefined Symbol(es6)

引用数据类型 -> 堆（1个）
object(array function Set(es6) Map(es6))

1.其中，新增的两个，set，map都是构造函数，需要new，才能使用
2.symbol不支持new方法

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Symbol
symbol 是一种基本数据类型 （primitive data type）。Symbol()函数会返回symbol类型的值，该类型具有静态属性和静态方法。它的静态属性会暴露几个内建的成员对象；它的静态方法会暴露全局的symbol注册，且类似于内建对象类，但作为构造函数来说它并不完整，因为它不支持语法："new Symbol()"。

每个从Symbol()返回的symbol值都是唯一的。一个symbol值能作为对象属性的标识符；这是该数据类型仅有的目的。更进一步的解析见—— glossary entry for Symbol。

另外要的说一些事,网上很多种数据类型的说法，建议使用typeof，toString来检测，也可以使用instanceOf来检测，实例关系

基本数据类型：String,boolean,Number,Symbol（ES6新增）,Undefined, Null
引用数据类型：Object
基本数据类型中有两个为特殊数据类型： null, undefined
js的常见内置对象：Date,Array,Math,Number,Boolean,String,Array,RegExp,Function...