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 相关文章推荐
Javascript面向对象设计一 工厂模式
Dec 20 Javascript
自定义jQuery选项卡插件实例
Mar 27 Javascript
node+express+ejs制作简单页面上手指南
Nov 26 Javascript
jQuery插件FusionCharts绘制的3D饼状图效果实例【附demo源码下载】
Mar 03 Javascript
vue中用动态组件实现选项卡切换效果
Mar 25 Javascript
jQuery Form插件使用详解_动力节点Java学院整理
Jul 17 jQuery
基于Bootstrap的标签页组件及bootstrap-tab使用说明
Jul 25 Javascript
Vue 去除路径中的#号
Apr 19 Javascript
Vue.js 实现微信公众号菜单编辑器功能(二)
May 08 Javascript
JS实现图片旋转动画效果封装与使用示例
Jul 09 Javascript
后台使用freeMarker和前端使用vue的方法及遇到的问题
Jun 13 Javascript
vue组件讲解(is属性的用法)模板标签替换操作
Sep 04 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
通过curl模拟post和get方式提交的表单类
2014/04/23 PHP
PHP实现事件机制实例分析
2015/06/26 PHP
PHP使用Curl实现模拟登录及抓取数据功能示例
2018/04/27 PHP
php实现单笔转账到支付宝功能
2018/10/09 PHP
js网页侧边随页面滚动广告效果实现
2011/04/14 Javascript
JavaScript数据类型检测代码分享
2015/01/26 Javascript
Javascript中的包装类型介绍
2015/04/02 Javascript
jQuery构造函数init参数分析续
2015/05/13 Javascript
JS实现统计复选框选中个数并提示确定与取消的方法
2015/07/01 Javascript
JavaScript拖拽、碰撞、重力及弹性运动实例分析
2016/01/08 Javascript
React数据传递之组件内部通信的方法
2017/12/31 Javascript
详解使用VUE搭建后台管理系统(vue-cli更新至3.0)
2018/08/22 Javascript
this在vue和小程序中的使用详解
2019/01/28 Javascript
灵活使用console让js调试更简单的方法步骤
2019/04/23 Javascript
JavaScript的Proxy可以做哪些有意思的事儿
2019/06/15 Javascript
浅谈Vue SSR中的Bundle的具有使用
2019/11/21 Javascript
原生js实现密码强度验证功能
2020/03/18 Javascript
JS实现点击掉落特效
2021/01/29 Javascript
[01:25]2015国际邀请赛最佳短片奖——斧王《拆塔英雄:天赋异禀》
2015/09/22 DOTA
[52:06]完美世界DOTA2联赛决赛日 Inki vs LBZS 第一场 11.08
2020/11/10 DOTA
解决python写的windows服务不能启动的问题
2014/04/15 Python
对python 多个分隔符split 的实例详解
2018/12/20 Python
PyQt5内嵌浏览器注入JavaScript脚本实现自动化操作的代码实例
2019/02/13 Python
台湾SHOPRO购物行家:亚洲首创影视.3C.家电.优质购物平台
2018/05/07 全球购物
意大利奢侈品多品牌集合店:TheDoubleF
2019/08/24 全球购物
C#中的验证控件有几种
2014/03/08 面试题
党员年终民主评议的自我评价
2013/11/05 职场文书
安全生产先进个人材料
2014/02/06 职场文书
大学生全国两会报告感想
2014/03/17 职场文书
六年级学生评语
2014/04/22 职场文书
上课随便讲话检讨书
2014/09/12 职场文书
医生学习党的群众路线教育实践活动心得体会
2014/11/03 职场文书
领导新年致辞2016
2015/07/29 职场文书
家庭教育培训学习心得体会
2016/01/14 职场文书
小学五年级(说明文3篇)
2019/08/13 职场文书
Django项目配置Memcached和Redis, 缓存选择哪个更有优势
2021/04/06 Python