JS 将一维数组转化为二维数组

2023-10-30

1. 需求

遇到一个送礼物的需求,礼物有很多个数据,这里是61个。这里用到的是轮播图进行切换,但是后端返回的是一个礼物list,前端需要对数据进行处理。要求每8个为一个数组。组成二维数组。

在这里插入图片描述

2.js 代码

let list = giftList.list.reduce((arr, item) => {
    if (!arr[key]) arr[key] = []
    arr[key].push(item)
    if (arr[key].length === 8) { //8可以自行设置
        key += 1
    }
    return arr
}, [])
console.log(list,"list")

3. 实现效果

将一维数组转换成8个一组的二维数组

在这里插入图片描述

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

JS 将一维数组转化为二维数组 的相关文章

  • Javascript .includes 函数无法与对象数组一起正常工作[重复]

    这个问题在这里已经有答案了 我有一个正在使用的对象数组 includes 功能 我正在使用数组中的对象搜索该数组 对象是相同的 但似乎没有匹配项 我已将问题复制到这把小提琴 https jsfiddle net 6dua0u0n 代码也在下
  • 如何使用数据对象中的值指定 d3.js 选择器?

    我在 Web 应用程序中使用 d3 js 描述我想要做的事情的最简单方法是查看下面链接的 Fiddle 但基本设置是我有一个包含数据对象的数组 my data id B text I want this text in B id C tex
  • 在图像加载之前显示替代文本来代替图像

    在图像加载之前 如何显示文本代替图像 因为在 HTML 网站上我有一个图像作为页面的标题 所以页面完全加载 标题图像稍后出现 h1 img src heading png alt Some nice heading here width 6
  • 如何按日期属性对对象数组进行排序?

    假设我有一个由几个对象组成的数组 var array id 1 date Mar 12 2012 10 00 00 AM id 2 date Mar 8 2012 08 00 00 AM 如何按日期元素从最接近当前日期和时间的日期开始对该数
  • require未定义nodejs

    尝试使用此 smartsheet api http smartsheet platform github io api docs javascript node js sample code http smartsheet platform
  • 具有多个参数的 JavaScript 函数

    我有一个将数组作为输入的函数 我如何修改它以使用变量参数和数组 例如我想要arrSum 1 2 3 arrSum 1 2 3 回来true即两者都应该返回 6 const arrSum arr gt arr reduce a b gt a
  • 如何将javascript变量放入php echo [关闭]

    很难说出这里问的是什么 这个问题是含糊的 模糊的 不完整的 过于宽泛的或修辞性的 无法以目前的形式得到合理的回答 如需帮助澄清此问题以便重新打开 访问帮助中心 help reopen questions 我想将 JavaScript 变量添
  • yup - 逗号后允许两位数字,小数的最小值和最大值

    const validationSchema yup object amount yup number positive min 5 minimum 5 max 10 maximum 10 如何添加对逗号后两位数字的小数的验证 像这样解决
  • nodeJS require.paths 解决问题

    我试图相对且神秘地需要一个文件 以下情况正在发生 这很有效 这表明 Users marcos Desktop Taper lib utils js myPath Users marcos Desktop Taper lib utils re
  • Node.js 主机名/IP 与证书的替代名称不匹配

    我正在编写一些节点代码来进行 Facebook 的服务器端登录 我已经非常接近让它完全发挥作用了 但是我在请求 auth code 时遇到了麻烦 我认为这可能与 Facebook 应用程序设置有关Site URL但我尝试过的都没有成功 我使
  • Google Analytics 是否具有针对长时间运行的网络应用程序的“心跳”功能?

    我正在制作一个专注于观看嵌入内容的网络应用程序 我希望应用程序客户端向 GA Google Analytics 发送 心跳 类型的信号以保持会话继续进行 现在看来 如果访问者观看视频 5 10 分钟 GA 就会假设他已经离开页面 并将用户的
  • JavaScript 闭包与匿名函数

    我和我的一个朋友目前正在讨论 JS 中什么是闭包 什么不是 我们只是想确保我们真正正确地理解它 我们以这个例子为例 我们有一个计数循环 想要在控制台上延迟打印计数器变量 因此我们使用setTimeout and closures捕获计数器变
  • SVG/XML 中有一些innerHTML 替代品吗?

    在 HTML 中 我可以通过提供字符串形式的模板来构建一个简单的模板系统 替换其中的某些部分 然后使用innerHTML到某个容器 var templ span myText span var newContent templ replac
  • 如何根据 URL 路径添加 CSS 类?

    如何根据我所在的路径将 CSS 类添加到 div 中 包括如果我在其中包含 则不应该出现问题 div class popup ul li a href vs Example 1 a li li a href bod Example 2 a
  • 如何使用 Material UI 制作一个圆形复选框?

    我尝试匹配的设计要求复选框为圆形 我正在使用 Material UI 和 React 边框半径不起作用 因为实际图标的边框不是可见复选框的边框 我不能只使用像 Font Awesome 这样的东西 因为它需要实际检查和取消检查 Curren
  • 弹出窗口显示来自 php 和 javascript 的结果

    我正在尝试实现 javascript 来显示 php 的结果 基本上 我有一个登录页面 对于登录失败 我希望结果显示在弹出窗口中 而不是仅仅用 php 回显它们 我尝试实现警报框 但看起来我错过了一些东西 成功登录将被重定向到logged
  • Chrome 的萤火虫

    谁能推荐一个类似于 Firebug 的不错的 Google Chrome 扩展程序 我确实看到这里有几个类似的问题 但答案似乎非常过时 Thanks It s built in Press Ctrl Shift I Or Tools gt
  • JavaScript:字符串连接性能低下? Array.join('')?

    我读过如果我有一个for循环 我不应该使用字符串连接 因为它很慢 例如 for i 0 i lt 10000000 i str a 相反 我应该使用Array join 因为它更快 var tmp for i 0 i lt 10000000
  • 使用 Angular JS 使图像出现在弹出窗口上

    这是我在 StackOverflow 上的第一篇文章 我正在自学 Angular 所以我是一个初学者 目前很困惑 我正在使用 Angular 创建一个网页 其中一个页面涉及一个按钮和一个弹出窗口 我想将图像放入弹出窗口中 但在实现此操作时遇
  • 如何找到我的 typescript/react 模块的声明?

    我对前端技术非常 非常 陌生 特别是 React 和 TypeScript 当尝试做一件简单的事情 即使用反应组件时 我的问题出现了https github com ckeditor ckeditor5 https github com c

随机推荐

  • 风投与IT

    风投即风险投资 广义的风险投资泛指一切具有高风险 高潜在收益的投资 狭义的风险投资是指以高新技术为基础 生产与经营技术密集型产品的投资 根据美国全美风险投资协会的定义 风险投资是由职业金融家投入到新兴的 迅速发展的 具有巨大竞争潜力的企业中
  • vue设置不出现滚动条的全屏背景100%

    1 想在登录页面设置页面背景占比100 而且不出现滚动 首先给你所需要的元素设置好css 2 如果没生效 看下App vue中是否有定义 app的宽高 将其设置成100 3 如果综上两部设置完成还未生效 那就需要在index html文件中
  • kubernetes集群实战——资源限制(内存、CPU、NameSpace)

    1 k8s容器资源限制 Kubernetes采用request和limit两种限制类型来对资源进行分配 request 资源需求 即运行Pod的节点必须满足运行Pod的最基本需求才能 运行Pod limit 资源限额 即运行Pod期间 可能
  • MySQL必知必会 学习笔记 第一章 了解SQL

    数据库是保存有组织的数据的容器 通常是一个或一组文件 数据库软件称为DBMS 数据库管理系统 数据库是被DBMS创建和操纵的容器 数据库究竟是文件或其他东西并不重要 因为你不会直接访问数据库 而是间接通过DBMS替你访问数据库 表是某种特定
  • BootstrapTable checkbox默认选中

    BootstrapTable 在Web后台管理项目中对表格展示数据使用居多 主要是表格的多条件查询 分页 排序等功能 我们的项目中前端框架是Bootstrap 所以很多插件都是支持Bootstrap的 bootstrap table是一款非
  • 关于List的subList原理分析

    今天在看Java开发手册的时候看到这么一句话 如果需要对list某个范围内的元素进行操作 可以使用subList 任何对子列表的操作最终都会反映到原列表中 例如list subList 0 2 clear 这样的操作便会对原列表进行修改 修
  • SARScape中用sentinel-1数据做SBAS-InSAR完整流程(1/2)

    SARScape中用sentinel 1数据做SBAS InSAR完整流程 1 SABA InSAR原理简述 2 数据采集和预设 2 1 SAR数据采集 2 2 DEM数据下载与放置 2 3 精密轨道数据下载与放置 2 4 制作研究区范围矢
  • 三分钟教你小程序实现无感刷新!

    无感刷新 无感刷新对于前端来说是一项非常实用的技术 其本质是为了优化用户体验 让用户感受不到token已经过期 本质上就是登录时 储存token和refresh token 当token过期或错误时不需要用户跳回登录页重新登录 而是在响应拦
  • python读取文件名存到list_python读取文件名称生成list的方法

    下面为大家分享一篇python读取文件名称生成list的方法 具有很好的参考价值 希望对大家有所帮助 一起过来看看吧 经常需要读取某个文件夹下所有的图像文件 我使用python写了个简单的代码 读取某个文件夹下某个后缀的文件 将文件名生成为
  • 力扣 删除链表的节点

    给定单向链表的头指针和一个要删除的节点的值 定义一个函数删除该节点 返回删除后的链表的头节点 注意 此题对比原题有改动 示例 1 输入 head 4 5 1 9 val 5 输出 4 1 9 解释 给定你链表中值为 5 的第二个节点 那么在
  • 手动实现Spring IOC 跟 AOP 的雏形

    关注后回复 进群 拉你进程序员交流群 作者丨sowhat1412 来源丨sowhat1412 Spring Spring make java more simpleSpring make java more modernSpring mak
  • 在Linux下用C语言写贪吃蛇;

    项目思路 ncurses上下左右键的获得 gt 贪吃蛇地图的实现 gt 显示贪吃蛇的完整身子 gt 贪吃蛇向右移动 gt 贪吃蛇撞墙找死 gt 贪吃蛇自行向右行走与页面一起刷新 利用线程解决 gt 贪吃蛇四个方向的自由走位 gt 贪吃蛇吃饭
  • 教程:群体演化方法分析玉米的驯化与改良

    一般文章在筛选 正选择区间 时 大多 不考虑 群体的 演化历史 即不考虑 群体大小 的变化 只进行亚群之间各种群体遗传参数的对比 这可能会产生大量的假阳性 另一方面 研究一般也 不考虑 遗传信息的 迁移 所以作者希望将群体演化历史及遗传信息
  • MySQL高性能索引策略

    文章目录 高性能索引策略 独立的列 前缀索引 多列索引 选择合适的索引列顺序 聚簇索引 覆盖索引 使用索引扫描来做排序 高性能索引策略 正确地创建和使用索引是实现高性能查询的基础 高效地选择和使用索引有很多种方式 其中有些是针对特殊案例的优
  • 二叉树的基本概念(定义,特性,存储结构等)

    一 二叉树的定义 二叉树 Binary Tree 是n n gt 0 个数据元素的有限集合 该集合可以为空 空二叉树 也可以由一个称为根 root 的元素及两个不相交的 被分别称为左子树和右子树的二叉树组成 如上图中含有7个结点 其中A是根
  • Python安装MySQL库详解(解决Microsoft Visual C++ 9.0 is required )

    前面我们介绍的Python网络爬虫通常将抓取的数据存储至TXT或CSV文件 而当数据量增加之时 就需要将其存储至本地数据库了 Python访问数据库需要对应的接口程序 我们可以把接口程序理解为Python的一个模块 它提供了数据库客户端的接
  • css3选择器如何选择同一个父级下的相同class的第一个元素 nth-child nth-of-type

    1 2 3 4 5 选择第一个类名 demo item nth of type 1 demo item nth child 1 选择最后一个类名 demo item last child 选择其中一个指定的类名 demo item nth
  • Window.open()方法参数详解

    1 最基本的弹出窗口代码 window open page html 2 经过设置后的弹出窗口 window open page html newwindow height 100 width 400 top 0 left 0 toolba
  • 这三个 Go 水平自测题,手写不出来还是先老实上班吧

    现在技术文章特别卷 啥啥底层都能给你分析的头头是道 但是分析的对不对要看作者水平 很有可能一个错 抄他的那些人也跟着错 因为我以前看源码的时候就经常感觉自己在两种状态下切换 懂了 娘咧漏看了 这个函数干啥的 八股文这个事儿 其实也特别考验面
  • JS 将一维数组转化为二维数组

    1 需求 遇到一个送礼物的需求 礼物有很多个数据 这里是61个 这里用到的是轮播图进行切换 但是后端返回的是一个礼物list 前端需要对数据进行处理 要求每8个为一个数组 组成二维数组 2 js 代码 let list giftList l