[Vue]中数组的操作用法

列举了在Vue操作数据时,对数组的一些方法

1.增加功能

在数组尾部增加 push()

push():向数组的末尾添加一个或更多元素,并返回新的长度。

arr = [1,2,3,4,5]
arr.push(6) 
//arr [1,2,3,4,5,6]
在数组头部增加 unshift()

unshift():向数组的开头添加一个或更多元素,并返回新的长度。

arr = [1,2,3,4,5]
arr.unshift(0) 
//arr [0,1,2,3,4,5]

2.删除功能

删除数组尾部 pop()

pop():删除并返回数组的最后一个元素。

arr = [1,2,3,4,5]
num = arr.pop() 
// arr [1,2,3,4] 
// num 5
删除数组头部 shift()

shift():删除并返回数组的第一个元素。

arr = [1,2,3,4,5]
num = arr.shift() 
// arr [2,3,4,5] 
// num 1
满足某个条件的删除

可以用filter():创建一个新数组,其包含通过所提供函数实现的测试的所有元素。

arr = [1,2,3,4,5]
//不包含3
arr = arr.filter(item=>
 return item!=3
) 
//arr [ 1, 2, 4, 5 ]

3.数据求和 reduce()

reduce():对累加器和数组中的每个元素(从左到右)应用一个函数,将其减少为单个输出值。

arr = [1,2,3,4,5]
//所有数求和
num = arr.reduce((total,item)=>{ 
            return total + item
        } ,0)    
// num 15
// 有条件进行求和
// 对>2的值进行求和
arr = [1,2,3,4,5]
num = arr.reduce((total,item)=>{ 
    if(item>2){ 
        return total+item 
    }else{ 
        return total 
    }},0)
//num 12

4.修改

4.1 forEach()

forEach():对数组的每个元素执行一次提供的函数。

arr = [1,2,3,4,5]
//每个数都+1
arr.forEach((value,index,array)=>{ 
    array[index] = value +1
})
// arr = [2, 3, 4, 5, 6]
4.2 map()

map():创建一个新数组,其结果是该数组中的每个元素都调用一个提供的函数后的返回值。

arr = [1,2,3,4,5]
arr1=arr.map((item)=>{ 
    return item+1
})
// 原数组 arr = [1,2,3,4,5]
// 新数组 arr1 = [2, 3, 4, 5, 6]

5.查询

查找某个元素 find()

find():查找某个元素

arr = [1, 2, 3, 4, 5]
var num = arr.find(item => { 
    return item == 2
})
//num 2
查找某个元素的下标 findIndex()

findIndex():查找某个元素对应的index

arr = [1,2,3,4,5]
var index = arr.findIndex(item=>{ 
    return item == 2
})
//index 1
判断是不是存在某个元素满足某个条件 some()

some():判断是不是存在某个元素满足某个条件

arr = [1,2,3,4,5]
var a = arr.some(item=>{ 
    return item>3
})
// a true
判断是不是每个元素都满足某个条件 every()

every():判断是不是每个元素都满足某个条件

arr = [1,2,3,4,5]
var a = arr.every(item=>{ 
    return item>3
})// a false

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

机器学习--循环神经网络(RNN)4

一、RNN的学习方式 如果要做学习,需要定义一个损失函数(loss function)来评估模型的好坏,选一个参数要让损失最小。 以槽填充为例,如上图所示,给定一些句子,给定一些标签,告诉机器…

【软件工程导论】——软工学绪论及传统软件工程(学习笔记)

📖 前言:随着软件产业的发展,计算机应用逐步渗透到社会生活的各个角落,使各行各业都发生了很大的变化。这同时也促使人们对软件的品种、数量、功能和质量等提出了越来越高的要求。然而,软件的规模越大、越复杂&#xf…

测试环境搭建整套大数据系统(九:docker学习)

一:为什么学习dockder? 对于组件的搭建和部署,可以简化。 二:什么是docker? docker是一个平台。 三:怎么使用docker? 1. 安装,切换仓库。 安装 curl -fsSL https://test.docke…

[java基础揉碎]继承

为什么需要继承: > 继承就可以解决代码复用的问题 继承的基本介绍: 继承的使用细节: 1.子类继承了所有的属性和方法,但是私有属性和方法不能在子类直接访问,要通过公共的方法去访问 解决, 提供公共的方法返回: 2.子类必须调用父类的构造器,完成父…

CACLP预告 | 飞凌嵌入式与您相约山城重庆

第二十一届中国国际检验医学暨输血仪器试剂博览会(CACLP)将于2024年3月16日-18日在重庆国际博览中心举行。本次会议将探讨科技创新趋势,展示最新成果,发现和挖掘颠覆性技术和创新产品,引领实验医学体外诊断科技创新和未…

利用IP地址信息提升网络安全

在计算机网络中,IP地址是用于唯一标识网络设备的重要标识符。然而,由于网络中存在大量设备,有时会出现IP地址冲突的情况,即两个或多个设备在同一网络中使用了相同的IP地址,这可能导致网络连接故障和通信中断。本文将介…

机器学习开源分子生成系列(1)-DeepFrag的本地部署及使用

欢迎浏览我的CSND博客! Blockbuater_drug …进入 文章目录 前言一、DeepFrag是什么?二、conda中安装DeepFrag CLI环境1. 创建环境并激活2. 下载pre-trained model3. DeepFrag CLI 使用方法必需参数:可选参数: 4. DeepFrag CLI 使用…

R语言基础的代码语法解译笔记

1、双冒号,即:“::” 要使用某个包里的函数,通常做法是先加载(library)包,再调用函数。最新加载的包的namespace会成为最新的enviroment,某些情况下可能影响函数的结果。而package name::funct…

excel统计分析——重复测量设计

参考资料:生物统计学 裂区设计中的裂区通常是指空间上的裂区,如果对试验指标进行连续测量时,时间也可以作为裂区因素。重复测量设计实际上就是时间裂区设计。进行试验结果的统计分析时,将试验因素作为主区,时间因素作为…

HTML—基本介绍

HTML是一种超文本标记语言(HyperText Markup Language),用于创建网页的标记语言超文本:是指页面内可以包含图片、链接、声音、视频等内容标记:HTML富含大量的标签供程序员使用,通过标记符号来规定指定内容的样式 浏览器最终根据不…

问题解决 | vscode无法连接服务器而ssh和sftp可以

解决步骤 进入家目录删除.vscode-server rm -rf .vscode-server 然后再次用vscode连接服务器时,会重新安装,这时可能报出一些缺少依赖的错 需要联系管理员安装相关依赖,比如 sudo apt-get install libstdc6 至此问题解决

C.C语言初步认识

文章目录 一. 什么是C语言 二. 第一个C程序解读 三. 数据类型 四. 变量常量 4.1. 定义变量的方法 4.2. 变量的分类 4.3. 变量的使用 4.4. 变量的作用域和生命周期 4.5. 常量分类 五. 字符串 六. 转义字符 七. 注释 八. 选择语句 九. 循环语句 十. 函数 十一. 数…

ubuntu18.04编译OpenCV-3.4.19+OpenCV_contrib-3.4.19

首先确保安装了cmake工具 安装opencv依赖文件 sudo apt-get install build-essential sudo apt-get install git libgtk-3-dev pkg-config libavcodec-dev libavformat-dev libswscale-dev sudo apt-get install python3-dev python3-numpy libtbb2 libtbb-dev libjpeg-dev li…

机器学习——分类问题、logistic分类算法

之前我们学习的线性回归算法,适用于预测值y为连续值的情况下,但是在分类问题中,预测值y是个离散值,所以线性回归算法不适用。在这篇文章中,主要以二分类问题为例,介绍分类算法————logistic回归算法&…

Elasticsearch:什么是 DevOps?

DevOps 定义 DevOps 是一种现代软件开发方法,它将公司软件开发 (Dev) 和 IT 运营 (Ops) 团队的工作结合起来并实现自动化。 DevOps 提倡这样一种理念:这些传统上独立的团队在协作方面比在孤岛中更有效。 理想情况下,DevOps 团队共同努力改进…

【Web】浅聊Java反序列化之C3P0——不出网Hex字节码加载利用

目录 简介 原理分析 EXP 前文:【Web】浅聊Java反序列化之C3P0——URLClassLoader利用 简介 不出网的情况下,这个C3P0的Gadget可以和fastjson,Snake YAML , JYAML,Yamlbeans , Jackson,Blazeds,Red5, Castor等配合使用(调用setter和初始化…

基于卷积神经网络的野外可食用植物分类系统

温馨提示:文末有 CSDN 平台官方提供的学长 QQ 名片 :) 1. 项目简介 本文详细探讨了一基于深度学习的可食用植物图像识别系统。采用TensorFlow和Keras框架,利用卷积神经网络(CNN)进行模型训练和预测,并引入迁移学习模型…

.NET开源的两款第三方登录整合库

前言 我相信做开发的同学应该都对接过各种各样的第三方平台的登录授权,来获取用户信息(如:微信登录、支付宝登录、QQ登录、GitHub登录等等)。今天大姚分享两款.NET开源的第三方登录整合库。 MrHuo.OAuth MrHuo.OAuth是.NET项目…

加密与安全_PGP、OpenPGP和GPG加密通信协议

文章目录 PGPOpenPGPGPG工作原理工作流程用途案例说明过程 代码实现pom依赖PgpEncryptionUtilPgpDecryptionUtilCommonUtilsPgpEncryptionTest 小结 PGP PGP (Pretty Good Privacy) 是一种加密通信协议,用于保护电子邮件和文件的安全性和隐私。它通过使用加密、数字…

flink实战--Flink任务资源自动化优化

背景 在生产环境Flink任务资源是用户在实时平台端进行配置,用户本身对于实时任务具体配置多少资源经验较少,所以存在用户资源配置较多,但实际使用不到的情形。比如一个 Flink 任务实际上 4 个并发能够满足业务处理需求,结果用户配置了 16 个并发,这种情况会导致实时计算资…
最新文章