目录· forEach()(ES6)方法 · map()(ES6) 方法 · flatMap()方法 · for...in... · for...of... · filter(ES6)遍历数组 · every()函数(ES6) · find()函数(ES6) · findIndex()函数 (ES6) forEach()(ES6)方法forEach()(ES6)方法对数组的每个元素执行一次给定的函数。 1. 数组里的元素个数有几个,该方法里的回调就会执行几次 2. 第一个参数是数组里的元素,第二个参数为数组里元素的索引,第三个参数则是它自己(利用第三个参数可以进行数组去重) 3. 数组自带的遍历方法,foreach在循环次数未知或者计算起来较复杂的情况下效率比for循环高 4. 循环的数组元素是基本数据类型,不会改变原数据的数据,循环的数组元素为对象,会改变原数组的对象属性的值 5. 循环过程中不支持修改索引,回调中使用return不会报错,但是无效 注意:不能使用break和continue跳出整个循环或当前循环的,会报错,但是结合try...catch可以实现跳出循环 1 2 | const array1 = ['a', 'b', 'c']; array1.forEach(element => console.log(element)); |
缺点:没有办法中止或跳出 `forEach()` 循环 map()(ES6) 方法map()(ES6) 方法创建一个新数组,其结果是该数组中的每个元素是调用一次提供的函数后的返回值。 1 2 3 | const array1 = [1, 4, 9, 16]; const map1 = array1.map(x => x * 2); console.log(map1); //[2, 8, 18, 32] |
三个参数:数组元素,元素索引,原数组本身 flatMap()方法flatMap()方法首先使用映射函数映射每个元素,然后将结果压缩成一个新数组。它与 map 连着深度值为1的 flat 几乎相同,但 flatMap 通常在合并成一种方法的效率稍微高一些。 1 2 3 4 | var arr1 = [1, 2, [3, 4]]; arr1.flatMap(x => x); //[1, 2, 3, 4] var arr1 = [1, 2, 3, 4]; arr1.flatMap(x => [[x * 2]]); // [[2], [4], [6], [8]] |
for...in...这个循环用的人也很多,但是效率最低(输出的 key 是数组索引),如果遍历的是对象,输出的则是对象的属性名 for...of... 性能要好于 `for..in...`,但仍然比不上普通的 `for` 循环 注意:不能循环对象,因为任何数据结构只要部署 Iterator接口,就可以完成遍历操作,有些数据结构原生具备 Iterator 接口,比如Array、Map、Set、String等,而 Iterator 接口是部署在数据结构的Symbol.iterator属性上的,而对象Object恰恰是没有Symbol.iterator属性的,所以无法被for..of遍历 filter(ES6)遍历数组filter(ES6)遍历数组,过滤出符合条件的元素并返回一个新数组, 如果没有任何数组元素通过测试,则返回空数组。 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 | const result = words.filter(word => word.length > 6); console.log(result) //["exuberant", "destruction", "present"] some()函数(ES6) 遍历数组中是否有符合条件的元素,返回值为Boolean值 这个它只要找到一个符合条件的,就返回 true。 var arr = [ { id: 1, name: '买笔', done: true }, { id: 2, name: '买笔记本', done: true }, { id: 3, name: '练字', done: false } ] var bool = arr.some(function (item, index) { return item.done }) console.log(bool) // true |
every()函数(ES6) 测试数组的各个元素是否通过了回调函数的测试 若都通过,返回 true,否则返回 false 简单的说就是如果回调函数每次返回的值都是 true 的话,则 every() 返回 true,否则为 false。 1 2 3 4 5 6 7 8 9 | var arr = [ { id: 1, name: '买笔', done: true }, { id: 2, name: '买笔记本', done: true }, { id: 3, name: '练字', done: false } ] var bool = arr.every((item, index) => { return item.done }) console.log(bool) // false |
find()函数(ES6)返回第一个通过测试的元素,如果没有通过测试的元素,则会返回**undefined**。 1 2 3 4 5 | var arr = [1, 1, 2, 2, 3, 3, 4, 5, 6] var num = arr.find( (item, index) => { return item === 3 }) console.log(num) // 3 |
findIndex()函数 (ES6)这个函数与上面的find()作用一样,就是它返回的值为该通过第一个元素的索引。 1 2 3 4 5 | var arr = [1, 1, 2, 2, 3, 3, 4, 5, 6] var num = arr.findIndex(item => { return item === 3 }) console.log(num) // 4 |
|