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 相关文章推荐
jQuery生成asp.net服务器控件的代码
Feb 04 Javascript
jQuery1.6 正式版发布并提供下载
May 05 Javascript
JavaScript高级程序设计(第3版)学习笔记8 js函数(中)
Oct 11 Javascript
js 实现菜单上下显示附效果图
Nov 21 Javascript
JavaScript数组方法总结分析
May 06 Javascript
详解webpack 如何集成第三方js库
Jun 29 Javascript
手挽手带你学React之React-router4.x的使用
Feb 14 Javascript
Layer组件多个iframe弹出层打开与关闭及参数传递的方法
Sep 25 Javascript
jQuery实现全选、反选和不选功能的方法详解
Dec 04 jQuery
js 闭包深入理解与实例分析
Mar 19 Javascript
javascript设计模式 ? 代理模式原理与用法实例分析
Apr 16 Javascript
vue 获取元素额外生成的data-v-xxx操作
Sep 09 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
精致的人儿就要挑杯子喝咖啡
2021/03/03 冲泡冲煮
thinkphp备份数据库的方法分享
2015/01/04 PHP
PHP中字符与字节的区别及字符串与字节转换示例
2016/10/15 PHP
PHP实现上传多图即时显示与即时删除的方法
2017/05/09 PHP
Firebug入门指南(Firefox浏览器)
2010/08/21 Javascript
仅IE支持clearAttributes/mergeAttributes方法使用介绍
2012/05/04 Javascript
ko knockoutjs动态属性绑定技巧应用
2012/11/14 Javascript
javascript和HTML5利用canvas构建猜牌游戏实现算法
2013/07/17 Javascript
当前页禁止复制粘贴截屏代码小集
2013/07/24 Javascript
扩展JS Date对象时间格式化功能的小例子
2013/12/02 Javascript
JavaScript对象的property属性详解
2014/04/01 Javascript
jquery比较简洁的软键盘特效实现方法
2015/03/19 Javascript
JavaScript中使用指数方法Math.exp()的简介
2015/06/15 Javascript
angularjs使用directive实现分页组件的示例
2017/02/07 Javascript
Vue-resource实现ajax请求和跨域请求示例
2017/02/23 Javascript
Javascript实现数组中的元素上下移动
2017/04/28 Javascript
三种Webpack打包方式(小结)
2018/09/19 Javascript
nvm、nrm、npm 安装和使用详解(小结)
2019/01/17 Javascript
jQuery实现为table表格动态添加或删除tr功能示例
2019/02/19 jQuery
js计时事件实现圆形时钟
2020/03/25 Javascript
vue中的计算属性和侦听属性
2020/11/06 Javascript
python创建线程示例
2014/05/06 Python
Python列表生成式与生成器操作示例
2018/08/01 Python
pandas read_excel()和to_excel()函数解析
2019/09/19 Python
pytorch模型预测结果与ndarray互转方式
2020/01/15 Python
Python实现井字棋小游戏
2020/03/09 Python
500行python代码实现飞机大战
2020/04/24 Python
Python操作dict时避免出现KeyError的几种解决方法
2020/09/20 Python
马来西亚领先的在线礼品店:Giftr
2018/08/23 全球购物
在浏览器端如何得到服务器端响应的XML数据
2012/11/24 面试题
自荐信格式写作方法有哪些呢
2013/11/20 职场文书
我们的节日清明节活动总结
2014/04/30 职场文书
诚信的演讲稿范文
2014/05/12 职场文书
乡镇党委书记第三阶段个人整改措施
2014/09/16 职场文书
社区挂职锻炼个人工作总结
2015/10/23 职场文书
Python Django框架介绍之模板标签及模板的继承
2021/05/27 Python