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


本文摘自PHP中文网,作者hzc,侵删。

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

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

    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方法来处理:

1

2

3

4

5

6

7

8

9

10

11

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, [object1], [objectN] )其中,target为目标类型,这里我用的是数组[],还可以是{},可根据实际情况处理。 从后面的[object1], [objectN]我们可以知道,extend是可以将多个待处理对象合并成一个目标类型的对象。

推荐教程:《JS教程》

以上就是解决JavaScript中数组排序sort不发生改变的详细内容,更多文章请关注木庄网络博客

相关阅读 >>

javascript数组遍历的6种方法比较

javascript怎么判断是否为对象

javascript语言有什么特点

如何创建一个javascript数组

html5之javascript多线程的详解

javascript怎么改页面文字

js如何使用索引访问数组对象中的元素

javascript字符串方法有哪些

javascript生成一次性密码(otp)

理解javascript中的closure(闭包)

更多相关阅读请进入《javascript》频道 >>




打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,您说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

分享从这里开始,精彩与您同在

评论

管理员已关闭评论功能...