JS 按照数组顺序对对象进行排序


在JavaScript中,可以通过将对象转换为可排序的结构(如数组),使用自定义比较函数基于参考数组的顺序进行排序,然后转换回对象来实现。以下是一个通用的函数示例,它接受一个参考数组和一个待排序的对象,并返回一个新对象,其键按照参考数组的顺序排列。

需求:自定义排序 el-table 表格的列。
思路:根据数组字段的顺序,对对象中的key值进行重新排序。
// 示例代码 const referenceOrder = ['sunday', 'monday', 'wednesday', 'thursday', 'friday']; const unsortedObject = { wednesday: 'wednesday', friday: 'friday', monday: 'monday', thursday: 'thursday', sunday: 'sunday' }; // 预期输出: const unsortedObject = { sunday: 'sunday', monday: 'monday', wednesday: 'wednesday', thursday: 'thursday', friday: 'friday' };
代码实现:
/** * 按照数组顺序对对象进行排序 * @param {Array} arr - 排序依据的数组 * @param {Object} obj - 需要排序的对象 * @returns {Object} 按数组顺序重新排列的对象 */ export function sortObjectByArray(arr, obj) { const sortedObj = {}; arr.forEach(key => { if (obj.hasOwnProperty(key)) { sortedObj[key] = obj[key]; } }); return sortedObj; } let sortedObject = sortObjectByArray(arr, object); console.log(sortedObject); // 输出结果: { sunday: 'sunday', monday: 'monday', wednesday: 'wednesday', thursday: 'thursday', friday: 'friday' };
问题:

在Vue中发现 调用 hasOwnProperty 报错:不要使用对象原型上的方法,因为原型的方法可能会被重写。

Do not access Object.prototype method ‘hasOwnProperty‘ from target object no-prototype-builtins

原因:

出现这种报错是因为使用Vue.js启动项目会自动生成配置为与ESLint一起使用的样板

ESLint是一个能帮助识别报告JS中的不良模式,以便维护代码

在ECMAScript5.1中,新增了 Object.create,它支持使用指定的 [[Prototype]] 创建对象。Object.create(null)是一种常见的模式,用于创建将用作映射的对象

Object.create(null) 创建的对象是一个空对象,在该对象上没有继承 Object.prototype 原型链上的属性或者方法,例如:toString(), hasOwnProperty()等方法

因为no-prototype-builtins 规则不允许Object.prototype直接从对象调用方法,所以会导致这种错误

解决方法:

将xxx.hasOwnProperty(‘yyy’)修改为Object.prototype.hasOwnProperty.call(xxx, ‘yyy’)

/** * 按照数组顺序对对象进行排序 * @param {Array} arr - 排序依据的数组 * @param {Object} obj - 需要排序的对象 * @returns {Object} 按数组顺序重新排列的对象 */ export function sortObjectByArray(arr, obj) { const sortedObj = {}; arr.forEach(key => { // if (obj.hasOwnProperty(key)) { // 修改前 if (hasOwnKey(obj, key)) { // 修改后 sortedObj[key] = obj[key]; } }); return sortedObj; } function hasOwnKey(obj, key) { return Object.prototype.hasOwnProperty.call(obj, key) }

记录一下~

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/1137648.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Qwen2.5-7B部署教程:从镜像拉取到网页访问完整步骤

Qwen2.5-7B部署教程:从镜像拉取到网页访问完整步骤 1. 引言 1.1 学习目标 本文将带你从零开始完成 Qwen2.5-7B 大语言模型的本地化部署,涵盖从镜像拉取、环境配置、服务启动到通过网页端进行推理交互的完整流程。完成本教程后,你将能够&…

LoRaWAN 协议解析:为什么它成为低功耗物联网项目的常见底座选择?

在智慧能源、智慧水务、环境监测、园区与城市感知等项目中,一个趋势正在反复出现: 接入的设备越来越多,但每个设备的数据量却很小,而且必须长期、稳定、低成本运行。 在大量实际项目里,常见的设备类型包括:…

JS 判断两个数组内容相同

实现数组长度比较,快速排除不同长度的数组对数组进行排序处理,忽略元素顺序逐元素比较排序后的数组内容返回布尔值结果,直接判断数组内容是否相等示例代码验证不同顺序数组的比较结果function arraysEqual(arr1, arr2) {if (arr1.length ! ar…

Qwen2.5-7B保姆级教程:从零开始部署指令调优模型详细步骤

Qwen2.5-7B保姆级教程:从零开始部署指令调优模型详细步骤 1. 引言 1.1 技术背景与学习目标 随着大语言模型(LLM)在自然语言处理、代码生成、多语言支持等领域的广泛应用,越来越多的开发者希望能够在本地或私有环境中部署高性能的…

Qwen2.5-7B如何提升准确率?指令遵循优化部署案例

Qwen2.5-7B如何提升准确率?指令遵循优化部署案例 1. 背景与技术演进:Qwen2.5-7B 的核心价值 1.1 大模型发展中的精准性挑战 在当前大语言模型(LLM)广泛应用的背景下,准确率和指令遵循能力已成为衡量模型实用性的关键…

Qwen2.5-7B电商场景应用:商品描述自动生成系统部署案例

Qwen2.5-7B电商场景应用:商品描述自动生成系统部署案例 1. 引言:为何选择Qwen2.5-7B构建电商内容生成系统? 随着电商平台商品数量的爆炸式增长,人工撰写高质量、结构化且吸引用户点击的商品描述已成为运营瓶颈。传统模板化生成方…

使用C#代码在 Excel 中获取工作表名称

在 Excel 中,工作表名称可以作为工作簿内容的一种元数据。通过获取这些名称的列表,可以大致了解每个工作表的用途,并概览某类数据存储的位置。这对于较大的工作簿或团队协作尤其有用。本文将介绍如何使用 Spire.XLS for .NET 在 C# 中获取 Ex…

Qwen2.5-7B多语言混输:混合语言处理

Qwen2.5-7B多语言混输:混合语言处理 1. 技术背景与核心价值 随着全球化信息交互的加速,多语言混合输入已成为自然语言处理(NLP)领域的重要挑战。用户在实际交流中常常无意识地切换语言,例如在中文对话中夹杂英文术语…

Qwen2.5-7B参数详解:28层transformers架构部署须知

Qwen2.5-7B参数详解:28层transformers架构部署须知 1. 技术背景与核心价值 随着大语言模型在自然语言理解、代码生成和多模态任务中的广泛应用,高效、可扩展且具备强推理能力的模型架构成为工程落地的关键。阿里云推出的 Qwen2.5-7B 是 Qwen 系列中参数…

项目应用示例:Reflect API在ES6中的作用

Reflect API:ES6 中被低估的元编程基石 你有没有遇到过这样的场景? 调试一个响应式框架时,发现数据变了但视图没更新——翻源码才发现,是某个 this 指向出了问题; 写了个 Proxy 代理对象来监听属性变化&#xff0…

SpringBoot+SpringAI实战:30分钟搭建你的第一个智能应用

SpringAI是Spring生态下的一个全新项目,核心目标是为Java开发者提供一套简单、统一的API,快速集成各类AI大模型能力,无需关注不同厂商API的差异。 核心优势: 统一API:对接不同大模型无需修改核心代码,切换模…

ECU实现UDS 27服务时的RAM资源优化建议

如何在资源受限的ECU中高效实现UDS 27服务?这4个RAM优化技巧你必须掌握最近在调试一个车身控制器(BCM)的诊断功能时,遇到了一个典型问题:明明只加了一个安全访问功能,系统却频繁触发内存溢出告警。排查后发…

Qwen2.5-7B推理加速:SwiGLU激活函数优化实战

Qwen2.5-7B推理加速:SwiGLU激活函数优化实战 1. 引言:为何关注Qwen2.5-7B的推理性能? 1.1 大模型推理的现实挑战 随着大语言模型(LLM)在实际应用中的广泛部署,推理延迟和显存占用成为制约用户体验的关键…

OpenMV机器视觉项目开发流程:实战案例分享经验总结

用OpenMV做机器视觉?别再从零试错了!一位工程师的实战避坑指南你有没有过这样的经历:花了几百块买了OpenMV,兴致勃勃地接上摄像头、写好颜色识别代码,结果在实验室跑得好好的程序,一到现场就“抽风”——一…

银行业一体化智能可观测平台选型指南——聚焦业务价值,保障核心业务稳定运行

在数字化转型进入深水区的今天,银行业务线上化、架构微服务化、基础设施云化已成常态,这既带来了业务创新的敏捷性,也让IT系统复杂度呈指数级增长。一次支付超时、一笔理财交易失败,不仅影响客户体验与品牌声誉,更可能…

Qwen2.5-7B免费部署方案:利用社区资源运行大模型实战

Qwen2.5-7B免费部署方案:利用社区资源运行大模型实战 1. 背景与技术价值 1.1 大模型平民化趋势下的部署需求 随着大语言模型(LLM)在自然语言理解、代码生成、多轮对话等任务中展现出惊人能力,越来越多开发者和企业希望将这些模…

Qwen2.5-7B推理速度优化:降低延迟的5个关键步骤

Qwen2.5-7B推理速度优化:降低延迟的5个关键步骤 1. 引言:为何需要优化Qwen2.5-7B的推理延迟? 1.1 大模型推理的现实挑战 随着大语言模型(LLM)在实际业务场景中的广泛应用,推理延迟已成为影响用户体验的关…

Qwen2.5-7B中文诗歌创作:文学生成应用

Qwen2.5-7B中文诗歌创作:文学生成应用 1. 技术背景与应用场景 随着大语言模型在自然语言理解与生成能力上的持续突破,AI参与文学创作已从概念验证走向实际落地。阿里云推出的 Qwen2.5-7B 模型,作为 Qwen 系列中参数规模为 76.1 亿的中等体量…

Qwen2.5-7B文本摘要生成:长文档处理技巧

Qwen2.5-7B文本摘要生成:长文档处理技巧 1. 技术背景与挑战 随着大语言模型在自然语言处理任务中的广泛应用,长文档的自动摘要生成已成为信息提取、内容聚合和知识管理的核心需求。传统摘要模型受限于上下文长度(通常为512或1024 tokens&am…

如何高效部署Qwen2.5-7B?网页服务接入实战步骤详解

如何高效部署Qwen2.5-7B?网页服务接入实战步骤详解 1. 引言:为什么选择 Qwen2.5-7B 进行网页推理? 随着大语言模型(LLM)在自然语言理解与生成任务中的广泛应用,越来越多企业与开发者希望将高性能模型快速集…