首页 > 其他分享 >关联数组 (Associative Array)

关联数组 (Associative Array)

时间:2024-03-02 23:56:54浏览次数:16  
标签:JavaScript reduce 待办 数组 Array 数据结构 id Associative

下方数据结构可以被描述为一个JavaScript对象(Object),其中每个键是一个UUID(Universally Unique Identifier),值是一个待办事项对象。
在编程和数据结构领域,这种组织形式没有一个特定的官方名称,但它通常被称为“字典”、“映射”、“关联数组”或“哈希表”。

  • 字典 (Dictionary):在Python等语言中常这样称呼,它存储键值对,并支持通过键高效查找对应的值。
  • 映射 (Map):在许多现代编程语言如Java、C++ STL中称为映射或HashMap。
  • 关联数组 (Associative Array):这个术语强调的是可以通过任意类型的键来索引数组元素,而不是仅仅通过整数索引。
  • 哈希表 (Hash Table):底层实现机制上,这种数据结构经常使用哈希函数将键转化为数组索引以实现快速访问。

在JavaScript中,虽然不直接叫哈希表,但其对象(Object)类型本质上提供了类似哈希表的功能。

 todos: {
      '82471c5f-4207-4b1d-abcb-b98547e01a3e': {
        id: '82471c5f-4207-4b1d-abcb-b98547e01a3e',
        title: 'Learn Zustand',
        done: false,
      },
      '354ee16c-bfdd-44d3-afa9-e93679bda367': {
        id: '354ee16c-bfdd-44d3-afa9-e93679bda367',
        title: 'Learn Jotai',
        done: false,
      },
      '771c85c5-46ea-4a11-8fed-36cc2c7be344': {
        id: '771c85c5-46ea-4a11-8fed-36cc2c7be344',
        title: 'Learn Valtio',
        done: false,
      },
      '363a4bac-083f-47f7-a0a2-aeeee153a99c': {
        id: '363a4bac-083f-47f7-a0a2-aeeee153a99c',
        title: 'Learn Signals',
        done: false,
      },
    },

这种结构的好处是什么?

这种数据结构的好处主要体现在以下几个方面:

  1. 唯一标识
    每个待办事项都有一个唯一的ID,如 '82471c5f-4207-4b1d-abcb-b98547e01a3e'。这使得在处理大量数据时,可以轻松地通过ID来定位、更新或删除特定的待办事项,而无需遍历整个数组或其他复杂操作。

  2. 易扩展性
    以键值对(key-value)的形式存储待办事项,当需要添加新的待办事项时,只需要生成一个新的唯一ID作为键,并创建一个新的待办对象即可。这种结构方便进行增删改查等操作。

  3. 高效的查询和更新
    在JavaScript环境中,根据键查找值是非常快速的操作,这意味着可以根据ID迅速找到并修改某个待办项的状态(例如:改变 done 的值)。

  4. 有序与无序
    这种结构并不依赖于待办事项的插入顺序,因此它们可以按任意顺序显示或操作,同时又能够保证每个待办事项在数据结构中的独立性。

  5. 符合数据库设计原则
    类似的数据结构常见于关系型数据库的设计中,其中主键用于唯一标识记录,其他字段则包含该记录的具体信息。这种方式有助于实现良好的数据一致性与完整性。

  6. 便于状态管理库使用
    在React状态管理库如Zustand、Jotai、Valtio或Signals中,这样的数据结构非常适合用来表示和管理状态,因为这些库通常支持基于键的读写操作,可以直接映射到这种结构上。

如何快速将一个数组转为上述结构?

假设你有一个数组,其中每个元素是一个包含id和其它属性的对象,要将它转换为上述键值对结构的JavaScript对象,可以使用.reduce()方法:

// 假设你的数组如下:
const todosArray = [
  {
    id: '82471c5f-4207-4b1d-abcb-b98547e01a3e',
    title: 'Learn Zustand',
    done: false,
  },
  // 其他待办事项...
];

// 使用 reduce 方法将其转换为键值对结构
const todosObject = todosArray.reduce((acc, todo) => {
  acc[todo.id] = todo;
  return acc;
}, {});

console.log(todosObject);

在这个例子中,.reduce()函数接收两个参数:一个累积器(accumulator)和当前项(currentValue)。
累积器在每次迭代时都会被更新,并在下一次迭代中作为累积器传入。初始值是一个空对象 {}

通过这种方式,我们遍历数组并将每个待办事项对象以其 id 作为键添加到新对象中。最后返回的就是一个以ID为键、待办事项为值的JavaScript对象。

有没有三方库可以快速实现上述转换

对于将数组转换为键值对对象这种简单的操作,通常不需要专门的第三方库。
JavaScript内置的reduce()方法已经足够高效和方便。
不过,如果你正在使用一些功能丰富的数据处理库如Lodash或Ramda,它们也提供了相应的便捷函数可以完成这个任务。

例如,在Lodash中,可以使用_.keyBy()方法:

import _ from 'lodash';

const todosArray = [
  // ...
];

const todosObject = _.keyBy(todosArray, 'id');

在Ramda中,可以组合使用R.indexBy()R.prop()方法:

import R from 'ramda';

const todosArray = [
  // ...
];

const todosObject = R.indexBy(R.prop('id'), todosArray);

但总的来说,直接使用原生JavaScript的reduce()方法是最简洁且无需额外依赖的方式。

标签:JavaScript,reduce,待办,数组,Array,数据结构,id,Associative
From: https://www.cnblogs.com/longmo666/p/18049477

相关文章

  • 数组(基于代码随想录)的随笔
    数组数组基础知识数组是存放在连续内存空间上的相同类型数据的集合。数组的元素是不能删的,只能覆盖。那么二维数组在内存的空间地址是连续的么?Java的二维数组在内存中不是3*4的连续地址空间,而是四条连续的地址空间组成!数组的经典题目二分法二分法时间复杂度:O(logn)......
  • 蓝图数组的操作
    基础使用数组元素获取查找项目元素添加,移除遍历数组......
  • CF1921D Very Different Array 题解
    补充一个对本题贪心思路更(?)清楚的解释。本题贪心思路:在\(a_i,b_i\)分别升序的情况下,对于每个\(a_i\),与它差值最大的\(b_i\)只可能出现在\(b_{n-i+1}\)与\(b_{m-i+1}\)这两者中。证明:首先,假设我们有一个长度为\(n\)的升序序列\(s\)。则对于\(s_1\),与它差值最大......
  • 二维数组和坐标系的对应关系
    题目链接城堡问题这题需要你在二维数组上建立坐标系,并找出上下作用分别对应\((x,y)\)的变化关系。对应关系----------->y|||\/xCode#include<iostream>#include<cstring>#include<algorithm>#include<queue>usingnamespacestd;constintN=60;typed......
  • (33/60)K次取反后最大化的数组和、加油站、分发糖果
    K次取反后最大化的数组和leetcode:1005.K次取反后最大化的数组和贪心法思路两次贪心:(每次取反k--)排序,一次遍历,按绝对值从大到小地把负数取反。如果K次取反没用完,再排序一次,反复取反最小元素。(或者一开始就按绝对值从大到小排序,只需排序一次)复杂度分析时间复杂度:O(Nlo......
  • C++ 指针 vs 数组
    指针和数组并不是完全互换的1#include<iostream>23usingnamespacestd;4constintMAX=3;56intmain()7{8intvar[MAX]={10,100,200};910for(inti=0;i<MAX;i++)11{12*var=i;//这是正确的语法13......
  • 树状数组模板
    单修区查【模板】树状数组1题目描述如题,已知一个数列,你需要进行下面两种操作:将某一个数加上$x$求出某区间每一个数的和输入格式第一行包含两个正整数$n,m$,分别表示该数列数字的个数和操作的总个数。第二行包含$n$个用空格分隔的整数,其中第$i$个数字表示数列......
  • 代码随想录算法训练营第三十三天 | 135. 分发糖果, 134. 加油站, 1005.K次取反后最大化
      1005.K次取反后最大化的数组和 已解答简单 相关标签相关企业 给你一个整数数组 nums 和一个整数 k ,按以下方法修改该数组:选择某个下标 i 并将 nums[i] 替换为 -nums[i] 。重复这个过程恰好 k 次。可以多次选择同一个下......
  • 代码随想录算法训练营第三十三天| ● 1005.K次取反后最大化的数组和 ● 134. 加油站
    K次取反后最大化的数组和 题目链接:1005.K次取反后最大化的数组和-力扣(LeetCode)思路:首先增序排序,然后依次将负值取反,如果负数先用完,则再排序一次,将最小的正数取反之后求和;如果k先用完,直接求和。注意sort默认是增序排序,若想要要降序,则不能使用sort(nums.end(),nums.begin())......
  • JAVA基础:引用类型参数传递的相关案例(数组的传递) 方法重载 return关键字
    packagecom.itheima.Method;publicclassMethod6{publicstaticvoidmain(String[]args){int[]arrs=newint[]{2,5,6,4};printArray(arrs);}publicstaticvoidprintArray(int[]arr){if(arr!=null){System.out......