js中数组对象根据内容查找符合的第一个对象
今天在写一个混合开发版的app,其中一个功能是扫描快递单号,客户要求不能扫描重复的快递单号!所有就验证查出。
首先实现思路就是:
1.定义一个全局数组变量:var nubList = [];
2.进入该扫描页面先查找已扫描的数据。
3.扫描快递单号成功回调里根据当前扫描结果查重。存在择提示已存在。不存在择进行添加快递单列表。
这就是一个简单的实现思路。本篇不是一个什么记录就是一个随笔记录。
以前我查重大多是使用循环进行遍历对比。下面是我这次使用的数组示例find方法。
数组示例find:用于查找数组中第一个符合条件的对象返回。其实实现原来也是每个数组元素对比遍历,这个方法传进去一个回调函数,元素依次调用回调函数(可能看起来爽吧)。
var nubList = [{
expressId: "00001", //快递单号ID
expressNum: "数据1"
},
{
expressId: "00002", //快递单号ID
expressNum: "数据2"
},
{
expressId: "00003", //快递单号ID
expressNum: "数据3"
},
{
expressId: "00004", //快递单号ID
expressNum: "数据4"
},];
//增加单号查重操作
if(nubList.find(function(x) {
return x.expressId == result;
}) != undefined) {
mui.alert("该快件已经录入!", function() {
//重新开启继续扫描
scan.start();
})
return;
}
注意其中nubList.find(function(x) {return x.expressId = result;}) 就是查询结果了。如果查询不到择返回undefined
小技巧:
最后我在补充几个小方法(从官网看到的比较常用的):
findIndex:查找第一个符合元素的位置(注意是位置不是元素);arr.findIndex(v,index,arr){}
reverse:将数组元素位置倒置。简单来说就是反转一下,第一个成最后一个,最后一个成第一个。
join:将数组连接到一个字符串中。此方法也可以传入分割参数
var a=["one","two","three"]
a.join("|");
//"one|two|three" 结果
splice:在指定位置添加/修改元素;简单理解就是没有就添加,存在就删除替换调。arr.splice(开始位置,移除数目,元素)
push:再远末尾插入元素。
扩展数组根据指定元素删除:
//扩展数组删除
Array.prototype.indexOf = function (val) {
for (var i = 0; i < this.length; i++) {
if (this[i] == val) return i;
}
return -1;
}; Array.prototype.remove = function (val) {
var index = this.indexOf(val);
if (index > -1) {
this.splice(index, 1);
}
};
2018-07-31补充
今天再次使用到这个方法,但是不同的是我需要在ie下进行兼容测试,不幸的是还真的就不通过,提示“对象不支持“find”属性或方法”。不行那就不用吧,我们换个:filter
在数组处理上filter和find实现的功能是类似的。所有如果是在ie下使用请切换成filter方法:nubList.filter(function(x) {return x.expressId = result;})
在元素筛选上filter是对自身的查找,find是对子集的查找。例如:
<div class="css">
<p class="test">测试1</p>
</div>
<div class="test">
<p >测试2</p>
</div>
然后分别查询:
filter=>$("div").filter(".test") 输出结果是:“<p >测试2</p>”
find=>$("div").filter(".test") 输出结果是:测试1
js中数组对象根据内容查找符合的第一个对象的更多相关文章
- 【前端】js中数组对象根据内容查找符合的第一个对象
今天在写一个混合开发版的app,其中一个功能是扫描快递单号,客户要求不能扫描重复的快递单号!所有就验证查出. 首先实现思路就是: 1.定义一个全局数组变量:var nubList = []; 2.进入 ...
- JS中数组对象去重
JS数组去重 JS中对数组去重最好不要用unique方法,该方法主要是对dom节点数组的去重,如果对普通的数组元素去重只会去掉与之相邻的重复元素,也就是如果数组中还有不相邻的重复元素存在,将不会被去掉 ...
- js 中数组对象的定义赋值 以及方法
1.定义数组 var m=new Array(); var n=[]; 2.数组的赋值(两种) A. var m=new Array(2); 一个值表示数组length var m=new Array ...
- js中数组对象去重的方法
var arr = [{ key: '01', value: '乐乐' }, { key: '02', value: '博博' }, { key: '03', value: '淘淘' },{ key: ...
- JavaScript中数组对象详解
Array对象即数组对象用于在单个变量中存储多个值,JS的数组是弱类型的,所以允许数组中含有不同类型的元素,数组元素甚至可以是对象或者其他数组. 创建数组的语法 1.Array构造器 1.var li ...
- JS中数组的介绍
一.数组: 一组数据的集合: 二.JS中数组的特点: 1.数组定义时无需指定数据类型: 2.数组定义时可以无需指定数组长度: 3.数组可以存储任何类型的数据: 4.一般是相同的数据类型: 三.数组的创 ...
- 浅解析js中的对象
浅解析js中的对象 原文网址:http://www.cnblogs.com/foodoir/p/5971686.html,转载请注明出处. 前面的话: 说到对象,我首先想到的是每到过年过节见长辈的时候 ...
- js中遍历对象的属性和值
今天想看一下js的数组遍历的内容,搜索到了一个关于对象遍历写好的函数,保留一下.以后好用. function allPrpos ( obj ) { // 用来保存所有的属性名称和值 var p ...
- JS中有关对象的继承以及实例化、浅拷贝深拷贝的奥秘
一.属性的归属问题 JS对象中定义的属性和方法如果不是挂在原型链上的方法和属性(直接通过如类似x的方式进行定义)都只是在该对象上,对原型链上的没有影响.对于所有实例共用的方法可直接定义在原型链上这样实 ...
随机推荐
- Objective-c 多线程操作 自定义NSOperation 模拟下载
写在前面 使用多线程下载图片,使用内存缓存和磁盘缓存. 这里只为理解NSOperation及其派生类 真要应用到APP中 请下载成熟的第三方库 效果 下载多张图片时可控制线程并发数 分析 自定义NSO ...
- AC自动机总结及板子(不带指针)
蒟蒻最近想学个AC自动机简直被网上的板子搞疯了,随便点开一个都是带指针的,然而平时用到指针的时候并不多,看到这些代码也完全是看不懂的状态.只好在大概理解后自己脑补(yy)了一下AC自动机的代码,居然还 ...
- Android开发之监听器
一直都想进行安卓开发,最近上手了Android.刚开始学习一些基本控件,学习Android就如同进入一个新的世界,印象最深的是这个世界的规则. 最近学习了监听器,对于这个我的一点理解是监听键盘活动 B ...
- Android Binder机制详解:手写IPC通信
想要掌握一样东西,最好的方式就是阅读理解它的源码.想要掌握Android Binder,最好的方式就是写一个AIDL文件,然后查看其生成的代码.本文的思路也是来自于此. 简介 Binder是Andro ...
- python-插入排序
所谓插入排序,就是检查第i个数字,若比它的左边的数字小,则进行交换,一直持续这个动作,直到它的左边的数字比它还要小,则停止. #coding:utf-8def insertion_sort(nums) ...
- CVE-2016-3714 - ImageMagick 命令执行
ImageMagick是一款使用量很广的图片处理程序,很多厂商都调用了这个程序进行图片处理,包括图片的伸缩.切割.水印.格式转换等等.但近来有研究者发现,当用户传入一个包含『畸形内容』的图片的时候,就 ...
- Git时光机穿梭
我们已经成功地添加并提交了一个readme.txt文件,现在,是时候继续工作了,于是,我们继续修改readme.txt文件,改成如下内容: Git is a distributed version c ...
- [技术]浅谈OI中矩阵快速幂的用法
前言 矩阵是高等代数学中的常见工具,也常见于统计分析等应用数学学科中,矩阵的运算是数值分析领域的重要问题. 基本介绍 (该部分为入门向,非入门选手可以跳过) 由 m行n列元素排列成的矩形阵列.矩阵里的 ...
- POJ--1088--dp--滑雪
#include<iostream> using namespace std; ; }; }; int dp(int,int); int row,col; int main() { whi ...
- IE浏览器-官网下载地址
这里仅列出IE浏览器在微软官网的下载地址,便于日常使用. WindowsXP | IE6下载地址:http://www.microsoft.com/zh-CN/download/details.asp ...