JS 中把对象按属性名字母顺序进行排序和倒序

2023-10-29

本文同步发布在:JS 中把对象按属性名字母顺序进行排序和倒序

我们在进行前端开发的时候,有时需要对参数进行签名,签名很多第一步是把对象按属性名字母顺序进行排序,那么在 JS 中如何实现呢?实现方式很多,这边介绍一种通过 ES6 的方式来实现,具体如下:

const data = { // 要排序的原始对象
    name: '张三',
    age: 18,
    sex: '男',
    height: '189cm',
    weight: '80kg',
    hobby: ['跑步', '篮球', '钓鱼']
}

const sortData = { } // 排序后的对象
Object.keys(data).sort().map(key => {
    sortData[key] = data[key]
})
console.info(JSON.stringify(sortData)) // => {"age":18,"height":"189cm","hobby":["跑步","篮球","钓鱼"],"name":"张三","sex":"男","weight":"80kg"}

const reverseData = { } // 倒序后的对象
Object.keys(data).sort().reverse().map(key => {
    reverseData[key] = data[key]
})
console.info(JSON.stringify(reverseData)) // => {"weight":"80kg","sex":"男","name":"张三","hobby":["跑步","篮球","钓鱼"],"height":"189cm","age":18}

主要用到的知识点

  • array.sort(sortby):用于对数组的元素进行排序。
  • array.reverse():用于颠倒数组中元素的顺序。
  • array.map(function(currentValue, index, arr), thisValue):用于遍历数组调用函数进行处理。

具体大家可以自行百度其详细用法,这边不做展开。

本文同步发布在:JS 中把对象按属性名字母顺序进行排序和倒序

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

JS 中把对象按属性名字母顺序进行排序和倒序 的相关文章

  • ReactTable 修复了最后一行

    我正在使用 ReactTable 最后我需要创建一些摘要 当分页存在时 它每次都应该可见 可以用react table来实现吗 我可以通过创建下一个表来部分解决这个问题 但我没有找到如何隐藏标题的方法 另一个问题是调整列宽度时 它不会应用于
  • javascript中怪异模式的元素宽度?

    我一直在浏览所有流行的 js 库 但我找不到一个具有 DOM 元素宽度函数的库 该函数实际上可以解释 Internet Explorer 中的怪异模式 问题是 当启用怪异模式时 填充和边框不会计入宽度 据我所知 当省略 doctype 或将
  • 未捕获的类型错误:无法读取未定义的属性“toLowerCase”

    我收到此错误 它源自 jquery 框架 当我尝试加载准备好的文档上的选择列表时 出现此错误 我似乎无法找到为什么会出现此错误 它适用于更改事件 但在尝试手动执行该函数时出现错误 未捕获的类型错误 无法读取未定义的属性 toLowerCas
  • 匹配数组中的对象并合并

    UPDATE 我有一个名为的对象数组cars包含 li 标签 其中包含有关汽车的属性数据 例如价格 汽车类型等 我的目标是 如果这些汽车符合某些标准 则将它们合并到一个列表中 要求 快速性能 保持相同的汽车数组结构 Main Goal Ma
  • Angular.js:未捕获的错误,没有模块:myapp

    我也在尝试引导 angular js 项目 这是我的index html div p Loading p div
  • React 不响应按键事件

    我正在尝试实现一些非常基本的按键检测 但我根本无法让它工作 我有一个裸露的组件 应该在onKeyDown事件 但控制台中没有任何内容被注销 class App extends React Component constructor prop
  • React JS - 单击时更改颜色并将默认颜色放在所有其他颜色上

    我有 x 个渲染数文章预览依赖于 API 调用的组件 div div Object keys images map index i gt return div div
  • JavaScript 中的正则表达式用于验证十进制数字

    我想要 JavaScript 中的正则表达式来验证十进制数字 它最多只允许两位小数 例如 它应该允许10 89但不是10 899 它还应该只允许一个句点 例如 它应该允许10 89但不是10 8 9 尝试使用以下表达式 d d 0 2 如果
  • 在每页上插入折叠标记 (wkhtmltopdf)

    我正在使用 wkhtmltopdf 0 12 2 1 创建发票等 我需要在 pdf 的每一页上显示折叠标记 如果内容大于一页 如何在每个页面上使用 javascript 重复它们 这是我的基本标记 div class marks div c
  • Child_process 处理带有回车符 (\r) 的 STDOUT 流

    我正在编写一个简单的应用程序 它允许工作中的内部系统请求从远程服务器到使用 REST 调用发起的另一个远程服务器的复制过程 使用 rsync 我已经对express框架足够熟悉 并且刚刚开始尝试child process库 并偶然发现了一个
  • 如何获取传单标记簇中点击事件的图块?

    这是我的代码 function onMapClick e e originalEvent defaultPrevented true var orig e originalEvent console log orig target map
  • Office excel将CORS请求作为跨域请求

    我正在尝试从我的 Excel 插件发出跨域请求 正如这里所建议的 http dev office com docs add ins develop addressing same origin policy limitations http
  • 使用 jquery 通配符检查 cookie 名称

    我有一个生成动态 cookie 的表单 例如 webform 62 1234356 62 1234356 可以是任意数字 我需要使用一些通配符检查来检查名称以 webform 开头的 cookie 是否存在 下面不起作用 if cookie
  • mouseover 和 mouseout 事件在子进程上触发

    代码 div div div div 如果我将鼠标悬停在Navigation the Drop Downdiv 向下滑动 如果我将鼠标移开 它会向上滑动 问题是如果我将鼠标悬停在孩子上Drop Downdiv它也向上滑 动 有谁知道我该如何
  • express 或express-generator:我需要两者吗?

    只是探索 Node js 并遇到了 Express 在 npm 存储库站点上https www npmjs com package express https www npmjs com package express它明确指出安装是 np
  • Sequelize.js - “不关联到”

    我在从数据库获取完整数据时遇到一些问题 那是我的模型 User module exports function sequelize DataTypes return sequelize define user id type DataTyp
  • Javascript 中的线性回归 [关闭]

    Closed 这个问题正在寻求书籍 工具 软件库等的推荐 不满足堆栈溢出指南 help closed questions 目前不接受答案 我想在网络浏览器中用 Javascript 进行最小二乘拟合 目前 用户使用 HTML 文本输入输入数
  • 如何检查 Map 或 Set 是否为空?

    对于 JavaScript 中的传统对象 使用以下命令很容易检查它是否为空 Object keys method const emptyObj console log Object keys emptyObj length 0 true i
  • 使用本机 JavaScript 获取过渡中的 CSS 值

    这个问题之前被问过 但答案使用了 jQuery here https stackoverflow com q 8920934 3186555 因此 我将调整问题以专门询问native解决方案 to 最小化依赖关系 假设您有一个 div 然后
  • 允许使用 grunt browserify 进行全局转换

    我已将 jQuery 添加为 html 文件中的脚本标记 并将其添加到package json与一起工作browserify shim如下 browserify transform browserify shim browserify sh

随机推荐

  • [每日两题系列]刷算法题咯~~

    今日题目 判定是否互为字符重排 最后一块石头的重量 本系列所选题目均来自力扣或者牛客网站 所选题目主要是以其中的简单题为主 中等题为辅 包含少数困难题 原因是 本人目前能力还不够 开展这个系列的目的是督促自己 在暑假的时间里也要保持有一定的
  • #define用法总结

    刚开始接触VC 的同学们 估计对这个东西有这莫大的恐惧 这个经常写在添加头文件的地方的奇怪语句 如果看过mfc那么 那么拿出一些application framework里面的宏 估计会吓死一片 说了这么多只是想说 不明白其用法的人很害怕
  • 经典法谱估计(1)周期图法MATLAB及Python实现

    原理 对于一个无限长序列x n 其傅里叶变换DTFT 也可称作离散时间傅里叶变换 及其反变换的定义式为 但是在我们的分析处理过程中 只能分析处理离散化的信号 也即N点取样 对于一个长度为N的有限长序列x n 其离散傅里叶变换及其反变换的定义
  • osgEarth的Rex引擎原理分析(一二一)osgEarth::TileRasterizer功能详解

    目标 五十二 中的问题123 本质是一个相机 用于将下面的节点渲染到纹理中 src osgEarth TileRasterizer class OSGEARTH EXPORT TileRasterizer public osg Camera
  • 神经网络面试题-1

    文章目录 1 批规范化 Batch Normalization 的好处都有啥 2 如果我们用了一个过大的学习速率会发生什么 3 下图所示的网络用于训练识别字符H和T 如下所示 4 增加卷积核的大小对于改进卷积神经网络的效果是必要的吗 5 假
  • maven跳过单元测试-maven.test.skip和skipTests的区别

    原文链接 http blog csdn net arkblue article details 50974957 DskipTests 不执行测试用例 但编译测试用例类生成相应的class文件至target test classes下 Dm
  • 【Linux C小技巧】零长度数组的使用

    本期主题 讲清Linux C的零长度数组使用 内容包括 零长度数组是什么原理 为什么要使用零长度数组 与指针的差异 往期链接 数据结构系列 先进先出队列queue 数据结构系列 栈 stack Linux内核链表 目录 0 前言 1 零长度
  • git上传代码到github

    来源 我是码农 转载请保留出处和链接 本文链接 http www 54manong com id 1219 一 首先在windows上安装msysgit 1 msysgit下载地址如下 链接 https pan baidu com s 1T
  • 小米红米手机刷入Recovery手机教程-TWRP下载-获取root权限-新增小米12/13Pro适配

    刷机注意 本教程为小米全机型 目前已整理机型都可以使用 请确保你的电脑能正确连接你的手机 部分手机需要解锁BL 小米解锁BL教程 http www romleyuan com lec read id 83 更新日志 20230221更新日志
  • 【atoi函数的介绍以及模拟实现】

    目录 前言 一 atoi函数测试 1 要求 2 测试 二 atoi函数模拟实现 三 补充 前言 位置 atoi函数包含在
  • 天地图服务与开发

    天地图服务与开发 天地图在线地图网址 2021年7月2日 国家地理信息公共服务平台天地图2021版正式启用 传统版地址 https map tianditu gov cn 2020 新版地址 https map tianditu gov c
  • ssh telnet linux中显示中文

    vi etc sysconfig i18n 将内容改为 LANG zh CN GB18030 LANGUAGE zh CN GB18030 zh CN GB2312 zh CN SUPPORTED zh CN GB18030 zh CN z
  • office中excel设置下拉框多选

    我参照了这篇文章 https www php cn topic excel 444717 html 这篇文章整体写得不错 但是有些小瑕疵 问题1 在模块1中保存 这里并没有说清楚 具体是 VBA编辑器中 插入 模块 然后复制以下代码 Pub
  • js if else return不管用_前端知识013 学会异步,JS不再烧脑

    01 同步和异步 0101 认识同步异步 0102 前端经常遇到的异步操作 三个经典例子 0103 拿到异步的结果 轮询和回调 0104 回调的几种方式 02 Promise 0201 Promise基本用法 0202 Promise 基本
  • 【打卡-蓝桥杯】Day 7

    题目1 基础练习 芯片测试 解题思路 因为好的芯片多于坏的 所以如果是好芯片 那个被测试为 1 的 总数 gt n 2 代码 n int input arr list map int input split for in range n f
  • python自动化控制设备有限公司_华为 Python网络自动化

    哈喽 大家好 我是艺博东 是一个思科出身 专注于华为的网工 好了 话不多说 我们直接进入正题 光棍二十年 不知道情人节是什么鬼东西 还是好好学技术吧 努力 奋斗吧 为了早日走向人生巅峰 迎娶白富美 拼了 1 安装环境并导入相关模块 首先是安
  • 错误 0xc0202009: 数据流任务 1: SSIS 错误代码 DTS_E_OLEDBERROR。出现 OLE DB 错误。

    原来是一个varchar字段出出现了 和 等特殊字符 这个在insert语句中没有问题 但是使用导入导出会报错 最后要注意的是 导入导出使用的是BulkInsert 方式 每次可能读取一大段 多行记录一起处理 如果这批数据中有错 那么 程序
  • html5注册阿里巴巴作业,面试分享:2018阿里巴巴前端面试总结(题目+答案)

    该楼层疑似违规已被系统折叠 隐藏此楼查看此楼 使用js实现一个持续的动画效果 最开始的思路是用定时器实现 最后没有想的太完整 面试官给出的答案是用 requestAnimationFrame var e document getElemen
  • Java基础(四)——多态、抽象类、接口、内部类

    一 多态 1 多态性是指同一操作作用于某一类对象 可以有不同的解释 产生不同的执行效果 同一事件发生在不同的对象身上 有不同的效果 2 多态存在的三个必要条件 a 需要存在继承和实现关系 b 同样的方法调用而执行不同操作 运行不同代码 重写
  • JS 中把对象按属性名字母顺序进行排序和倒序

    本文同步发布在 JS 中把对象按属性名字母顺序进行排序和倒序 我们在进行前端开发的时候 有时需要对参数进行签名 签名很多第一步是把对象按属性名字母顺序进行排序 那么在 JS 中如何实现呢 实现方式很多 这边介绍一种通过 ES6 的方式来实现