JavaScript —— JSchallenger Objects 对象练习(测试一下你的 JS 对象基础)【专题三】

简介: JavaScript —— JSchallenger Objects 对象练习(测试一下你的 JS 对象基础)【专题三】

JavaScript 对象练习

1. 键值对,去掉键的引号
  Test: myFunction('a', 'b') Expected: {a: 'b'}
  Test: myFunction('b', 'w') Expected: {b: 'w'}

可以使用 [] 去掉 ''

  function myFunction(a, b){
    return {[a] : b}
  }
  myFunction('a', 'b')
2. 数组 a 和数组 b,创建一个键 a 和相应值 b 属性的对象,并返回
  Test: myFunction(['a', 'b', 'c'], [1, 2, 3])  Expected: {a: 1, b: 2, c: 3}
  Test: myFunction([1, 'b'], ['a', 2])          Expected: {1: 'a', b: 2}

代码实现:reduce() 用法 | 参考链接


acc 是一个对象

cur 相当于直接写一个字符串,但因为是变量,所有用 [] 括起来

总的来说,就是 ...acc 得到的是一个最终的总对象,[cur] 为当前的 key 值,b[i] 为获取对应的 b数组 中的值,{} 传递给函数的初始值是个对象。

9d643468e0bc4cb9ae041e2f8e4c6770.png

  function myFunction(a, b) {
        const res = a.reduce((acc, cur, i) => {
            acc[cur] = b[i]
            return acc
        }, {})
        return res
    }
    myFunction([1, 'b'], ['a', 2])


  function myFunction(a, b) {
        return a.reduce((acc, cur, i) => ({ ...acc, [cur]: b[i] }), {})
    }
    myFunction([1, 'b'], ['a', 2])
3. 以数组的形式返回对象的键
  Test: myFunction({a: 1, b: 2, c: 3})      Expected: ['a', 'b', 'c']
  Test: myFunction({w: 15, x: 22, y: 13})   Expected: ['w', 'x', 'y']

使用 Object.key() 方法,得到键值,并以数组的方式返回

  function myFunction(arr) {
        return Object.keys(arr)
    }
    myFunction({a: 1, b: 2, c: 3})
4. 返回对象 value 值的总和
  Test: myFunction({a: 1, b: 2, c: 3})      Expected: 6
  Test: myFunction({w: 15, x: 22, y: 13})   Expected: 50

使用 Object.values() 方法,得到 value 值,再通过 reduce() 方法累加

  function myFunction(a) {
        return Object.values(a).reduce((sum, cur) => sum + cur, 0)
    }
    myFunction({a: 1, b: 2, c: 3})
5. 返回除键值为 b 的原始对象
  Test: myFunction({ a: 1, b: 7, c: 3 })   Expected: { a: 1, c: 3 }
  Test: myFunction({ b: 0, a: 7, d: 8 })   Expected: { a: 7, d: 8 }

代码实现:

  1. 使用 delete 删除指定键的键值对。(此方法会改变原始对象,不推荐使用)
  2. 使用 ... 扩展运算符,取出键的值不为 b 的剩余对象
  function myFunction(obj) {
        let deleteB = delete obj.b
        return obj
    }
    myFunction({a: 1, b: 2, c: 3})
  function myFunction(obj) {
        const { b, ...rest } = obj
        return rest
    }
    myFunction({a: 1, b: 2, c: 3})
相关文章
|
6天前
|
JavaScript 前端开发
JavaScript基础知识-枚举对象中的属性
关于JavaScript基础知识中如何枚举对象属性的介绍。
12 1
JavaScript基础知识-枚举对象中的属性
|
7天前
|
JavaScript 前端开发
JavaScript基础知识-对象的基本操作
关于JavaScript对象基本操作的基础知识文章。
19 2
|
6天前
|
JavaScript 前端开发
JavaScript基础知识-对象字面量
文章介绍了JavaScript中对象字面量的创建和使用,包括基本语法、属性赋值以及如何在控制台输出对象属性。
13 0
JavaScript基础知识-对象字面量
|
7天前
|
JavaScript 前端开发 API
Javaweb之javascript的BOM对象的详细解析
BOM为Web开发提供了强大的API,允许开发者与浏览器进行深入的交互。合理使用BOM中的对象和方法,可以极大地增强Web应用的功能性和用户体验。需要注意的是,BOM的某些特征可能会在不同浏览器中表现不一致,因此在开发过程中需要进行仔细的测试和兼容性处理。通过掌握BOM,开发者能够制作出更丰富、更动态、更交互性的JavaWeb应用。
10 1
|
8天前
|
测试技术 C# 开发者
“代码守护者:详解WPF开发中的单元测试策略与实践——从选择测试框架到编写模拟对象,全方位保障你的应用程序质量”
【8月更文挑战第31天】单元测试是确保软件质量的关键实践,尤其在复杂的WPF应用中更为重要。通过为每个小模块编写独立测试用例,可以验证代码的功能正确性并在早期发现错误。本文将介绍如何在WPF项目中引入单元测试,并通过具体示例演示其实施过程。首先选择合适的测试框架如NUnit或xUnit.net,并利用Moq模拟框架隔离外部依赖。接着,通过一个简单的WPF应用程序示例,展示如何模拟`IUserRepository`接口并验证`MainViewModel`加载用户数据的正确性。这有助于确保代码质量和未来的重构与扩展。
16 0
|
8天前
|
Java 数据库连接 数据库
从零到精通:揭秘 Hibernate 构建持久层服务的全过程,你离数据持久化大师还有多远?
【8月更文挑战第31天】本文详细介绍了如何从零开始使用 Hibernate 构建一个持久层服务。首先,通过在 Maven 项目中添加必要的依赖,确保项目具备使用 Hibernate 的条件。接着,配置 `hibernate.cfg.xml` 文件以连接 MySQL 数据库,并设置了基本属性。然后定义了一个简单的 `User` 实体类及其映射关系。此外,还创建了一个 `HibernateUtil` 工具类来管理 `SessionFactory`。
22 0
|
10天前
|
JavaScript 前端开发 测试技术
Vue.js开发者必看!Vue Test Utils携手端到端测试,打造无懈可击的应用体验,引领前端测试新风尚!
【8月更文挑战第30天】随着Vue.js的普及,构建可靠的Vue应用至关重要。测试不仅能确保应用质量,还能提升开发效率。Vue Test Utils作为官方测试库,方便进行单元测试,而结合端到端(E2E)测试,则能构建全面的测试体系,保障应用稳定性。本文将带你深入了解如何使用Vue Test Utils进行单元测试,通过具体示例展示如何测试组件行为;并通过Cypress进行E2E测试,确保整个应用流程的正确性。无论是单元测试还是E2E测试,都能显著提高Vue应用的质量,让你更加自信地交付高质量的应用。
21 0
|
2月前
|
存储 JavaScript 前端开发
|
JavaScript
js基础笔记学习247event对象3
js基础笔记学习247event对象3
60 0
js基础笔记学习247event对象3
|
JavaScript
js基础笔记学习309筛选jquery对象1
js基础笔记学习309筛选jquery对象1
50 0
js基础笔记学习309筛选jquery对象1