做前端有多年了，看过不少技术文章，学了新的技术，但更新迭代快的大前端，庞大的知识库，很多学过就忘记了，特别在项目紧急的条件下，哪怕心中隐隐约约有学过一个方法，但会下意识的使用旧的方法去解决，多年前ES5几个新增的数组方法，好用但是常忘记用，趁着这周比较清闲，重温下并做下笔记，养成记笔记的好习惯。 forEach map filter some every forEach forEach是ES5的Array方法中用得最频繁的一个，就是遍历，循环输出，它接受一个必须的回调函数作为参数。 复制代码 let arr1 = [1,2,3,4] arr1.forEach((item)=>{ console.info(item); }) //1 //2 //3 //4 复制代码 等同于传统的for循环。 复制代码 let arr1 = [1,2,3,4] for(let i = 1;i { }); 复制代码 举个例子： 复制代码 let array1 = [1, 2, 3, 4] let array2 =[]; array1.forEach( (item, index, array) => { console.info(array1 === array);//(4)true array2[index] = item * item; }); console.info(array2);// [1, 4, 9, 16] 复制代码 forEach除了接受一个回调函数作为参数，还接受一个可选的上下文参数（改变回调函数里面的this指向）。 array.forEach(callback,[thisObject]) 例子，obj.consoleFn被调用后，this指向了obj。 复制代码 let obj = { nameArr: ["猫", "狗", "羊","鸟"], isCat: function (name) { return /^猫/.test(name); }, consoleFn: function (name) { if (this.isCat(name)) { console.info(`你是${name}`); } else { console.info(`你不是${name}`); } } } obj.nameArr.forEach(obj.consoleFn,obj); // 你是猫 // 你不是狗 // 你不是羊 // 你不是鸟 复制代码 下面的例子obj.consoleFn作为forEach的参数后被调用，此时如果没有指定forEach的上下文参数，那么obj.consoleFn中this指向window，会导致页面报错。这里要了解this的知识，可以查看这篇文章《javascript笔记之this用法》。 如下代码，window下并没有isCat函数，所以会出现报错。 复制代码 let obj = { nameArr: ["猫", "狗", "羊","鸟"], isCat: function (name) { return /^猫/.test(name); }, consoleFn: function (name) { if (this.isCat(name)) { console.info(`你是${name}`); } else { console.info(`你不是${name}`); } } } obj.nameArr.forEach(obj.consoleFn);// Uncaught TypeError: this.isCat is not a function 复制代码 forEach不会遍历空元素 复制代码 let array3 = [1,,3] console.info(array3.length); //3 array3.forEach((item)=>{ console.info(item); }); //1 //3 复制代码 map map是ES5的Array方法中最基本的一个，其基本用法跟forEach类似，也是遍历，不同是的最终输出一个新的数组 array.map(callback,[thisObject]); callback的参数跟forEach一样。 复制代码 array.map(function(value, index, array) { //callback需要有return值 }); 复制代码 map函数是把原数组被“映射”成一个新数组 复制代码 let array1 = [1, 2, 3, 4] let array2 = array1.map( (item, index, array) => { return item * item }); console.info(array2); // [1,4,9,16] 复制代码 filter filter为“过滤”、“筛选”之意。指数组通过filter后，返回过滤后的新数组。 array.filter(callback,[thisObject]); filter的callback函数需要返回布尔值true或false(返回值只要是弱等于== true/false就可以了)，callback需要有return值 比如，下面数组中array4的前2个组返回0和false则被过滤掉。 复制代码 const array4 = [0, false, 2, 3]; const array5 = array4.filter(function(item) { return item; }); console.info(array5); // [2, 3] 复制代码 再来一个例子，把数组中的猪过滤掉。 复制代码 const array6 = ["猫", "狗", "羊", "猪"]; const array7 = array6.filter(function(item) { if(item == '猪') return false else return item }); console.info(array7); // ["猫", "狗", "羊"] 复制代码 some some意指“某些”，指是否“某些项”合乎条件。用法如下： array.some(callback,[thisObject]); some要求至少有1个值让callback返回true就可以了，如下例子： 复制代码 const arrFraction = [60, 80, 95, 70]; const passFraction = 90;//有一个人高于90分就通过入学考试 const result = arrFraction.some((item)=>{return item > passFraction }) if(result){ console.info("通过入学考试"); } 复制代码 every every意指“每一项”，指所有必须合乎条件，只要一项不符合则返回false。用法如下： 复制代码 const arrFraction = [91, 93, 95, 89]; const passFraction = 90;//所有人高于90分就通过入学考试 const result = arrFraction.every((item)=>{ return item > passFraction }) if(result){ console.info("通过入学考试"); }else{ console.info("不通过入学考试"); } 复制代码 作者：白树 出处：http://peunzhang.cnblogs.com/ 您觉得本文不错，可打赏博主，或点击右下角【好文要顶】支持博主。 https://www.cnblogs.com/PeunZhang/p/9851677.html