JS根据json数组多个字段排序及json数组常用操作


Posted in Javascript onJune 06, 2019

js 根据json数组多个字段排序的实现代码如下所示:

/**数组根据数组对象中的某个属性值进行排序的方法 
  * 使用例子:newArray.sort(sortByArr(['number'],false)) //表示根据number属性降序排列;若第二个参数不传递,默认表示升序排序
  * @param attr 排序的属性 ['name','sex'...],根据一个字段或者多个字段排序
  * @param rev true表示升序排列,false降序排序
  * */

function sortByArr(arr, rev) {
 if (rev == undefined) {
 rev = 1;
 } else {
 rev = (rev) ? 1 : -1;
 }
 return function(a, b) {
 for (var i = 0; i < arr.length; i++) {
 let attr = arr[i]
 if (a[attr] != b[attr]) {
 if (a[attr] > b[attr]) {
 return rev * 1;
 } else {
 return rev * -1;
 }
 }
 }
}
}

PS:Js 中对 Json 数组的常用操作

我们首先定义一个json数组对象如下:

var persons = [
  {name: "tina", age: 14},
  {name: "timo", age: 15},
  {name: "lily", age: 16},
  {name: "lucy", age: 16}
]

一. 根据对象属性值得到相应对象

//1. 获取 name 等于 lily 的对象
var lily = persons.filter((p) => {
  return p.name == "lily";
});
console.log(lily); //打印结果 [{name: "lily", age: 16}]
//注:filter()方法返回的是一个数组
var twins = persons.filter((p) => {
  return p.age == 16;
});
console.log(twins); //打印结果 [{name: "lily", age: 16},{name: "lucy", age: 16}]

二. 删除其中一个对象

//删除 name 等于 tina 的对象,利用splice()方法
//1. 首先我们要得到这个对象
var tina = persons.filter((p) => {
  return p.name == "tina";
});
//2. 其次得到这个对象在数组中对应的索引
var index = persons.indexOf(tina[0]);
//3. 如果存在则将其删除,index > -1 代表存在
index > -1 && persons.splice(index, 1);
console.log(persons);
//打印结果 [{name: "timo", age: 15}, {name: "lily", age: 16}, {name: "lucy", age: 16}]

三. 修改其中一个对象的属性值

//将 name 等于 timo 的 age 修改为 20
//1. 得到 timo 对象
var timo = persons.filter((p) => {
  return p.name == "timo";
});
//2. 修改age
timo[0].age = 20;

四. 往数组中添加一个对象

//这个最简单了
persons.push({name: "similar", age: 18});

 ——注: 以上的所有操作都会对原数组产生直接影响。

总结

以上所述是小编给大家介绍的JS根据json数组多个字段排序及json数组常用操作,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!
如果你觉得本文对你有帮助,欢迎转载,烦请注明出处,谢谢!

Javascript 相关文章推荐
JQuery下拉框应用示例介绍
Apr 23 Javascript
Javascript this 关键字 详解
Oct 22 Javascript
js实现图片漂浮效果的方法
Mar 02 Javascript
AngularJS实现textarea记录只能输入规定数量的字符并显示
Apr 26 Javascript
第八篇Bootstrap下拉菜单实例代码
Jun 21 Javascript
JavaScript学习笔记整理_简单实现枚举类型,扑克牌应用
Sep 19 Javascript
js select下拉联动 更具级联性!
Apr 17 Javascript
vue-cli项目中怎么使用mock数据
Sep 27 Javascript
EasyUI Tree树组件无限循环的解决方法
Sep 27 Javascript
详解webpack性能优化——DLL
Oct 20 Javascript
vue根据值给予不同class的实例
Sep 29 Javascript
Vue实现剪贴板复制功能
Dec 31 Javascript
了解在JavaScript中将值转换为字符串的5种方法
Jun 06 #Javascript
Vue项目总结之webpack常规打包优化方案
Jun 06 #Javascript
vue-cli脚手架打包静态资源请求出错的原因与解决
Jun 06 #Javascript
详解vue-cli@2.x项目迁移日志
Jun 06 #Javascript
详解新手使用vue-router传参时注意事项
Jun 06 #Javascript
vue-cli配置全局sass、less变量的方法
Jun 06 #Javascript
解决vue组件props传值对象获取不到的问题
Jun 06 #Javascript
You might like
解析php中的escape函数
2013/06/29 PHP
php实现过滤表单提交中html标签的方法
2014/10/17 PHP
php cookie名使用点号(句号)会被转换
2014/10/23 PHP
PHP处理数组和XML之间的互相转换
2016/06/02 PHP
『jQuery』取指定url格式及分割函数应用
2013/04/22 Javascript
js日期联动示例
2014/05/02 Javascript
微信小程序http连接访问解决方案的示例
2018/11/05 Javascript
vue实现的双向数据绑定操作示例
2018/12/04 Javascript
详释JavaScript执行环境与执行栈
2019/04/02 Javascript
小程序调用微信支付的方法
2019/09/26 Javascript
webpack DllPlugin xxx is not defined解决办法
2019/12/13 Javascript
Laravel 如何在blade文件中使用Vue组件的示例代码
2020/06/28 Javascript
对Python进行数据分析_关于Package的安装问题
2017/05/22 Python
Python numpy 点数组去重的实例
2018/04/18 Python
python opencv实现图片旋转矩形分割
2018/07/26 Python
python定时按日期备份MySQL数据并压缩
2019/04/19 Python
pyqt5 从本地选择图片 并显示在label上的实例
2019/06/13 Python
Python序列对象与String类型内置方法详解
2019/10/22 Python
基于python中__add__函数的用法
2019/11/25 Python
python3中numpy函数tile的用法详解
2019/12/04 Python
Python计算公交发车时间的完整代码
2020/02/12 Python
基于打开pycharm有带图片md文件卡死问题的解决
2020/04/24 Python
Keras:Unet网络实现多类语义分割方式
2020/06/11 Python
Python就将所有的英文单词首字母变成大写
2021/02/12 Python
html5 利用canvas实现超级玛丽简单动画
2013/09/06 HTML / CSS
水上运动奥特莱斯:Wasterports Outlet
2018/08/08 全球购物
Etam俄罗斯:法国女士内衣和家居服网上商店
2019/10/30 全球购物
物理系毕业生自荐书范文
2014/02/22 职场文书
大学学习计划书范文
2014/05/02 职场文书
财务科长个人对照检查材料
2014/09/18 职场文书
大学生自荐信范文
2015/03/05 职场文书
优秀班干部主要事迹材料
2015/11/04 职场文书
2016国庆促销广告语
2016/01/28 职场文书
2019暑假阅读倡议书
2019/06/24 职场文书
Vue3.0写自定义指令的简单步骤记录
2021/06/27 Vue.js
Python游戏开发实例之graphics实现AI五子棋
2021/11/01 Python