Object.keys()

news2024/11/24 17:23:25

目录

1、Object.keys() 是什么?

 2、Object.keys(obj) 用法:

        2.1  如果对象是一个对象,会返回对象的属性名组成的数组;

        2.2  如果对象是一个数组,则返回索引组成的数组:

        2.3   如果是字符串,返回索引值数组

        2.4  常用技巧

3、Object.values(obj)和Object.keys()是相反的操作

 3.1   Object.values()的应用:

        3.1.1  如果是简单的一层对象

        3.1.2  如果是对象里嵌套着对象

        3.1.3 如果是数组里嵌套对象


1、Object.keys() 是什么?

        1.  遍历对象(必须包含属性和方法的对象);
        2.  返回对象中每一项key的数组(遍历一个对象,返回一个全是key的数组)

 2、Object.keys(obj) 用法:

        2.1  如果对象是一个对象,会返回对象的属性名组成的数组;
Object.keys()用法示例:
let obj={a:1, b:2, c:3}
Object.keys(obj)
 // ['a', 'b', 'c']

        2.2  如果对象是一个数组,则返回索引组成的数组:
let arr = [1,2,3,4,5,6]
Object.keys(arr) // ["0", "1", "2", "3", "4", "5"]

let arr = ['a', 'b', 'c', 'd'];
console.log(Object.keys(arr)); //['0', '1', '2', '3']
        2.3   如果是字符串,返回索引值数组
let str = "12345字符串"
Object.keys(str) // ["0", "1", "2", "3", "4", "5", "6", "7"]

        2.4  常用技巧
  	 const arrObject = [
        { a: 1, b: 2, c: 3 },
        { a: 2, b: 2, c: 3 },
        { a: 3, b: 3, c: 3 },
      ];
      let res = arrObject.reduce(
        (pre, cur) => {
          Object.keys(pre).forEach((i) => {
            pre[i] = pre[i] + cur[i];
          });
          return pre;
        },
        { a: 0, b: 0, c: 0 }
      );
      console.log("re", res); // { a: 6, b: 7, c: 9 }

3、Object.values(obj)和Object.keys()是相反的操作

        Object.values(obj)返回值是一个包含对象自身的所有可枚举属性值的数组。

 3.1   Object.values()的应用:
        3.1.1  如果是简单的一层对象
var obj = {name: '光', age: '18', height: '177'}

const res= Object.values(obj);
console.log(res)  //  ['光', '18', '177']
        3.1.2  如果是对象里嵌套着对象
var obj = {
  gt: {name: 'xx',age: '18',height: '177'},
  xd: {name: 'yy',age: '12',height: '190'},
  xe: {name: 'ss',age: '10',height: '188'}
}

const res = Object.values(obj);
console.log(res)  
// 
/**
 *  [
 *    {name: 'xx', age: '18', height: '177'},
 *    {name: 'yy', age: '12', height: '190'},
 *    {name: 'ss', age: '10', height: '188'}
 *  ]
 * 
*/

        3.1.3 如果是数组里嵌套对象

        处理数据,比如后端返回的数据是obj形式的,想要对相同的数据进行层级归类

var obj = [
  {dhp:'熊出没',name:"光头强",age:'18',tall:'170'},
  {dhp:'熊出没',name:"熊大",age:'12',tall:'190'},
  {dhp:'熊出没',name:"熊二",age:'10',tall:'188'},
  {dhp:'羊村记事',name:"喜洋洋",age:'8',tall:'60'},
  {dhp:'羊村记事',name:"沸羊羊",age:'9',tall:'80'},
  {dhp:'羊村记事',name:"懒洋洋",age:'10',tall:'60'},
  {dhp:'西游记',name:"孙悟空",age:'500',tall:'130'},
  {dhp:'西游记',name:"猪八戒",age:'150',tall:'140'},
  {dhp:'西游记',name:"白龙马",age:'200',tall:'150'}
]

// 封装一个方法
function getNewList(data) {
  let newObj = {}
  obj.forEach((item, index) => {   
  let { dhp } = item    // 解构出每一个对象里面 dhp字段的值---值值值
  
  if (!newObj[dhp]) {   // 如果在这个新对象里面没有找到,则新增一个对象
    
    newObj[dhp] = {    // 重构对象
      dhp,   
      children: [],
    }
  }
  // 如果在对象里面找到有相同的 dhp 字段的值,则Push进入children里面
  newObj[dhp].children.push(item)
  })
  let newArr = Object.values(newObj)
  return newArr
}

const list = getNewList(obj);
console.log(list)

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

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

相关文章

UE4 4.21-4.27使用编辑器蓝图EditorBlueprint方法

在UE4 4.21中,编辑器蓝图(Editor Blueprint)是一个强大的工具,允许开发者扩展和自定义Unreal编辑器的功能。通过编辑器蓝图,我们可以创建自定义的工具和功能,以优化开发流程。 本教程将指导您如何在UE4 4.…

Golang leetcode142 环形链表 暴力map 快慢指针法

文章目录 环形链表 leetcode142暴力遍历 map哈希记录快慢指针法 环形链表 leetcode142 该题目要求找到入环的第一个节点 我们可以通过map进行记录,没到新的节点查询是否经过原有节点 入环节点,上两个节点的next相同 若有入环节点,则一定能检…

FridaHook(一)——Java层常见方法

1、frida安装运行 pc:pip install frida模拟器: adb connect 127.0.0.1:7555 adb shell cat /proc/cpuinfo下载对应版本frida-server,安装运行 adb push frida-server /data/local/tmp adb shell cd /data/local/tmp chmod 777 frida-serve…

Windows 环境多个JDK安装与切换

一、下载jdk 去Oracle官网上下载想要安装的jdk版本,https://www.oracle.com/java/technologies/downloads/。 二、安装jdk 双击.exe文件,选择好安装目录进行安装。多个版本的jdk重复这两步操作就好。 三、多版本的jdk都下载安装完成之后&#xff0…

众和策略证券开户首选:交易规则和开通条件解析!

一、新三板注册条件 新三板分为2个层级: 立异层:注册前10个生意日日均资产100万及以上,两年的股票生意阅历,危险承受能力C4及以上。 基础层:注册前10个生意日日均资产200万及以上,两年的股票生意阅历&am…

[C#]调用tesseact-ocr的traineddata模型进行ocr文字识别

【框架地址】 https://github.com/charlesw/tesseract 【算法介绍】 Tesseract OCR是一个开源的光学字符识别引擎,它可以将图像中的文字转换成可编辑和可搜索的文本格式。Tesseract由惠普实验室于1985年开始开发,并在2005年被Google收购后成为了开源项…

RHCE9学习指南 第19章 网络时间服务器

19.1 时间同步的必要性 对于一些服务来说对时间要求非常严格,例如,图19-1所示由三台服务器搭建的ceph集群。 图19-1 三台机器搭建的集群对时间要求比较高 这三台服务器的时间必须要保持一样,如果不一样,就会显示报警信息。那么…

GPT-4与DALL·E 3:跨界融合,开启绘画与文本的新纪元

在人工智能的发展浪潮中,MidTool(https://www.aimidtool.com/)的GPT-4与DALLE 3的集成代表了一个跨越式的进步。这一集成不仅仅是技术的结合,更是艺术与文字的完美融合,它为创意产业带来了革命性的变革。本文将探讨GPT…

太阳能4G无线灌溉控制器,助力智慧灌溉,节水增产—蜂窝物联网

传统灌溉费时费力,不仅缺乏灌溉程度的把控,而且带来一系列的水资源浪费和土地盐碱化问题。福建蜂窝物联网科技自主研发的太阳能4G无线灌溉控制器应用了物联网技术和移动互联网技术,能实现对灌溉设备的统一管理和远程控制,结合土壤…

期货日数据维护与使用_日数据维护_模块运行演示

写在前面: 本文默认已经创建了项目,如果不知道如何创建一个空项目的,请参看以下两篇博文 PyQt5将项目搬到一个新的虚拟环境中 https://blog.csdn.net/m0_37967652/article/details/122625280 python_PyQt5开发工具结构基础 https://blog.cs…

引领文旅创新_实时云渲染赋能2023湾区文采会元宇宙虚拟展厅

2023年11月3日,2023粤港澳大湾区公共文化和旅游产品(东莞)采购会(下文简称:2023湾区文采会)开幕式在东莞市文化馆举行。本届大湾区文采会以“文采潮流 融合共生”为主题,集聚了科技、时尚、潮流…

贝蒂详解<string.h>(下)

✨✨欢迎大家来到贝蒂大讲堂✨✨ ​​​​🎈🎈养成好习惯,先赞后看哦~🎈🎈 所属专栏:C语言学习 贝蒂的主页:Betty‘s blog 目录 1. 简介 2. memset()函数 2.1用法 2.2实例 2.3 实现me…

计算机毕业设计-----SSH校园精品课程网前后台

项目介绍 本项目是很不错的一个校园精品课程网源码,前台和后台源码都有,分为管理员与学生两种角色; 前台功能:网站首页,校园新闻,课程中心,资源下载,互动交流,个人中心…

Spring之整合Mybatis底层源码

文章目录 一、整体核心思路1 . 简介2. 整合思路 二、源码分析1. 环境准备2. 源码分析 一、整体核心思路 1 . 简介 有很多框架需要与Spring进行整合,而整合的核心思路就是把其他框架所产生的对象放到Spring容器中,让其成为一个bean。比如Mybatis&#x…

centenos下载安装

阿里云镜像下载 centos-7-isos-x86_64安装包下载_开源镜像站-阿里云 新建虚拟机 (1) 创建新的虚拟机 可以在主页直接点击创建新的虚拟机也可以在上方,点击文件,新建虚拟机 (2) 选择自定义(高级) (3) 硬盘兼容性 默认即可。我…

大模型商业化的又一条路,小冰闯出来了

当鲁特格尔哈尔饰演的Roy Batty在《银翼杀手》说出那段影史留名的台词时,人类对“复制人”“仿生人”的未来预想,全部凝聚成一个实体化的智能体,在未来很多年里支配着全世界对人工智能、数字生命的想象力。 但到了今天,当现实场景…

【漏洞复现】大华 DSS 数字监控系统 itcBulletin SQL 注入

漏洞描述 大华 DSS存在SQL注入漏洞,攻击者 pota/services/itcBuletin 路由发送特殊构造的数据包,利用报错注入获取数据库敏感信息。攻击者除了可以利用 SQL注入漏词获取数据库中的信息例如,管理员后台密码、站点的用户人人信息)之外,甚至在高权限的情况可向服务器中写入木…

汽车产线设备CAN总线一键刷写方案

汽车产线设备CAN总线一键刷写方案 一、概述 随着汽车工业的不断发展,CAN总线技术在汽车产线设备中得到了广泛应用。然而,在实际生产过程中,设备的软件升级和配置更改是不可避免的。为了提高生产效率,我们推出了一键刷写CAN总线解…

windows11右键菜单-新建文本文档(记事本、txt文件)不见了的修复方法

windows11右键菜单-新建文本文档(记事本、txt文件)不见了的修复方法 修改注册表 1、快捷键 WIN R。 2、输入 regedit 点击确定打开“注册表编辑器”。 3、在上边搜索栏直接输入 \HKEY_CLASSES_ROOT.txt 命令进行搜索后会跳转到指定页面 4、双击 …

计算机毕业设计 | SpringBoot图书管理系统(附源码)

1, 概述 1.1 课题背景 开发一个学生成绩管理系统,采用计算机对学生成绩进行处理,进一步提高了办学效益和现代化水平。为广大教师和学生提高工作效率,实现学生成绩信息管理工作流程的系统化、规范化和自动化。现在我国中学的学生…