JavaScript对JSON数组简单排序操作示例


Posted in Javascript onJanuary 31, 2019

本文实例讲述了JavaScript对JSON数组简单排序操作。分享给大家供大家参考,具体如下:

我们经常回使用到数据格式

var arr=[{num:1},{num:3},{num:2}]

如何根据数组里面的JSON数据的某个key进行排序

javascript有一个sort()方法,直接通过 arr.sort()进行排序,默认只对数组的值进行排序,然而以上的数组的值却是个JSON格式的。

我们在看看sort方法的定义:

定义和用法

sort() 方法用于对数组的元素进行排序。

语法

arrayObject.sort(sortby)

参数 描述
sortby 可选。规定排序顺序。必须是函数。

返回值

对数组的引用。请注意,数组在原数组上进行排序,不生成副本。

说明

如果调用该方法时没有使用参数,将按字母顺序对数组中的元素进行排序,说得更精确点,是按照字符编码的顺序进行排序。要实现这一点,首先应把数组的元素都转换成字符串(如有必要),以便进行比较。

如果想按照其他标准进行排序,就需要提供比较函数,该函数要比较两个值,然后返回一个用于说明这两个值的相对顺序的数字。比较函数应该具有两个参数 a 和 b,其返回值如下:

若 a 小于 b,在排序后的数组中 a 应该出现在 b 之前,则返回一个小于 0 的值。
若 a 等于 b,则返回 0。
若 a 大于 b,则返回一个大于 0 的值。

所以重点在于sortby这个参数的规则。根据以上的说明我们可以创建一个规则函数

var arr=[{num:1},{num:3},{num:2}]
function newSort(x,y)
{
return x.num-y.num;
}
console.log(arr.sort(newSort));//完成排序,如果JSON里面的不是数字,则需要在newSort里面做一下处理
//比如:如果num的值是_1而不是数字1 则 return x.state.substr(1,1)-y.state.substr(1,1);

这里使用在线HTML/CSS/JavaScript代码运行工具:http://tools.3water.com/code/HtmlJsRun测试上述代码,可得到如下运行结果:

JavaScript对JSON数组简单排序操作示例

Javascript 相关文章推荐
function foo的原型与prototype属性解惑
Nov 19 Javascript
javascript 设为首页与加入收藏兼容多浏览器代码
Jan 11 Javascript
从阶乘函数对比Javascript和C#的异同
May 31 Javascript
jQuery使用一个按钮控制图片的伸缩实现思路
Apr 19 Javascript
jquery简单图片切换显示效果实现方法
Jan 14 Javascript
js原型链与继承解析(初体验)
May 09 Javascript
AngularJS入门教程引导程序
Aug 18 Javascript
基于JavaScript实现添加到购物车效果附源码下载
Aug 22 Javascript
jQuery实现简单的滑动导航代码(移动端)
May 22 jQuery
vue实现nav导航栏的方法
Dec 13 Javascript
jQuery+datatables插件实现ajax加载数据与增删改查功能示例
Apr 17 jQuery
js实现input密码框显示/隐藏功能
Sep 10 Javascript
实例讲解v-if和v-show的区别
Jan 31 #Javascript
详解使用angular框架离线你的应用(pwa指南)
Jan 31 #Javascript
Angular PWA使用的Demo示例
Jan 31 #Javascript
vue.js指令v-for使用以及下标索引的获取
Jan 31 #Javascript
微信小程序开发的基本流程步骤
Jan 31 #Javascript
JSON的parse()方法介绍
Jan 31 #Javascript
JSON.stringify()方法讲解
Jan 31 #Javascript
You might like
php中实现简单的ACL 完结篇
2011/09/07 PHP
php页面消耗内存过大的处理办法
2013/03/18 PHP
php获取字段名示例分享
2014/03/03 PHP
php字符串替换函数substr_replace()用法实例
2015/03/17 PHP
详解PHP 二维数组排序保持键名不变
2019/03/06 PHP
Javascript 实用小技巧
2010/04/07 Javascript
IE8提示Invalid procedure call or argument 异常的解决方法
2012/09/30 Javascript
ie9 提示'console' 未定义问题的解决方法
2014/03/20 Javascript
jQuery地图map悬停显示省市代码分享
2015/08/20 Javascript
js+css简单实现网页换肤效果
2015/12/29 Javascript
jquery弹出遮掩层效果【附实例代码】
2016/04/28 Javascript
node.js操作mongodb简单示例分享
2017/05/25 Javascript
用js实现每隔一秒刷新时间的实例(含年月日时分秒)
2017/10/25 Javascript
jQuery Validate插件ajax方式验证输入值的实例
2017/12/21 jQuery
php 解压zip压缩包内容到指定目录的实例
2018/01/23 Javascript
使用selenium抓取淘宝的商品信息实例
2018/02/06 Javascript
详解开发react应用最好用的脚手架 create-react-app
2018/04/24 Javascript
layer扩展打开/关闭动画的方法
2019/09/23 Javascript
[01:48]帕吉至宝加入游戏,遗迹战场现“千劫神屠”
2018/04/07 DOTA
Python os模块中的isfile()和isdir()函数均返回false问题解决方法
2015/02/04 Python
Python的re模块正则表达式操作
2016/05/25 Python
python3实现带多张图片、附件的邮件发送
2019/08/10 Python
Python 之 Json序列化嵌套类方式
2020/02/27 Python
实例讲解HTML5的meta标签的一些应用
2015/12/08 HTML / CSS
捷克街头、运动和滑板一站式商店:BoardStar.cz
2019/10/06 全球购物
Feelunique中文官网:欧洲最大化妆品零售电商
2020/07/10 全球购物
大学生专科毕业生自我评价
2013/11/17 职场文书
大学生表扬信范文
2014/01/09 职场文书
环保专业大学生职业规划设计
2014/01/10 职场文书
销售员求职个人的自我评价
2014/02/19 职场文书
护理专业学生职业生涯规划范文
2014/03/11 职场文书
机械工程师岗位职责
2014/06/16 职场文书
经典格言警句:没有热忱,世间便无进步
2019/11/13 职场文书
总结Python使用过程中的bug
2021/06/18 Python
浅谈Python协程asyncio
2021/06/20 Python
解决redis批量删除key值的问题
2022/03/23 Redis