ECMAScript 2017 中 Object.values() 方法的使用实例

前言

JavaScript 的不断更新促使其日益优秀,ECMAScript2017 中 Object.values() 方法是 ECMAScript2015 中 Object.getOwnPropertySymbols() 方法的补充。本文将介绍 Object.values() 方法重要性与使用实例,并向读者展示如何在您的代码中使用它。

Object.values() 方法的作用

Object.values() 方法返回一个由对象自身的属性值(不包括继承的属性值)构成的数组。数组中属性值的排列顺序与使用for...in 循环遍历对象时返回的顺序一致。

Object.values() 的语法

-------------------

参数

  • obj:要返回其枚举自身属性的对象。

返回值

一个包含给定对象的所有可枚举属性值的数组。

Object.values() 的使用实例

示例1:获取对象属性值的数组

----- ------ - - -- -- -- -- -- - --

----------------------------------- -- --- -- --

在这里我们创建了一个对象,包含属性a,b,c。然后使用 Object.values() 返回由属性值组成的数组,结果为 [1,2,3]。

示例2:简化数组获取最小值

----- --- - --- -- -------------------- -----
----- ------ - ------------------- -- --- -- --- -- --- ----
-------------------- -- --

在这里我们定义了一个简单的函数,用于获取给定数组的最小值。然后我们使用 Object.values() 获取对象属性值组成的数组。简化了获取对象属性值的过程,让代码更简单。

示例3:剔除数组中的重复值

----- ------ - - -- -- -- -- -- -- -- - --
----- -------------- - --- -- ------- ----------

--------------------------------------------------- -- --- -- --

在这里,我们创建一个包含重复值的对象,并定义了一个函数用于剔除给定数组中的重复值。然后我们使用 Object.values() 方法获取对象属性值的数组,最后剔除数组中的重复值。结果为 [1,2,3]。

总结

Object.values() 方法能够帮助我们简化代码。它允许我们一次性地获取对象中所有属性的值,或者处理一个由对象属性值组成的数组。

这个方法在现代 JavaScript 中非常有用,因此您应该努力学习并掌握它,以便更好地应对实际问题。

希望这篇文章对您有所帮助,让您了解 Object.values() 方法的使用实例,让您的代码更加简洁易读。

来源:JavaScript中文网 ,转载请联系管理员! 本文地址:https://www.javascriptcn.com/post/6486ee9648841e9894593629


猜你喜欢

  • 如何在 Node.js 中使用 WebSocket 实现实时的在线游戏

    前言 随着互联网技术的不断发展,越来越多 的在线游戏开始采用实时通讯技术来实现多人在线游戏的交互。其中最常用的就是 WebSocket 技术。WebSocket 是 HTML5 中的一种新协议,提供了...

    1 年前
  • 在 ES9 中使用 spread operator 替代 apply 方法的示例

    在 ES9 中使用 spread operator 替代 apply 方法的示例 在前端开发中,我们经常会需要将一个数组或对象中的元素传递给另一个函数或方法。以前,我们通常使用 apply 方法来实现...

    1 年前
  • Custom Elements 和 Webpack 的混合开发教程

    前端开发中,我们经常需要通过组件化的方式构建页面。而 Custom Elements 是 Web Components 技术中的一环,可以让我们更加方便地创建自定义标签并重用它们。

    1 年前
  • 了解 RESTful API 的三种认证方式

    RESTful API是一组通过HTTP协议定义的API,它是当前Web API设计的最佳实践。在Web应用程序中,RESTful API被广泛用于数据交换和应用程序集成。

    1 年前
  • ECMAScript 2017 中的 Promise.all() 方法和 Promise.race() 方法的区别与使用方法

    ECMAScript 2017 中的 Promise.all() 方法和 Promise.race() 方法的区别与使用方法 随着 Web 应用程序的逐渐发展,异步编程已经变得越来越重要。

    1 年前
  • CSS Flexbox 布局中的选择器和权重

    CSS Flexbox 布局(Flexible Box Layout)是现代前端开发中常用的一种布局方式。与传统布局方式相比,Flexbox 布局更加灵活,并且可以更方便地实现响应式设计。

    1 年前
  • SVG 图形的性能优化技巧

    SVG 是一种矢量图形格式,由于其具备无限放大不失真的特点,逐渐成为前端开发者喜欢使用的图形格式之一。但是,在实际工作中,我们也需要关注 SVG 图形的性能问题,因为不合理使用 SVG 图形会影响页面...

    1 年前
  • TypeScript 如何继承基础类型?

    TypeScript 是一个强类型语言,它拥有 JavaScript 的所有功能并且增加了类型检查和其他特性。在 TypeScript 中,我们可以通过继承类型来扩展基础类型,这种方式被称为类型扩展。

    1 年前
  • ES6 中的 Set 和 WeakSet 又简单又实用

    引言 在 ES6 中,Set 和 WeakSet 是新加入的数据结构。它们都是用于存储一组唯一的值。Set 类似于数组,但它的值必须是唯一的,而 WeakSet 则是一种弱引用的结构,在没有其他引用时...

    1 年前
  • 使用 Hapi.js 实现图片上传和压缩

    在前端开发中,图片是非常重要的一个部分。然而,上传和处理图片并不是一件简单的事情。使用 Hapi.js,我们可以很方便地实现图片上传和压缩功能。 什么是 Hapi.js? Hapi.js 是一个基于 ...

    1 年前
  • Fastify 应用的虚拟环境,mock 和数据处理

    前言 随着前端技术的不断发展,前端越来越注重效率和用户体验,越来越多的前端项目需要与后端进行交互,这时候就需要一个高效的后台服务来支持前端业务。而 Fastify 作为一个高效、低开销的 Node.j...

    1 年前
  • Kubernetes 中 LivenessProbe 和 ReadinessProbe 的使用

    Kubernetes 中 LivenessProbe 和 ReadinessProbe 的使用 在 Kubernetes 中,LivenessProbe 和 ReadinessProbe 是用来检测应...

    1 年前
  • 如何在 Angular 中使用 LocalStorage 进行数据存储

    本文将介绍如何在 Angular 应用中使用 LocalStorage 进行数据存储。在开发一个前端应用时,通常需要在客户端进行一些数据的存储,这时候我们就可以使用 LocalStorage。

    1 年前
  • Webpack 如何在 template 模板中使用变量

    什么是 template 模板 在前端开发中,我们会使用各种模板引擎来简化页面的开发。其中,template 模板是一种常见的模板引擎,它的语法类似于 HTML,可以通过变量绑定来渲染页面。

    1 年前
  • Docker 安全性分析与加固

    背景 Docker 是一种流行的容器化技术,已经广泛应用于前端开发、部署和运维等领域。然而,由于 Docker 容器的本质,它所承载的应用程序的安全性受到了挑战。这不仅对业务运营造成风险,而且使攻击者...

    1 年前
  • CSS Grid 项目中的共宽行

    CSS Grid 是一种新的网格布局系统,它可以帮助前端工程师更好地布局页面、管理网页排列、创建一些看起来很酷的样式等等。这里,我们要探讨的是 CSS Grid 项目中的共宽行。

    1 年前
  • 编写可重复使用的 GraphQL 查询

    前言 GraphQL 是一种非常流行的 API 查询语言,它可以轻松地查询即时发生变化的数据,而无需重复请求数据。使用 GraphQL,我们可以轻松查询多个数据源并将结果组合在一起,而不必编写多个 R...

    1 年前
  • 十大常见 React SPA 应用性能问题及解决方案

    React 是现今享有极高人气的前端框架之一,相信很多前端程序员都曾接触过它,但是在实际开发中,应用的性能却常常让我们苦恼不已。为此,本文将详细介绍 React SPA 应用中十大常见性能问题以及解决...

    1 年前
  • 如何在 Chai 中测试 Websocket 实时通信代码

    在前端开发中,Websocket 已经成为实现实时通信的重要技术手段。而测试也是前端开发中不可或缺的一环,只有通过测试才能确保代码的可靠性和稳定性。本文将介绍如何使用 Chai 对 Websocket...

    1 年前
  • 如何在 ECMAScript 2021 中正确使用 Object.fromEntries() 方法

    简介 ECMAScript 2021 中增加了 Object.fromEntries() 方法。它接受一个数组作为参数,该数组包含键值对的数组,然后将它们转换成一个对象。

    1 年前

相关推荐

    暂无文章