js遍历数组some()方法

JavaScript020

js遍历数组some()方法,第1张

题目描述:在一个二维数组中(每个一维数组的长度相同),每一行都按照从左到右递增的顺序排序,每一列都按照从上到下递增的顺序排序。请完成一个函数,输入这样的一个二维数组和一个整数,判断数组中是否含有该整数。一个简单的数组遍历题。

答案:js语言:

functionFind(target, array){returnarray.some(arr =>arr.some(e =>e === target))}

解释:

外面的some方法是对每个一维进行遍历,里面的some方法是对每个一维的每一个元素进行遍历,判断是否严格等于要找的target元素,复杂度为n方。

 =>是es6语法中的arrow function

例:(x) =>x + 6 相当于

function(x){

    return x + 6

}

那么e =>e === target表示返回严格等于target的元素e

some()方法用于检测数组中的元素是否满足指定条件

some() 方法会依次执行数组的每个元素:

如果有一个元素满足条件,则表达式返回 true  , 剩余的元素不会再执行检测。

如果没有满足条件的元素,则返回false。

注意:  some() 不会对空数组进行检测。

注意:  some() 不会改变原始数组。

这里小记一下some以及类似的every,对比一下其他遍历方法

some() 有一个元素满足条件,即返回true

const a = [1, 2, 3]console.log(a.some(v =>v >5))  //falseconsole.log(a.some(v =>v <2))  //true

every() 所有元素满足条件,即返回true

const a = [1, 2, 3]console.log(a.every(v =>v <5))  //trueconsole.log(a.every(v =>v <2))  //false

filter() 返回包含满足条件元素的数组

const a = [1, 2, 3]

console.log(a.filter(v =>v <3))  // [1, 2]

map() 返回一个新数组

const a = [1, 2, 3]

console.log(a.map(v =>v + 5))  // [6, 7, 8]

forEach() 仅循环,无返回值,本质上相当于for

const a = [1, 2, 3]

a.forEach(v =>console.log(v))  // 1    2    3

<script type="text/javascript">

/*对比:

1、map速度比foreach快

2、map会返回一个新数组,不对原数组产生影响,foreach不会产生新数组,foreach返回undefined

3、map因为返回数组所以可以链式操作,foreach不能

4, map里可以用return ,而foreach里用return不起作用,foreach不能用break,会直接报错*/

/*方法一:*/

var arr1 = [1, 2, 3, 4, 5, 6]

for(var i = 0, len = arr1.lengthi <leni++) { //优化性能处理

console.log(arr1[i], 'for遍历出来的数据')//每个item 1,2,3,4,5,6

}

/*方法二:*/

/*forEach方法中的function回调支持3个参数,第1个是遍历的数组内容;第2个是对应的数组索引,第3个是数组本身*/

var arr2 = [{

name: 'bob',

age: 20

},

{

name: 'tom',

age: 18

},

{

name: 'sos',

age: 19

}

]

arr2.forEach((val, i) =>{ //没有返回值的,对原来数组也没有影响

console.log(val, '遍历出来的每个obj')

})

/*方法三:*/

var fruits = [1, 2, 3, 4, 5, 6, 7, 8]

let arr = fruits.map((item, index) =>{

console.log(item, 'top')

console.log(index, 'top')

return item * 8

})

console.log(arr, 'newarr') //[8, 16, 24, 32, 40, 48, 56, 64] "newarr"

var a = fruits.indexOf("Apple", 4)

console.log(a)

//for 和 forEach都是普通循环,map 带返回值并且返回一个新数组;

/*

*当前元素的值,当期元素的索引值,当期元素属于的数组对象

语法:array.map(function(currentValue,index,arr), thisValue)

map() 方法返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值。

map() 方法按照原始数组元素顺序依次处理元素。

注意: map() 不会对空数组进行检测。

注意: map() 不会改变原始数组。

* */

/*方法四:*/

/*兼容写法:

不管是forEach还是map在IE6 - 8 下都不兼容( 不兼容的情况下在Array.prototype上没有这两个方法), 那么需要我们自己封装一个都兼容的方法:*/

/**

* forEach遍历数组

* @param callback [function] 回调函数;

* @param context [object] 上下文;

*/

Array.prototype.myForEach = function myForEach(callback, context) {

context = context || window

if('forEach' in Array.prototye) {

this.forEach(callback, context)

return

}

//IE6-8下自己编写回调函数执行的逻辑

for(var i = 0, len = this.lengthi <leni++) {

callback &&callback.call(context, this[i], i, this)

}

}

/**

* map遍历数组

* @param callback [function] 回调函数;

* @param context [object] 上下文;

*/

Array.prototype.myMap = function myMap(callback, context) {

context = context || window

if('map' in Array.prototye) {

return this.map(callback, context)

}

//IE6-8下自己编写回调函数执行的逻辑var newAry = []

for(var i = 0, len = this.lengthi <leni++) {

if(typeof callback === 'function') {

var val = callback.call(context, this[i], i, this)

newAry[newAry.length] = val

}

}

return newAry

}

</script>

我们有时候需要遍历数组的元素,将它们传入到异步函数中执行,其中的异步写法容易写错,我们来看一下有哪些易错点。

假设我们有个异步方法 sleepPromise,形式如下:

这里为了方便演示,使用 setTimeout 写成了个 promise 形式的 sleep 方法。传入的 t 为延迟执行的时间,msg 为信息内容。

在实际开发中,异步方法可能是传入用户好友 id 查找数据库,获得简单的好友信息。

假设我们需要在下面代码的注释位置下方写一个异步便利实现。

通常前端一看到要遍历数组,就会用 forEach。如果你不够老道,可能会写出如下的实现:

输出结果为;

这种写法并不对,其实是将遍历写成了同步。

问题出在哪?出在 forEach 本身并不支持异步写法,你在 forEach 方法的前面加不加 await 关键字都是无效的,因为它的内部没有处理异步的逻辑。

forEach 是 ES5 的 API,要比 ES6 的 Promise 要早的多得多。为了向后兼容,forEach 以后也不会支持异步处理。

所以 forEach 的执行并不会阻塞 loopAsync 之后的代码,所以会导致阻塞失败,先输出 [end]。

使用普通的 for 循环写法,await 的外层函数就仍就是 loopAysnc 方法,就能正确保存阻塞代码。

但这里的问题是,这些异步方法的执行是 串行 的。可以看到总共执行了 6 s。

如果我们的这些请求是有顺序的依赖关系的,这样写是没问题。

但如果我们的场景是根据用户 id 数组从数据库中查找对应用户名,我们的时间复杂度就是 O(n) ,是不合理的。

此时我们需要改写为 并行 的异步,并且还要保证所有异步都执行完后才执行下一步。我们可以用 Promise.all()。

首先,我们需要根据 tasks 数组生成对应的 promise 对象数组,然后传入到 Promise.all 方法中执行。

这样,这些异步方法就会同时执行。当所有异步都执行完毕后,代码才往下执行。

输出结果如下:

3 秒就完事了,太强了。

前面说到 forEach 底层并没有实现异步的处理,才导致阻塞失效,那么我们其实不妨实现支持异步的简易 forEach。

并行实现:

串行实现:

用法:

简单总结一下。

一般来说,我们更常用 Promise.all 的并行执行异步的方法,常见于数据库查找一些 id 对应的数据的场景。

for 循环的串行写法适用于多个异步有依赖的情况,比如找最终推荐人。

forEach 则是纯粹的错误写法,除非是不需要使用 async/await 的情况。