"any application that can be written in JavaScript, will eventually be written in JavaScript" -- by Jeff Atwood
事情的起因是这样的，业务中有一个详情比价页面，需要爬虫抓取数据传给前端展示给用户，因为爬虫抓取数据是需要一定的时间的，以往的作法是做ajax的简单的长轮询，每隔2秒就请求一次
后台JAVA的接口，请求6次，最终显示的是第六次的结果。JAVA后台负责接收前端请求，推动python后台爬虫，接收爬虫数据并排序整理，返回给前端接口。此方案效果非常不好，用时久，数据可靠性低
等问题一直阴魂不散。所以才有了这次的推送改版。这次推送改版的方案主要改动是不用ajax进行请求了，新增了一个MQTT通讯服务器。（MQTT简介https://github.com/mcxiaoke/mqtt），前端和爬虫通过MQTT服务器进行通讯，前端做数的排序
整理。我认为对于前端来说本质上是使用webSocket进行了通讯，只不过是套上了MQTT的外衣。对于前端来说，需要做简单的数据处理，例如排序，查重等，非常好！
①背景介绍完毕，前端用什么进行排序或者说查重呢？当然是Js啦（☺），先说去重吧，去重我是跟后台JAVA的哥们聊天得到的启发，要用到es6的Set集合,具体方法如下：
//array表示需要去重的原数组，param表示去重的依据是数组中的一项的属性，info表示需要对比的属性
findSameInfo(array,param,info){
let _this = this
let result = true
let checkSet = new Set()
array.map((item)=>{
checkSet.add(item[param])
})
let oldLen = checkSet.size
checkSet.add(info[param])
let newLen = checkSet.size
if(oldLen == newLen){//说明加入set中集合有重复的数据源，所以size没变,数据重复
result = false
}
return result
},
使用方法如下：
假设要对比名字，价格，id,完全相同则为重复数据
let checkName = this.findSameInfo(checkArray,'name',info)
let checkPrice = this.findSameInfo(checkArray,'price',info)
let checkId = this.findSameInfo(checkArray,'id',info)
if(!checkName && !checkPrice && !checkId){
//数据重复,不执行下面的操作
return
}
checkArray.push(info)
②排序的方法网上有挺多，我就不多哔哔了，排序用的是改良版的冒泡排序，具体方法如下：
(算法文章推荐https://juejin.im/post/57dcd394a22b9d00610c5ec8，我只会冒泡和选择排序，所有选了个喜欢的)
//冒泡排序算法
//方法需要传入2个参数，第一个参数是需要排序的数组，第二个参数是排序的依据是数组中的一项的属性
arrayBubbleSort(array,param){
if(Object.prototype.toString.call(array).slice(8,-1) !== 'Array'){//若array不是数组则不执行之后的操作
return
}
//原始冒泡排序
// for (let j = 0; j < array.length - 1; j++) {
// // 这里要根据外层for循环的 j，逐渐减少内层 for循环的次数
// for (let i = 0; i < array.length - 1 - j; i++) {
// if (array[i][param] > array[i + 1][param]) {
// let temp = array[i];
// array[i] = array[i + 1];
// array[i + 1] = temp;
// }
// }
// }
//改进冒泡排序
console.time(`冒泡排序耗时`)
let i = array.length - 1//初始化
let temp = null
while(i>0){
let pos = 0 //记录位置，记录位置之后的数据不需要交换位置
for(let j =0;j<i;j++){
if(array[j][param] && array[j+1][param] && (array[j][param] > array[j+1][param])||array[j][param] == 0 || array[j][param] == '' || array[j][param] == null || array[j][param] == 'null'){
pos = j //记录交换位置
temp = array[j]
array[j] = array[j+1]
array[j+1] = temp
}
}
i = pos //下一次排序更新位置
}
console.timeEnd(`冒泡排序耗时`)
return array
}