html阅读统计,前端面试题-1如何统计当前Html页面使用最多的前3个标签

let tagLists = document.getElementsByTagName("*") ;

let nodeNameList = [...tagLists].map(v=>v.nodeName);

let sumList = nodeNameList.reduce((obj,key)=>{

obj[key] = (obj[key] || 0) + 1;

return obj;

},{});//sumList 是一个对象

arrayList = Object.entries(sumList);//对象转换key 和 value 二维数组，

arrayList.sort((prev,next)=>{

return next[1] - prev[1] ;

});

top3List = arrayList.slice(0,3);

console.log(top3List);

1.使用document.getElementsByTagName("*") 获取所有nodeList

2.[...nodeList] 转换真正数组

3.map(v=>v.nodeName)获取关键的nodeName 信息的数组

4.使用reduce 统计

[].reduce((obj,key)=>{

obj[key] = (obj[key] || 0) + 1;

return obj;

//这里 如果 || 为undefined 则 第一次obj[key] = 0 ，然后再+1。

//否则每次都是 obj[key] = obj[key] + 1;

},{}); //初始参数{}很重要

5.arrayList = Object.entries(sumList);//对象转换key 和 value 二维数组，

6.使用[].sort((prev,next)=>{

return prev[1] > next[1]

})

7.使用[].slice(0,3) ;//只显示 前三条