微信小程序数组
常用函数
concat(): 连接两个或多个数组,返回连接后的新数组。
示例:const arr1 = [1, 2, 3]; const arr2 = [4, 5, 6]; const arr3 = arr1.concat(arr2); // 返回 [1, 2, 3, 4, 5, 6] copyWithin(): 从数组指定位置开始替换指定长度的元素。
示例:const arr = [1, 2, 3, 4, 5]; arr.copyWithin(0, 3, 4); // 将数组 [4] 替换到数组起始位置,返回 [4, 2, 3, 4, 5] entries(): 返回一个数组迭代器,可以遍历数组中的键值对。
示例:const arr = [‘a’, ‘b’, ‘c’]; const iterator = arr.entries(); for (const [index, value] of iterator) { console.log(index, value); } // 输出:0 “a”, 1 “b”, 2 “c” every(): 检测数组中的所有元素是否符合指定条件,返回布尔类型的值。
示例:const arr = [1, 2, 3]; const result = arr.every((value) => value > 0); // result 为 true fill(): 用指定的值填充数组的所有元素。
示例:const arr = [1, 2, 3]; arr.fill(0); // 返回 [0, 0, 0] filter(): 返回一个新数组,包含符合条件的原数组元素。
示例:const arr = [1, 2, 3, 4]; const result = arr.filter((value) => value % 2 === 0); // 返回 [2, 4] find(): 返回数组中符合条件的第一个元素,否则返回 undefined。
示例:const arr = [1, 2, 3, 4]; const result = arr.find((value) => value > 2); // result 为 3 findIndex(): 返回数组中符合条件的第一个元素的索引,否则返回 -1。
示例:const arr = [1, 2, 3, 4]; const result = arr.findIndex((value) => value > 2); // result 为 2 flat(): 返回一个新数组,将多维数组拍平为一维数组。
示例:const arr = [1, [2, [3, 4]]]; const result = arr.flat(); // 返回 [1, 2, 3, 4] forEach(): 对数组中的每个元素执行指定的操作。
示例:const arr = [1, 2, 3]; arr.forEach((value, index) => { console.log(value, index); }); // 输出:1 0, 2 1, 3 2 includes(): 返回一个布尔值,表示数组中是否包含指定元素。
示例:const arr = [1, 2, 3]; const result = arr.includes(2); // result 为 true indexOf(): 返回数组中指定元素的第一个索引,如果不存在,返回 -1。
示例:const arr = [1, 2, 3]; const result = arr.indexOf(2); // result 为 1 join(): 将数组中的所有元素连接成一个字符串。
示例:const arr = [1, 2, 3]; const result = arr.join(); // 返回 “1,2,3” keys(): 返回一个数组迭代器,可以遍历数组的索引。
示例:const arr = [‘a’, ‘b’, ‘c’]; const iterator = arr.keys(); for (const index of iterator) { console.log(index); } // 输出:0, 1, 2 lastIndexOf(): 返回数组中指定元素的最后一个索引,如果不存在,返回 -1。
示例:const arr = [1, 2, 2, 3]; const result = arr.lastIndexOf(2); // result 为 2 map(): 返回一个新数组,每个元素都是对原数组中的元素执行指定操作后的结果。
示例:const arr = [1, 2, 3]; const result = arr.map((value) => value *
微信小程序中的数组有许多常用的方法和用法
模糊查询
var backendData = [];
// 定义一个方法来执行模糊查询
function fuzzySearch(keyword) {
// 使用 filter 方法筛选包含关键字的元素
const result = backendData.filter(item => {
// 检查 name 属性是否存在,并且是一个字符串
if (item.userName && typeof item.userName === 'string') {
// 将字符串都转为小写进行比较,实现不区分大小写的模糊查询
return item.userName.toLowerCase().includes(keyword.toLowerCase());
}
return false;
});
return result;
}
var list = [];
const searchResult = fuzzySearch(list);
精确查询
function exactSearch(keyword) {
const result = backendData.filter(item => {
if (item.userName && typeof item.userName === 'string') {
// 将字符串都转为小写进行比较,实现不区分大小写的精确查询
return item.userName.toLowerCase() === keyword.toLowerCase();
}
return false;
});
return result;
}
var list = [];
const searchResult = exactSearch(list);
---------------------------只比较整数类型的属性-----------------------------------
数组中找到对应的对象
//数组中找到对应的对象
let list = this.data.Teacher.find(item => item.userId === e.currentTarget.dataset.id); //list是对象
数组中找到满足指定条件的所有元素
let list = this.data.Teacher.filter(item => item.userId === e.currentTarget.dataset.id); //list是集合
数组中的每个元素克隆到一个新对象中,并给新对象添加一个新的字段
const modifiedList = this.data.list.map(item => {
// 给每一项添加一个新的字段
return {
...item,
static: 0
};
});
--------------------------------------------------------------------
let newList = this.data.prodectList.map(item => ({
...item,
static: 1
}));
--------------------------------------------------------------------
第二段代码使用了对象的展开运算符 ...,而第一段代码使用了传统的对象属性赋值方式。
两种方式都可以实现相同的效果,最终都会生成一个新的数组,其中包含原数组元素的深拷贝,并且在新对象中添加了新的字段。
如果你想将一个新的集合与旧的集合拼接在一起,并且当新集合中的数据的id与旧集合中的数据相同时进行过滤去除
// 假设旧集合为oldCollection,新集合为newCollection // 使用 Set 数据结构来保存旧集合中的id
const oldIds = new Set();
oldCollection.forEach(item => {
oldIds.add(item.id);
}); // 过滤新集合中与旧集合中相同id的数据
const filteredCollection = newCollection.filter(newItem => {
return !oldIds.has(newItem.id);
}); // 将过滤后的新集合与旧集合拼接在一起
const mergedCollection = oldCollection.concat(filteredCollection);
集合数据按时间(字段)重新排序
let sortedList = that.data.oldClassList.sort((a, b) => new Date(b.datetime) - new Date(a.datetime))
更新中 ----
微信小程序数组的更多相关文章
- 微信小程序数组对象
xml:<block wx:for="{{post_key}}" wx:for-item="{{item}}"></block> dat ...
- 微信小程序 数组索引 data-“”解释
按照官方最新文档循环的方式,索引值是以 wx:for-index="index" 方式写的, 以 parseInt(event.currentTarget.dataset.i ...
- 微信小程序-数组操作
Page({ data: { list:[{ id:, name:'芒果', count: },{ id:, name:'香蕉', count: }, }] } }) 向前插入数据 //要增加的数组 ...
- 微信小程序中如何使用setData修改数组或对象中的某一参数
本人也是刚开始接触微信小程序,在微信小程序中经常会遇到修改数组中某一项的值,比如array[0]或者是对象中object.item的值.这些值在微信小程序中都需要使用一个名为setData的方法,而这 ...
- 微信小程序setData复杂数组的更新、删除、添加、拼接
众所周知,微信小程序里所有对数据的修改只有在setData里修改才会在页面上渲染.在此分享小程序里复杂数组的更新.删除.添加.拼接 初始数据 数组嵌套对象 data: { cartList = [{ ...
- 微信小程序之数组操作:push与concat的区别
微信小程序中需要用到数组的操作,push和concat二者功能很相像,但有两点区别. 先看如下例子: var arr = []; arr.push(); arr.push(); arr.push([, ...
- 【微信小程序】数组操作
Page({ data: { list:[{ id:1, name:'应季鲜果', count:1 },{ id:2, name:'精致糕点', count:6 },{ id:3, name:'全球美 ...
- 微信小程序前端源码逻辑和工作流
看完微信小程序的前端代码真的让我热血沸腾啊,代码逻辑和设计一目了然,没有多余的东西,真的是大道至简. 废话不多说,直接分析前端代码.个人观点,难免有疏漏,仅供参考. 文件基本结构: 先看入口app.j ...
- 微信小程序开发日记——高仿知乎日报(中)
本人对知乎日报是情有独钟,看我的博客和github就知道了,写了几个不同技术类型的知乎日报APP要做微信小程序首先要对html,css,js有一定的基础,还有对微信小程序的API也要非常熟悉 我将该教 ...
- 微信小程序开发初探
一.关于微信小程序 1.1 小程序诞生的背景 张小龙说道: (1)一切以用户价值为依归→用户是微信的核心,所以微信中没有很多与客户无关的功能,比如QQ中的乱七八糟一系列东西. (2)让创造发挥价值→所 ...
随机推荐
- MySQL系列之主从复制基础——企业高可用性标准、主从复制简介、主从复制前提(搭建主从的过程)、主从复制搭建、主从复制的原理、主从故障监控\分析\处理、主从延时监控及原因
文章目录 0.企业高可用性标准 *** 0.1 全年无故障率(非计划内故障停机) 0.2 高可用架构方案 1. 主从复制简介 ** 2. 主从复制前提(搭建主从的过程) *** 3. 主从复制搭建(C ...
- VideoCapture
from xgoedu import XGOEDU import time #实例化edu XGO_edu = XGOEDU() XGO_edu.lcd_text(50,50,'hello',colo ...
- 若依(ruoyi)开源系统保姆级实践-完成第一个页面
一.案例描述 若依官网文档地址:http://doc.ruoyi.vip/ruoyi/document/hjbs.html 本教程主要内容,自定义数据库表,使用若依开源系统生成代码并配置权限. 若依环 ...
- Kubernetes集群管理面板的安装及使用
Kubernetes集群管理面板的安装及使用 1.前言 若海的腾讯云Lighthouse组建跨地域Kubernetes集群,让我成功体验到了Kubernetes集群诸多优点,但是非技术出生的我,长时间 ...
- Intervals 题解
Intervals 题目大意 给定 \(m\) 条形如 \((l_i,r_i,a_i)\) 的规则,你需要求出一个长为 \(n\) 的分数最大的 01 串的分数,其中一个 01 串 \(A\) 的分数 ...
- 微软发布开源平台 Radius:高效构建、运行基于Dapr 云原生应用程序
Microsoft Azure 孵化团队很高兴地宣布[1]推出一个名为 Radius 的新开放应用程序平台,该平台将应用程序置于每个开发阶段的中心,重新定义应用程序的构建.管理和理解方式.Radius ...
- ceph的应用
创建 CephFS 文件系统 MDS 接口 -------------------- 创建 CephFS 文件系统 MDS 接口 -------------------- //服务端操作 1)在管理节 ...
- TerraMoursGPT V1.0 开发总结
TerraMoursGPT V1.0 开发总结 TerraMoursGPT V1.0 是之前gpt项目基于TerraMours后端框架的重构,实现用户登陆和基于SK的多语言模型聊天.基于chatgpt ...
- 聊聊RNN与Attention
RNN系列: 聊聊RNN&LSTM 聊聊RNN与seq2seq attention mechanism,称为注意力机制.基于Attention机制,seq2seq可以像我们人类一样,将&quo ...
- oceanbase 标量子查询等价改写(复杂)
OB一哥们找我优化条SQL,反馈在OceanBase执行时间很慢需要 3184s才能出结果,安排. 原SQL: select M.POLICY_CHARGE_ID as policyChargeId, ...