首页 > 教程 >

解决JavaScript中数组排序sort不发生改变

2023-02-16教程围观

简介最近在做一个项目,Ajax从后台返回数据后,前端用js处理时,发现无论如何使用sort排序,最终要么是没改变,要么只改变最后一次的排序,折腾了很久,最后查了查资料才发现,js中区分浅拷贝和深拷贝。varprovinceConfirmedCount=data;varprovinceDeadCount=data;varprovinceCuredCount=data;provinceConfirmedC

  

解决 中数组排序sort不发生改变


最近在做一个项目,Ajax从后台返回数据后,前端用js处理时,发现无论如何使用sort 排序,最终要么是没改变,要么只改变最后一次的排序,折腾了很久,最后查了查资料才发现,js中区分浅拷贝和深拷贝。

var provinceConfirmedCount = data;var provinceDeadCount = data;var provinceCuredCount = data;provinceConfirmedCount.sort(sortBy(("provinceConfirmedCount")));provinceDeadCount.sort(sortBy(("provinceDeadCount")));provinceCuredCount.sort(sortBy(("provinceCuredCount")));console.log(provinceConfirmedCount); //不生效console.log(provinceDeadCount); //不生效console.log(provinceCuredCount); //生效 //比较
数组对象function sortBy(field) {    return function(a,b) {        return parseInt(b[field]) - parseInt(a[field]);    }}

浅拷贝、深拷贝与赋值

这三个的区别无法就是改变数据的时候,是如何改变,为了简单明了,用一张表最快理解:

是否指向同一对象第一层为基本数据类型原数据中包含子对象
赋值会使原数据一同改变会使原数据一同改变
浅拷贝不会使原数据一同改变会使原数据一同改变
深拷贝不会使原数据一同改变不会使原数据一同改变

解决方案

既然知道了原理,这里的需求是需要全部改变,所以我们可以采用JQuery中的extend方法来处理:

var provinceConfirmedCount = $.extend([], data);var provinceDeadCount = $.extend([], data);;var provinceCuredCount = $.extend([], data);; provinceConfirmedCount.sort(sortBy(("provinceConfirmedCount")));provinceDeadCount.sort(sortBy(("provinceDeadCount")));provinceCuredCount.sort(sortBy(("provinceCuredCount"))); console.log(provinceConfirmedCount);console.log(provinceDeadCount);console.log(provinceCuredCount);

语法:$.extend( target, [ 1], [ N] )其中,target为目标类型,这里我用的是数组[],还可以是{},可根据实际情况处理。 从后面的[ 1], [ N]我们可以知道,extend是可以将多个待处理对象合并成一个目标类型的对象。



下载链接:网站源码/小程序源码/网站模板下载

Tags: 解决 排序 数组 sort 发生