当前位置: 首页 > news >正文

Object.keys()

目录

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)

相关文章:

  • Go语言学习记录——用正则表达式(regexp包)来校验参数
  • mysql进阶-索引基础
  • 高效构建Java应用:Maven入门和进阶(五)
  • 【JavaScript】es6开发常用技巧
  • Page 251~254 Win32 GUI项目
  • 使用MATLAB连接USRP
  • 6、C语言:输入与输出
  • [学习笔记]刘知远团队大模型技术与交叉应用L1-NLPBig Model Basics
  • 常见设计模式--通俗易懂版
  • 使用Spring Boot集成中间件:Elasticsearch基础->提高篇
  • [力扣 Hot100]Day2 字母异位词分组
  • springCould中的Bus-从小白开始【11】
  • 数据库管理-第130期 JSON二元性(20240109)
  • 【Java SE语法篇】9.抽象类和接口
  • BC28 大小写转换
  • [译]CSS 居中(Center)方法大合集
  • 2019年如何成为全栈工程师?
  • Angular js 常用指令ng-if、ng-class、ng-option、ng-value、ng-click是如何使用的?
  • Django 博客开发教程 16 - 统计文章阅读量
  • Docker 笔记(1):介绍、镜像、容器及其基本操作
  • iOS高仿微信项目、阴影圆角渐变色效果、卡片动画、波浪动画、路由框架等源码...
  • Java 实战开发之spring、logback配置及chrome开发神器(六)
  • JS 面试题总结
  • Object.assign方法不能实现深复制
  • Spring Boot快速入门(一):Hello Spring Boot
  • Vue学习第二天
  • 阿里云容器服务区块链解决方案全新升级 支持Hyperledger Fabric v1.1
  • 腾讯大梁:DevOps最后一棒,有效构建海量运营的持续反馈能力
  • 学习使用ExpressJS 4.0中的新Router
  • Spark2.4.0源码分析之WorldCount 默认shuffling并行度为200(九) ...
  • 格斗健身潮牌24KiCK获近千万Pre-A轮融资,用户留存高达9个月 ...
  • ​ssh免密码登录设置及问题总结
  • #define,static,const,三种常量的区别
  • #Linux杂记--将Python3的源码编译为.so文件方法与Linux环境下的交叉编译方法
  • #QT(串口助手-界面)
  • $var=htmlencode(“‘);alert(‘2“); 的个人理解
  • (13)Latex:基于ΤΕΧ的自动排版系统——写论文必备
  • (c语言版)滑动窗口 给定一个字符串,只包含字母和数字,按要求找出字符串中的最长(连续)子串的长度
  • (floyd+补集) poj 3275
  • (HAL)STM32F103C6T8——软件模拟I2C驱动0.96寸OLED屏幕
  • (WSI分类)WSI分类文献小综述 2024
  • (二)七种元启发算法(DBO、LO、SWO、COA、LSO、KOA、GRO)求解无人机路径规划MATLAB
  • (附源码)计算机毕业设计ssm-Java网名推荐系统
  • (附源码)计算机毕业设计SSM疫情社区管理系统
  • (论文阅读22/100)Learning a Deep Compact Image Representation for Visual Tracking
  • (免费领源码)Java#Springboot#mysql农产品销售管理系统47627-计算机毕业设计项目选题推荐
  • (一)80c52学习之旅-起始篇
  • *2 echo、printf、mkdir命令的应用
  • .net core 依赖注入的基本用发
  • .NET Core、DNX、DNU、DNVM、MVC6学习资料
  • .Net MVC4 上传大文件,并保存表单
  • .NET 表达式计算:Expression Evaluator
  • .net6Api后台+uniapp导出Excel
  • .skip() 和 .only() 的使用
  • [APIO2015]巴厘岛的雕塑