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 相关文章推荐
Ajax::prototype 源码解读
Jan 22 Javascript
javascript 操作文件 实现方法小结
Jul 02 Javascript
一个简单的jQuery插件制作 学习过程及实例
Apr 25 Javascript
JQuery为textarea添加maxlength属性并且兼容IE
Apr 25 Javascript
jQuery插件实现表格隔行换色且感应鼠标高亮行变色
Sep 22 Javascript
JavaScript中操作字符串之localeCompare()方法的使用
Jun 06 Javascript
JS实现获取键盘按下的按键并显示在页面上的方法
Nov 04 Javascript
jQuery解决浏览器兼容性问题案例分析
Apr 15 Javascript
两种JavaScript的AES加密方式(可与Java相互加解密)
Aug 02 Javascript
Vue input控件通过value绑定动态属性及修饰符的方法
May 03 Javascript
JS代码实现电脑配置检测功能
Mar 21 Javascript
jQuery AJAX 方法success()后台传来的4种数据详解
Aug 08 jQuery
了解在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函数addslashes和mysql_real_escape_string的区别
2014/04/22 PHP
微信API接口大全
2015/04/15 PHP
PHP模板引擎smarty详细介绍
2015/05/26 PHP
PHP中类的自动加载的方法
2017/03/17 PHP
PHP实现本地图片转base64格式并上传
2020/05/29 PHP
学习YUI.Ext 第七天--关于View&amp;JSONView
2007/03/10 Javascript
两个比较有用的Javascript工具函数代码
2010/02/17 Javascript
一个js拖拽的效果类和dom-drag.js浅析
2010/07/17 Javascript
html的DOM中document对象anchors集合用法实例
2015/01/21 Javascript
jQuery使用toggleClass方法动态添加删除Class样式的方法
2015/03/26 Javascript
全面接触神奇的Bootstrap导航条实战篇
2016/08/01 Javascript
Vue2.0实现购物车功能
2017/06/05 Javascript
使用vs code开发Nodejs程序的使用方法
2017/09/21 NodeJs
vue-lazyload图片延迟加载插件的实例讲解
2018/02/09 Javascript
深入理解Vue父子组件生命周期执行顺序及钩子函数
2018/08/12 Javascript
vue2.0 可折叠列表 v-for循环展示的实例
2018/09/07 Javascript
JS无限级导航菜单实现方法
2019/01/05 Javascript
layui table 表格模板按钮的实例代码
2019/09/21 Javascript
[58:09]Spirit vs NB Supermajor小组赛 A组败者组决赛 BO3 第三场 6.2
2018/06/03 DOTA
使用Python脚本对Linux服务器进行监控的教程
2015/04/02 Python
Python中尝试多线程编程的一个简明例子
2015/04/07 Python
Python面向对象编程基础解析(一)
2017/10/26 Python
Python查找最长不包含重复字符的子字符串算法示例
2019/02/13 Python
基于python-opencv3的图像显示和保存操作
2019/06/27 Python
Python zip函数打包元素实例解析
2019/12/11 Python
mac使用python识别图形验证码功能
2020/01/10 Python
全球度假村:Club Med
2017/11/27 全球购物
数据库方面面试题
2012/04/22 面试题
swtich是否能作用在byte上,是否能作用在long上,是否能作用在String上
2013/07/06 面试题
寒假思想汇报
2014/01/10 职场文书
科技开发中心办公室主任岗位责任制
2014/02/10 职场文书
演讲比赛的活动方案
2014/08/28 职场文书
2014年售后服务工作总结
2014/11/18 职场文书
2014年仓管员工作总结
2014/11/18 职场文书
农村婚礼司仪主持词
2015/06/29 职场文书
2015年大学生暑期实习报告
2015/07/13 职场文书