数组扁平化flat
发表于|更新于
|浏览量:
还保持着较为清醒的头脑,就决然不能把人生之船长期停泊在某个温暖的港湾。——路遥《早晨从中午开始》
在前端开发中可能会有这样的需求:
将一个数组中的数组拆分出来放到原数组中
那么我们就可以使用flat函数
1 | [1,[2,3,[4,5,6,[7,8,9]]]].flat() |

flat中可以传入参数为数字,表示你要拆分数组的层数


如果全部拆分,可以使用flat(Infinity)
1 | [1,[2,3,[4,5,6,[7,8,9]]]].flat(Infinity) |

如果是较为复杂点的对象,则就只能使用map先取出来,再使用flat
1 | [{ruben:[1]},{ruben:[2,3]}].map(({ruben})=>ruben).flat() |

相关推荐
2022-08-31
资源路径与blobUrl互转
害怕树敌的人永远得不到真正的朋友——哈兹里特 首先是普通资源URL转换为blobUrl 12345678910111213// 生成blobURLconst xhr = new XMLHttpRequest();xhr.open('GET', 'https://VampireAchao.github.io/imgs/preview/3356_3.jpg', true);xhr.responseType = 'blob';xhr.onload = function (e) { if (this.status == 200) { var blob = this.response; console.log(blob); // document.getElementById("myImg").src = URL.createObjectURL(blob); console.log(URL.createObjectURL(bl...
2022-07-10
vue3配置jsx
正如自然忌讳真空一样,人类是讨厌平等的。——《我是猫》 首先按照官方文档创建项目: 1npm init vite hello-vue3 -- --template vue # 或 yarn create vite hello-vue3 --template vue 然后我们安装jsx插件:https://github.com/vuejs/babel-plugin-jsx 1npm install @vue/babel-plugin-jsx -D 然后配置vite.config.js 123456789101112import { defineConfig } from 'vite'import vue from '@vitejs/plugin-vue'import vuejsx from "@vue/babel-plugin-jsx"// https://vitejs.dev/config/export default defineConfig({ plugins: [vue(),...
2023-09-18
仿钉钉官网滚动效果
恭维含有一种毒剂,使最坚强的人也不免昏昏陶醉。——大仲马 今天在bilibili刷到个视频 https://www.bilibili.com/video/BV12z4y1s7nE/ 发现实现了钉钉官网效果 https://www.dingtalk.com/ 非常的炫酷,仓库源码: https://gitee.com/vary-space/hello-world/tree/12z4y1s7nE
2023-01-04
css渐变实现杂色
团结就是力量——毛泽东 思路出处:https://css-tricks.com/making-static-noise-from-a-weird-css-gradient-bug/ 这是一个通过css渐变产生的锯齿BUG实现的噪点效果 例如我们使用径向渐变画两个圆,这里用的径向渐变函数radial-gradient,其中第一个参数是距离中心点近的渐变样式,第二个是远一些的,每个参数中第一项是颜色,第二项是区域 这里的: 从中心点进行沿半径进行渐变 123456789101112131415<div class="box"></div><div class="box"></div><style> .box { display: inline-block; width: 300px; aspect-ratio: 1; margin: 10px; border: 2px solid red; background: radial-gradient(#000...
2024-07-22
Apache-ShenYu支持namespace功能
健康的身体是灵魂的客厅,病弱的身体是灵魂的监狱。——培根 我主要完成前端部分对接,pr如下: https://github.com/apache/shenyu-dashboard/pull/462 这里主要是结合redux-saga完成需求,例如modal/global.js shenyu-dashboard/src/models/global.js at 624a2afe74367b5c5a310627197d3622a8c896a4 · apache/shenyu-dashboard · GitHub 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109...
2025-02-27
animejs简单示例
乖孩子的路,疯子的路,五彩的路,浪荡子的路,任何的路。——杰克·凯鲁亚克的《在路上》 GitHub - juliangarnier/anime: JavaScript animation engine https://animejs.com/ 使用Anime.js这个强大的JavaScript动画库来实现一个简单的动画效果。我们将通过一个示例代码来展示如何使用Anime.js使一个div元素从透明变为不透明,并且从左向右移动50像素。 示例代码下面是我们的完整HTML代码: 1234567891011121314151617181920212223242526272829303132<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> body { back...

阿超
我的名字叫阿超 年龄25岁 家在北京市 职业是软件开发 每天最晚也会在八点前回家 不抽烟 酒浅尝辄止 晚上十二点上床 保证睡足八个小时 睡前写一篇博客 再做二十分钟俯卧撑暖身 然后再睡觉 基本能熟睡到天亮 像婴儿一样不留下任何疲劳和压力 就这样迎来第二天的早晨 健康检查结果也显示我很正常 我想说明我是一个不论何时都追求内心平稳的人 不拘泥于胜负 不纠结于烦恼 不树立使我夜不能寐的敌人 这就是我在这社会的生活态度
Follow Me公告
This is my Blog