js中三个对数组操作的函数 indexOf()方法 filter筛选 forEach遍历 map遍历
indexOf()方法
indexOf()方法返回在该数组中第一个找到的元素位置,如果它不存在则返回-。
不使用indexOf时
var arr = ['apple','orange','pear'],
found = false;
for(var i= , l = arr.length; i< l; i++){
if(arr[i] === 'orange'){
found = true;
}
}
console.log("found:",found);
使用后
var arr = ['apple','orange','pear'];
console.log("found:", arr.indexOf("orange") != -); //一直找,不返回,上面讲了没找到返回-1,所以不等于-1就是说一直找,找到返回布尔值true,没找到那个数组里面的值就返回false //去除重复元素并用sort排序
var arr = ['a','c','b','d','a','b']
var arr2 = [];
for(var i = ;i<arr.length;i++){
if(arr2.indexOf(arr[i])==-){
arr2.push(arr[i]);
}
}
arr2.sort();
console.log(arr2);//["a", "b", "c", "d"]
filter筛选
没有使用filter筛选的循环数组的写法
var arr = [
{"name":"apple", "count": 2},
{"name":"orange", "count": 5},
{"name":"pear", "count": 3},
{"name":"orange", "count": 16}
];
var newarr = [];
for(i=0,l=arr.length;i<l;i++){
if(arr[i].name==='pear'){
newarr.push(arr[i]);
}
}
console.log(newarr)
使用filter后的写法
var arr = [
{"name":"apple", "count": 2},
{"name":"orange", "count": 5},
{"name":"pear", "count": 3},
{"name":"orange", "count": 16}
]; var newArr = arr.filter(function(item){ //传入参数进行筛选,有就输出这组数据
return item.name === "pear";
});
console.log("Filter results:",newArr);
使用vue 中在 template 模板中使用方式
{{ (item.score === null || group.teams.filter(v => v.score === ).length === group.teams.length) ? '-' : item.score }}
forEach遍历与map遍历
不使用forEach便利的传统for写法
var arr = [1,2,3,4,5,6,7,8];
for(var i= 0, l = arr.length; i< l; i++){
console.log(arr[i]);
} 使用forEach便利
arr.forEach(function(item,index){ //forEach是用来替换for循环的
console.log(item);
}); // 这个不能像 map 一样 赋值 返回 例如 这样 直接报 undefined map 可以这么用
let newArr = arr.forEach(function(item,index){ //forEach是用来替换for循环的
return item
});
console.log(newArr)
var a = [1, 2, 3];
a.map(function (elemt) {
console.log(elemt); //结果 1 2 3
});
注意:forEach、map等函数只能便利数组的形式 如果里面是 json 键值对的形式存在 你可 先声明一个 Arr 数组对象
例如 let arr = [] 然后再把 获取到的 json 数据 push 进去 就可以正常的遍历了
最后多说一嘴 可用for of 替代 传统的forEach循环
js中三个对数组操作的函数 indexOf()方法 filter筛选 forEach遍历 map遍历的更多相关文章
- 5个数组Array方法: indexOf、filter、forEach、map、reduce使用实例
ES5中,一共有9个Array方法 Array.prototype.indexOf Array.prototype.lastIndexOf Array.prototype.every Array.pr ...
- 数组Array方法: indexOf、filter、forEach、map、reduce使用实例
- Node.js 中MongoDB的基本接口操作
Node.js 中MongoDB的基本接口操作 连接数据库 安装mongodb模块 导入mongodb模块 调用connect方法 文档的增删改查操作 插入文档 方法: db.collection(& ...
- 【转】千万不要在JS中使用连等赋值操作
原文链接 千万不要在JS中使用连等赋值操作 目录 前言 赋值顺序? 连续赋值能拆开写么? 后记 前言 文章标题这句话原本是在国外某JavaScript规范里看到的,当时并没有引起足够的重视,直到最 ...
- js中三种定义变量 const, var, let 的区别
js中三种定义变量的方式const, var, let的区别 1.const定义的变量不可以修改,而且必须初始化. 1 const b = 2;//正确 2 // const b;//错误,必须初始化 ...
- (转载)js数组中的find、filter、forEach、map四个方法的详解和应用实例
数组中的find.filter.forEach.map四个语法很相近,为了方便记忆,真正的掌握它们的用法,所以就把它们总结在一起喽. find():返回通过测试的数组的第一个元素的值 在第一次调用 c ...
- Java数组操作的10大方法
转载自码农网 译文链接:http://www.codeceo.com/article/10-java-array-method.html 英文原文:Top 10 Methods for Java Ar ...
- 应该用forEach改变数组的值吗? 原生JS forEach()和map()遍历的异同点
应该用forEach改变数组的值吗? https://segmentfault.com/q/1010000013170900?utm_source=index-hottest 由于js中的数组是引用类 ...
- vue.js 中使用(...)运算符报错的解决方法
vue.js 中使用(...)运算符报错的解决方法 Syntax Error:Unexpected token(XX:X) }, computed:{ ...mapGetters([ 'pageSiz ...
随机推荐
- iOS runtime的理解和应用
项目中经常会有一些的功能模块用到runtime,最近也在学习它.对于要不要阅读runtime的源码,我觉得仅仅是处理正常的开发,那真的没有必要,只要把常用的一些函数看下和原理理解下就可以了. 但是如果 ...
- 【iOS】小项目框架设计(ReactiveCocoa+MVVM+AFNetworking+FMDB)
上一个项目使用到了ReactiveCocoa+MVVM+AFNetworking+FMDB框架设计,从最初的尝试,到后来不断思考和学习,现在对这样一个整体设计还是有了一定了理解与心得.在此与大家分享下 ...
- 浅谈JSON数据解析方法
JSON数据解析 JSON是什么?? 如何把JSON数据解析出来 如何把一个字典转换为JSON JSON详细介绍 JSON(JavaScript Object Notation) 是一种轻量级的数据交 ...
- 打电话、发短信、web以及发邮件
#import "ViewController.h" #import <MessageUI/MessageUI.h> //导入信息UI库 @interface View ...
- IT行业常见职位职业路线图
我曾经面试过一些计算机相关毕业的应届生,问他希望做什么工作时,他回答只要是软件开发就好了,再细问一下你了解到的软件开发是怎样的?除了软件开发,还有其它什么工作?就答不出来了. 这里我先给出一张IT知识 ...
- 如何通过js跨域调用ASP.NET Web API (请问如何实现在javascript中通过http get的方式跨域调用ASP.NET Web API?)
客户端js无需任何专门设置,使用通常的ajax调用即可: $.ajax({ url: '跨域URL', type: 'get', dataType: 'json', success: function ...
- 天书笔记:如何创建一个现代的footer(页脚)
此笔记纯属本人脑残笔记,阅读困难不理解属正常现象,初学者尽量不要阅读,否则轻则口吐白沫重则走火入魔,切记切记 老规矩,效果图 这个布局也是从b站看到的,回来自己实现了一遍 HTML: <div ...
- 单元测试中如何配置log4net
按道理来说,单元测试中基本没有对于日志的需求,这是由于单元测试的定位来决定的. 因为单元测试的思想就是针对的都是小段代码的测试,逻辑明确,如果测试运行不通过,简单调试一下,就能很容易地排查问题.但是单 ...
- C#编写抽奖问题
输入每个人的中奖号码,进行滚动显示 //清屏 //随即一个索引 // 根据索引打印 //等待0.1秒 Console.Write("请输入参与者人数:&q ...
- Javascript之旅——第六站:看看writable特性
说起js中的那些特性标记,总觉得有些怪怪的,那为什么要说到这个attribute,起源于对一个问题的疑问,我们都知道window对象其实就是 浏览器窗口的一个实例,既然是一个实例,那这个实例就应该有“ ...