前端工作常见数组数据处理的一些场景总结

一.对于数组进行修饰返回一个新的数组;

01.描述。

我们工作常常会发现后端传过来的数据有些不仅仅键值为空,甚至都没有键,也就是我们常说的属性名,那我们就需要去修改一下,返回一个结构正常的数据;

02.代码。

const data = [{ id: 1, name: 'John' ,age:''},{ id: 2 },{ name: 'Jane' },{ id: 3, age: 30 }
];
const filteredData = data.map(item => ({...item, id: item.id || '不存在',age:item.age||'不存在啊1'}));

03.总结。

使用map是一个很方便的数组方法,可以return一个新的数组,代码量大大减少,初学对于map不太了解的话,可以查看一下es6的语法,对于一下forEach两者的区别。

二.对于数组元素进行判断,元素是否为空字符。

01.场景藐视。

比如说在默写情况,需要对于一些数据进行判断,全部的数据元素不能为空字符串,必须有内容才能往接口传参。

02.代码实现。

const data = [{ id: 1, name: 'John' ,age:''},{ id: 2 },{ name: 'Jane' },{ id: 3, age: 30 }];let tag = ''const ss = ['id','name','age']for(let i=0;i<data.length;i++){for(let j=0;j<ss.length;j++){if(data[i][ss[j]]===''){tag = truebreak}}}console.log(tag);

03.总结。

双重for循环是工作中非常常用的,必须重视。

路过的大咖,喜欢的话点个赞!万分感谢!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/20029.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

iOS——Block two

Block 的实质究竟是什么呢&#xff1f;类型&#xff1f;变量&#xff1f;还是什么黑科技&#xff1f; Blocks 是 带有局部变量的匿名函数 Blocks 由 OC 转 C 源码方法 在项目中添加 blocks.m 文件&#xff0c;并写好 block 的相关代码。打开「终端」&#xff0c;执行 cd XX…

k8s新建集群官方指导文档

官方文档可能标的不清晰&#xff0c;在create cluster里面没有给具体怎么操作。 他主要是用这个kubeadm插件来进行新建集群的&#xff0c;我问过网站作者。 官方的tutorial在这里&#xff0c;其实还是步骤蛮多的。

[C++]01.基础,数据类型,运算符

01.基础,数据类型,运算符 一.C基础入门1.HelloWorld2.注释3.变量4.常量5.关键字6.命名规则 二.数据类型1.整形2.sizeof关键字3.浮点型4.字符型5.转义字符6.字符串型7.布尔类型8.数据的输入 三.运算符1.算数运算符2.赋值运算符3.比较运算符4.逻辑运算符 一.C基础入门 1.HelloWo…

Ubuntu新装系统报错:sudo: vim:找不到命令

问题&#xff1a; 新安装的老版本Ubuntu系统&#xff0c;发现在使用vim命令的时候报错&#xff1a; sudo&#xff1a;vim&#xff1a;找不到命令 解决办法 这是因为没有安装vim&#xff0c;直接运行下面命令安装vim sudo apt-get install vim

webshell详解

Webshell详解 一、 Webshell 介绍二 、 基础常见webshell案例 一、 Webshell 介绍 概念 webshell就是以asp、php、jsp或者cgi等网页文件形式存在的一种命令执行环境&#xff0c;也可以将其称做为一种网页后门。黑客在入侵了一个网站后&#xff0c;通常会将asp或php后门文件与…

Eureka 学习笔记4:客户端 DiscoveryClient

版本 awsVersion ‘1.11.277’ DiscoveryClient # cacheRefreshTask // 配置shouldFetchRegistry if (clientConfig.shouldFetchRegistry()) {// 配置client.refresh.intervalint registryFetchIntervalSeconds clientConfig.getRegistryFetchIntervalSeconds();// 配置expB…

【普通人维护windows的方法,不中毒,不弹窗,不卡顿】

前言 IT人也是普通人&#xff0c;我就说说普通人维护电脑的方法。 我的电脑配置 给大家看看&#xff0c;配置一般&#xff0c;运行软件和游戏&#xff0c;可以保持基本流程 日常维护措施 我不太喜欢设定一些非主流的配置&#xff0c;下了一个360卫士,360其他的套餐可以不用下…

跨站脚本攻击(XSS)

1 什么是XSS跨站脚本攻击问题? XSS是跨站脚本攻击(Cross Site Scripting)&#xff0c;为不和层叠样式表(Cascading Style Sheets,CSS)的缩写混淆&#xff0c;故将跨站脚本攻击缩写为XSS。恶意攻击者往Web页面里插入恶意Script代码,当用户浏览该页之时&#xff0c;嵌入其中Web…

数据结构——绪论

一、绪论 &#xff08;一&#xff09;基本概念 数据&#xff1a;数据是对客观事物的符号表示&#xff0c;在计算机科学中是指所有能输入到计算机中并被计算机程序处理的符号的总称。 数据元素&#xff1a;数据元素是数据的基本单位&#xff0c;在计算机程序中通常作为一个整…

js实现按照句号将一段文本进行分段

/*** 将给定的文本按照300字并且按照句号分为多个p标签** param text 给定的文本* returns 返回分割后的多个p标签的数组*/ function splitTextByParagraph(text) {// 将文本按照句号分割成多个句子const sentences text.split(。);// 初始化一个空数组来存储生成的p标签const…

【Nginx】nginx配置跳转实现接口静态化

1.配置nginx跳转到oss静态化地址&#xff1b; 2.oss bucket配置回源到服务端接口&#xff1b; 3.服务端接口有处理oss bucket回源地址&#xff0c;按规则拼装完整url以后redirect; 4.服务端需要提供清理oss文件的接口&#xff1b; 5.静态化域名配置&#xff1a;域名解析到O…

Nodejs中的全局对象

今天我们将探讨Nodejs中的全局对象&#xff0c;这是Nodejs中重要且有趣的知识点。我们将通过生动形象的例子和风趣的风格来深入理解这些概念&#xff0c;并比较Nodejs中的全局对象与前端JavaScript中的全局对象之间的异同点。 全局对象是什么&#xff1f; 在Nodejs环境中&…

超详细|ChatGPT辅助论文编写教程

本教程讲述在论文编写中使用ChatGPT进行辅助&#xff0c;提供思路&#xff0c;提升效率 祝看到本教程的小伙伴们都完成论文&#xff0c;顺利毕业。 可以加QQ群交流&#xff0c;一群&#xff1a; 123589938 第一章 论文框架搭建 1.1 明确论文题目 1.1.1 适合的研究方向 首先赋…

springboot多数据源根据开关控制方法访问的数据源

有个需求需要通过开关控制需要访问的数据源&#xff0c;此处参考DS多数据源&#xff0c;采用注解加aop切面实现此功能。 配置文件开关&#xff1a; slave-config:mainSlaveSwitch: true 配置开关类&#xff1a; Component RefreshScope Data ConfigurationProperties("…

STM32 低功耗-睡眠模式

STM32 睡眠模式 文章目录 STM32 睡眠模式第1章 低功耗模式简介第2章 睡眠模式简介2.1 进入睡眠模式2.1 退出睡眠模式 第3章 睡眠模式代码示例总结 第1章 低功耗模式简介 在 STM32 的正常工作中&#xff0c;具有四种工作模式&#xff1a;运行、睡眠、停止和待机模式。 在系统或…

20. 有效的括号

20. 有效的括号 题目-简单难度示例1. if-else2. 优化3. 字典栈 题目-简单难度 给定一个只包括 ‘(’&#xff0c;‘)’&#xff0c;‘{’&#xff0c;‘}’&#xff0c;‘[’&#xff0c;‘]’ 的字符串 s &#xff0c;判断字符串是否有效。 有效字符串需满足&#xff1a; 左括…

动态规划之树形DP

动态规划之树形DP 树形DP何为树形DP 树形DP例题HDU-1520 Anniversary partyHDU-2196 Computer834. 树中距离之和 树形DP 何为树形DP 树形DP是指在“树”这种数据结构上进行的动态规划&#xff1a;给出一颗树&#xff0c;要求以最少的代价&#xff08;或取得最大收益&#xff…

rust学习-构建服务器

单线程server 服务器会依次处理每一个请求&#xff0c;在完成第一个连接的处理之前不会处理第二个连接 // cat main.rs use std::io::prelude::*; use std::net::TcpListener; use std::net::TcpStream;fn main() {let listener TcpListener::bind("127.0.0.1:7878&quo…

uniapp app端 echarts 设置tooltip的formatter不生效问题以及解决办法

需求一&#xff1a; y轴数据处理不同数据增加不同单位 需求二&#xff1a; 自定义图表悬浮显示的内容 需求一&#xff1a;实现方式 在yAxis里面添加formatter yAxis: [{//y轴显示value的设置axisLabel: {show: true,formatter (value, index) > {var valueif (value > 1…

怎么让表格中的一行数据 转置 为一列数据 (WPS )

例如 我现在有一列数据 我想要 变成一行 数据 1.首先选中想要转置的数据&#xff0c;然后control C 2.接着 点击你想放置数据的位置 右键 其实 关键是 找到 选择性复制 3. 找到转置&#xff0c;勾选 最后 确定 反之亦然