ES6中的数组常用方法
数组在JS中虽然没有函数地位那么高,但是也有着举足轻重的地位,下面我就结合这ES5中的一些常用的方法,与ES6中的一些方法做一些说明和实际用途。大家也可以关注我的微信公众号,蜗牛全栈。
一、ES5中数组常用方法:
1、循环遍历。
1 let arr = [1,2,3]
2 for(let i=0;i<arr.length;i++){
3 console.log(i) // 1 2 3
4 }
2、forEach:没有返回值,不能使用break和continue。只是针对每个元素调用Func。
let arr = [1,2,3]
// elem 数组里面的每一项
// index 数组索引
// array 数组
arr.forEach(function(elem,index,array){
console.log(elem,index) // 1 0 2 1 3 2
})
3、map:返回新数组,每个元素为调用Func后的结果。
let arr = [1,2,3]
let result = arr.map(function(val){
val += 1
return val
})
console.log(arr,result) // [1,2,3] [2,3,4]
4、filter:返回符合Func条件的元素数组。
let arr = [1,2,3]
let result = arr.filter(function(val){
return val == 2
})
console.log(arr,result) // [1,2,3] [2]
5、some:返回布尔值,判断是否有元素符合Func条件(有一个满足条件就返回true)。
let arr = [1,2,3]
let result = arr.some(function(val){
return val == 2
})
console.log(arr,result) // [1,2,3] true
6、every:返回布尔值,判断每个元素符合Func条件(全部满足条件才返回true)。
let arr = [1,2,3]
let result = arr.every(function(val){
return val == 2
})
console.log(arr,result) // [1,2,3] false
7、reduce:接收函数作为一个累加器
7-1:累加器
let arr = [1,2,3]
// prev为前一个对象
// cur为当前对象
// index为当前序列
// arr为当前数组
let sum = arr.reduce(function(prev,cur,index,arr){
return prev + cur
},0)
console.log(sum) // 6
7-2、获取数组中最大值。
let arr = [1,2,3]
let max = arr.reduce(function(prev,cur){
Math.max(prev,cur)
})
console.log(max) // 3
7-3、数组去重
let arr = [1,2,3,3]
let res = arr.reduce(function(prev,cur){
prev.indexOf(cur) == -1 && prev.push(cur)
return prev
},[])
console.log(res) // [1,2,3]
8、for...in:遍历数组的时候会将原型下面函数遍历
Array.prototypr.foo = function(){
console.log("foo")
}
let arr = [1,2,3]
for(let index in arr){
console.log(index) // 遍历数组同样会遍历原型下面的函数foo
}
二、ES6中数组常用方法
1、find:返回第一个通过测试的元素
let arr = [1,2,3,4]
let res = arr.find(function(val){
return val > 2
})
console.log(res) // 3
2、findIndex:返回第一个通过测试的元素对应索引
let arr = [1,2,3,4]
let res = arr.find(function(val){
return val > 2
})
console.log(res) // 2
3、for...of
let arr = [1,2,3,4]
for(let item of arr){
console.log(item) // 1 2 3 4
}
3-1、values:仅遍历值
let arr = ["a","b","c","d"]
for(let item of arr.values()){
console.log(item) // "a" "b" "c" "d"
}
3-2、keys:仅遍历index
let arr = ["a","b","c","d"]
for(let item of arr.keys()){
console.log(item) // 0 1 2 3
}
3-3、entries:遍历index和值
let arr = ["a","b","c","d"]
for(let item of arr.entries){
console.log(item) // [0, "a"] [1, "b"] [2, "c"] [3, "d"]
}
ES6中的数组常用方法的更多相关文章
- ES6中的数组
数组是js中很重要的数据类型,虽然在 ES5 中,关于数组的方法和属性很多.但为了更加简洁.高效的操作数组,ES6 中又在数组原型上和实例上新增了一些方法. 一.Array方法 1.1 Array.f ...
- ES6中的数组方法扩展
上一篇文章小编简单介绍了在ES6中,一些常用的方法和一些简单的应用,在这篇文章中,小编将针对ES6中数组常用方法进行扩展,相信经过这篇文章之后,每一位小伙伴下班时间会有所提前,就算从原来的996变成9 ...
- ES6中对数组的扩展
hello,大家好,我又来了. 前面讲了字符串和数值的扩展,今天要讲的是:数组的扩展.不知道大家能否跟得上这个节奏,你们在阅读中对讲解有存在疑惑,记得留言提出来,要真正地理解,否则白白 ...
- ES6中的数组reduce()方法详解
reduce() 方法对数组中的每个元素执行一个由我们提供的reducer函数(升序执行),将其结果汇总为单个返回值. 1. 语法reduce说明 arr.reduce(callback(accumu ...
- ES6中有关数组的一些新操作
1.Array.isArray() 用于确定传递的值是否是一个 Array. Array.isArray([1, 2, 3]); // true Array.isArray({foo: 123}); ...
- es5和es6中查找数组中的元素
let array = [1,2,3,4,5] //es5 let find = array.filter(function (item){ return item %2 === 0//返回满足条件的 ...
- 利用ES6中的Array.find/ Array.findIndex来判断数组中已存在某个对象
前端开发过程中,我们会经常遇到这样的情景:比如选中某个指标obj,将其加入到数组checkedArr中({id: 1234, name: 'zzz', ...}),但是在将其选中之前要校验该指标是否已 ...
- ES6中数组新增的方法-超级好用
Array.find((item,indexArr,arr)=>{}) 掌握 找出第一个符合条件的数组成员. 它的参数是一个回调函数,对所有数组成员依次执行该回调函数. 直到找出第一个返回值为t ...
- ES6新特性-------数组、Math和扩展操作符(续)
三.Array Array对象增加了一些新的静态方法,Array原型上也增加了一些新方法. 1.Array.from 从类数组和可遍历对象中创建Array的实例 类数组对象包括:函数中的argumen ...
随机推荐
- 使用DirectX截屏
网上有很多关于DirectX截屏的文章,但大都是屏幕截图,很少有窗口截图,本文则两者都涉及到,先讲如何截取整个屏幕,再讲如何截取某个窗口,其实二者的区别不大,只是某个参数的设置不同而已,最后我们还将扩 ...
- hdu2371 矩阵乘法(求序列位置改变m次后的序列)
题意: 给你一个字符串,然后让你执行m次操作,每次操作把当前的字符串映射到他给你的位置序列的位置,比如给的是 3 1 2,第一步就是把原来的3的位置的字母变到1的位置,1的变到2的位置,2 ...
- POJ1201基础差分约束
题意: 有一条直线,直线上做多有50000个点,然后给你组关系 a b c表明a-b之间最少有c个点,问直线上最少多少个点. 思路: a-b最少有c个点可以想象a到b+1的距 ...
- 绕过CDN查找网站真实ip
在渗透测试过程中,经常会碰到网站有CDN的情况.CDN即内容分发网络,主要解决因传输距离和不同运营商节点造成的网络速度性能低下的问题.说的简单点,就是一组在不同运营商之间的对接点上的高速缓存服务器,把 ...
- 神经网络与机器学习 笔记—Rosenblatt感知机
Rosenblatt感知机器 感知器在神经网络发展的历史上占据着特殊位置:它是第一个从算法上完整描述的神经网络.它的发明者Rosenblatt是一位心里学家,在20世纪60年代和70年代,感知器的启发 ...
- ListView 加载数据时 触摸报错
问题起因: 在做一个从sd卡中加载数据显示在ListView中,由于数据可能比较多,考虑到用户体验,就使用AsyncTask来异步加载,数据一条一条的添加至ListView中. 开始数据比较少的时候, ...
- 初步了解web
------------------------1.Web应用程序的main方法在哪里------------------------Tomcat:从启动到运行首先,我们是通过执行 Tomcat 的s ...
- 有趣的css—简单的下雨效果2.0版
简单的下雨效果2.0版 前言 笔者上一篇发布的文章有趣的css-简单的下雨效果中有位老哥给我提了一个很棒的建议,大致意思是波纹应该产生于雨滴的消失处. 这是按照老哥的建议完善后的效果图: 由于我制作G ...
- 异步阻塞,Manager模块,线程
一.异步阻塞 1.并没有按照执行顺序等待结果 2.而是所有的任务都在异步执行着 3.但是我要的结果又不知道谁的结果先来,谁先结束我就先取谁的结果 很明显的异步,大家都相互执行着(异步过程),谁先结束我 ...
- alpine安装网络工具
telnet:busybox-extras net-tools: net-tools tcpdump: tcpdump wget: wget dig nslookup: bind-tools curl ...