美文网首页
js中array中map、filter

js中array中map、filter

作者: 请叫我刚爷 | 来源:发表于2019-07-28 19:22 被阅读0次

详情请参考https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array

js中数组map

返回一个新数组,其结果是在调用数组中的每个元素上,调用提供的函数:如下


var array1 = [1, 4, 9, 16];

const map1 = array1.map(x => x * 2);

console.log(map1);/*返回[2, 8, 18, 32]*/

const map2 = array1.map(function(x){

return x*2;

});

console.log(map2);/*返回[2, 8, 18, 32]*/

语法如下


array.map(function callback(currentValue,index,arr), thisValue)

参数描述

currentValue 必选。循环遍历过程中,每个元素的值

index 可选。当前元素的索引值

arr 可选。就是对当前操作的数组;

thisValue 可选。就是指的this;如果不写该值,则在callback中的this指向的时window,如果写了则this指向你写的值;

image.png

----------------------------------------------------华丽的分割线----------------------------------------------------------

js中数组filter

其实就是一个筛选函数,并把筛选函数的结果返回到一个新的数组


 var array1 = [1, 4, 9, 16];

const map3 = array1.filter(x => x>10);

 console.log(map3);

const map4 = array1.filter(function(x){

return x >10;

});

console.log(map4);

语法


array.filter(function(currentValue,index,arr), thisValue)

参数请参考上文的map

----------------------------------------------------华丽的分割线----------------------------------------------------------

js中数组sort

一个排序函数;单由于取决于实现,因此无法保证排序的时间和空间复杂性


var array1 = [1, 4, 9, 16];

const map5 = array1.sort((a,b) => a>b?-1:1);

console.log(map5);

const map6 = array1.sort(function(a,b){

return a>b?-1:1

});

console.log(map6);

语法


array.sort(sortfunction)

参数描述

sortfunction 可选,不加入该参数时默认Unicode代码点值进行排序。加入时必须是函数

----------------------------------------------------华丽的分割线----------------------------------------------------------

js中数组reduce

把元素的每一个值进行预算,并返回;


var array1 = [1, 4, 9, 16];

var map7 = array1.reduce(function(toal,num){

return toal + num;

});

console.log(map7);/*返回30*/

语法


array.reduce(function(total, currentValue, currentIndex, arr), initialValue)

参数描述

total 必需。累加器,记录每次计算后返回的结果。

currentValue 必需。循环遍历过程中,每个元素的值

currentIndex 可选。当前元素的索引

arr 可选。就是对当前操作的数组;

initialValue 可选。给toal赋初始值

image.png

----------------------------------------------------华丽的分割线----------------------------------------------------------

js中数组some

传入一个函数,只要数组满足其中一个要求就返回true,否则就返回false


var array1 = [1, 4, 9, 16];

var map8 = array1.some(function(e){

return e > 10

})

console.log(map8); /*返回true*/

语法


array.some(function(currentValue,index,arr),thisValue)

参数请参考上文的map

----------------------------------------------------华丽的分割线----------------------------------------------------------

js中数组every

传入一个函数,只要数组所有元素满足函数要求就返回true,否则就返回false


var array1 = [1, 4, 9, 16];

var map9 = array1.every(function(e){

return e > 0;

})

console.log(map9); /*返回true*/

var map10 = array1.every(function(e){

return e < 10;

})

console.log(map10);/*返回false*/

语法


array.every(function(currentValue,index,arr),thisValue)

参数请参考上文的map

----------------------------------------------------华丽的分割线----------------------------------------------------------

js中数组find

传入一个函数,返回数组中第一个符合要求的数组下标


var array1 = [1, 4, 9, 16];

var map12 = array1.findIndex(function(e){

return e > 3;

})

console.log(map12); /*返回1,元素4在数组的下标是1*/

语法


array.findIndex(function(currentValue,index,arr),thisValue)

参数请参考上文的map

----------------------------------------------------华丽的分割线----------------------------------------------------------

js中数组splice

删除或者添加元素


var array1 = [1, 4, 9, 16];

// 在索引2的位置移除0个元素,并且插入"A"

array1.splice(2,0,"A");

console.log(array1);/*[1, 4, "A", 9, 16]*/

// 在索引2的位置移除1个元素,即删除"A"

array1.splice(2,1);

console.log(array1);/*[1, 4, 9, 16]*/

// 在索引2的位置移除1个元素,即删除9,并在该位置添加5,6

array1.splice(2,1,5,6);

console.log(array1);/*[1, 4, 5, 6, 16]*/

语法


array.splice(index,howmany,item1,.....,itemX)

参数描述

index 必需。增加或者删除的下标起始位置

howmany 必需。需要删除多少个元素。

如果未规定此参数,则删除从 index 开始到原数组结尾的所有元素。

item1, ..., itemX 可选。要添加到数组的新元素

----------------------------------------------------华丽的分割线----------------------------------------------------------

js中数组slice

返回指定位置的一段元素。且不影响原数组


var array1 = [1, 4, 9, 16];

var map13 = array1.slice(1,3);

console.log(map13);/*[4, 9]*/

console.log(array1);/*[1, 4, 9, 16]*/

语法


array.slice(start, end)

参数描述,以下描述来自https://www.runoob.com/jsref/jsref-slice-array.html

start 可选。规定从何处开始选取。如果是负数,那么它规定从数组尾部开始算起的位置。也就是说,-1 指最后一个元素,-2 指倒数第二个元素,以此类推。

end 可选。规定从何处结束选取。该参数是数组片断结束处的数组下标。如果没有指定该参数,那么切分的数组包含从 start 到数组结束的所有元素。如果这个参数是负数,那么它规定的是从数组尾部开始算起的元素。

----------------------------------------------------华丽的分割线----------------------------------------------------------

js中数组concat()

拼接多个数组。


vvar array2 = [2, 3, 4, 5];

var array3 = ["A", 3, 4, 5];

var map14 = array1.concat(array2,array3);//括号内科增加无数个数组

console.log(map14);/*返回[1, 4, 9, 16, 2, 3, 4, 5, "A", 3, 4, 5]*/

语法


array1.concat(array2,array3,...,arrayX)

----------------------------------------------------华丽的分割线----------------------------------------------------------

js中数组includes

查看数组中是否包含特定的值,返回true、false。


var array1 = [1, 4, 9, 16];

console.log(array1.includes(2));/*返回false*/

console.log(array1.includes(4));/*返回true*/

语法


arr.includes(searchElement, fromIndex)

参数描述

searchElement 必须。需要查找的元素值。

fromIndex 可选。从那个位置开始找searchElement

----------------------------------------------------华丽的分割线----------------------------------------------------------

js中数组join()

将数组拼接成字符串返回。


var array1 = [1, 4, 9, 16];

console.log(array1.join());/*1,4,9,16*/

console.log(array1.join("++"));/*1++4++9++16*/

语法


array.join(separator)

参数描述

separator 可选。以什么元素拼接,默认逗号

----------------------------------------------------华丽的分割线----------------------------------------------------------

相关文章

网友评论

      本文标题:js中array中map、filter

      本文链接:https://www.haomeiwen.com/subject/hiiprctx.html