记录一个效仿VUE检查是否为html标签的高性能的方法

Zachary_zlc

于 2021-01-06 16:23:40 发布

阅读量250

点赞数 1

分类专栏：前端-框架源码解析前端-js高级及算法提升

申请开通js

本文链接：https://blog.csdn.net/MrZachary_zlc/article/details/112279621

版权

前端-框架源码解析同时被 2 个专栏收录

5 篇文章 0 订阅

订阅专栏

前端-js高级及算法提升

1 篇文章 0 订阅

订阅专栏

假如，你需要检测一批标签是否为html标签，可以这样：

 let tags = "div,p,a,img,ul,li,i,br".split(","); // 限定范围
 function makeMap(tag) { // 检测方法
   let map = new Map();
   tags.forEach((item) => (map[item] = true));
   return function (tagName) {
     return !!map[tagName.toLowerCase()]
   };
 }
 let isHtmlTag = makeMap( tags )
 isHtmlTag( 'div' )

分析：该方法应用到了js的函数柯里化概念（js的函数柯里化：简单理解就是把一个接受多参数的函数写成只接受一个原函数第一个参数，且返回一个接受剩余参数的新函数的玩法）
好处：此处如果使用常规的方式进行检测，检测量很大时，会很消耗性能，此种方式在检测量较大时，也只是进行一次迭代操作，并被闭包缓存下来，极大的提高性能的利用率；
当然此方法不只限于检测标签，还可以进行拓展，比如检测svg等等，可以进行自由发挥。