JavaScript 数组内置方法补充

JavaScript 数组内置方法补充

 

1.forEach() 方法用于调用数组的每个元素,并将元素传递给回调函数

注意: forEach() 对于空数组是不会执行回调函数的。

var numbers = [4,9,16,25];

function fn(value,i) {

console.log("测试回调打印",value,i);

}

numbers.forEach(fn);

 

numbers.forEach(function(value,index){

console.log(value,index);

})

如图所示：

 

 

封装一个forEach功能函数

 var numbers = [4,9,16,25];
function myForEach(arr,callback) {
            // callback();
            for (var i = 0; i < arr.length; i++){
                callback(arr[i],i);
            }
        }

        // 使用
        myForEach(["a","b","c"],function(value,index){
            console.log("myForEach",value,index);
        })

        myForEach(numbers,function(value,index){
            console.log("myForEach",value,index);
        })

如图所示：

 

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

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

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

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

 

var numbers = [4,9,16,25];

var mapArr = numbers.map(function(value,index){

console.log("map",value,index);

// 每次的返回值,保存到新数组中

return value + 10;

});

console.log(mapArr,numbers, numbers == mapArr);

 

如图所示:

 

 

封装一个forEach功能函数

function myMap(arr,cb) {
                var newArr = [];
                for(var i = 0; i < arr.length; i ++) {
                   var cbValue = cb(arr[i],i);
                   newArr.push(cbValue);
                }
                return newArr;
            }

            // 使用
           var myMapArr = myMap(numbers,function(value,index){
                return value+"px";
            })
            console.log(myMapArr);

如图所示：

 

 

3.filter() 方法创建一个新的数组，新数组中的元素是通过检查指定数组中符合条件的所有元素。

注意： filter() 不会对空数组进行检测。

注意： filter() 不会改变原始数组。

 

var numbers = [4,9,16,25];

var filterArr = numbers.filter(function(value,index){

// return true;

return value > 10;

});

console.log(filterArr);

如图所示：

 

4.some() 方法用于检测数组中的元素是否满足指定条件（函数提供）。

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

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

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

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

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

var ages = [3, 10, 18, 20,28];

var res = ages.some(function(value){

console.log(value);

return value == 18;

})

console.log(res);

如图所示：

 

5.every() 方法用于检测数组所有元素是否都符合指定条件（通过函数提供）。

every() 方法使用指定函数检测数组中的所有元素：

如果数组中检测到有一个元素不满足，则整个表达式返回 false ，且剩余的元素不会再进行检测。

如果所有元素都满足条件，则返回 true。

注意： every() 不会对空数组进行检测。

注意： every() 不会改变原始数组。

var ages = [3, 10, 18, 20,28];

var res = ages.every(function(value){

console.log(value);

return value == 18;

})

console.log(res);

如图所示：