操作数组高阶函数用法(部分)

操作数组的函数方法(括号内函数会改变原数字)(pop push unshift shift splice reverse sort)
indexOf lastIndexof concat slice

1. pop 删除数组的最后一个元素,同时返回删除元素值,会改变数组

eg: var a =[1,2,3,4]; a.pop(); console.log(a); 结果:[1,2,3]

2. push 向数组尾部增加一个元素,同时返回数组长度,会改变原数组

eg: var a=[1,2,3]; a.push(“s”); console.log(a); 结果:[1,2,3,”s”]

3. unshift() 方法可向数组的开头添加一个或更多元素,并返回新的长度,会改变原数组。

eg: var a= [1, 2, 3, "s"] a. unshift('d','f',6); console.log(a);
结果:["d", "f", 6, 1, 2, 3, "s"]

4. shift方法用于把数组的第一个元素从其中删除,并返回第一个元素(删除元素)的值。

eg: var a=["d", "f", 6, 1, 2, 3, "s"] ; a.shift(); 返回”d”
输出a console.log(a); 结果["f", 6, 1, 2, 3, "s"]

5. splice方法向/从数组中添加/删除项目,然后返回被删除的项目

eg1: a= [6, 1, 2, 3, "d"]; a.splice(1,2); (从下标为1的位置删除2个元素)
返回:[1, 2]
输出a console.log(a);
结果:[6, 3, "d"]
eg2: a= [6, 3, "d"]; a.splice(1,4,'v','i','e','w');
返回:[3, "d"]
输出a
返回:[6, "v", "i", "e", "w"]
eg3:a= [6, "v", "i", "e", "w"]; a.splice(1,0,'hello');
返回:[]
输出a,结果: [6, "hello", "v", "i", "e", "w"]
arrayObject.splice(index,howmany,item1,.....,itemX)

参数 描述
index 必需。整数,规定添加/删除项目的位置,使用负数可从数组结尾处规定位置。
howmany 必需。要删除的项目数量。如果设置为 0,则不会删除项目。
item1, ..., itemX 可选。向数组添加的新项目。

splice() 方法可删除从 index 处开始的零个或多个元素,并且用参数列表中声明的一个或多个值来替换那些被删除的元素。
如果从 arrayObject 中删除了元素,则返回的是含有被删除的元素的数组。

6.reverse() 方法用于颠倒数组中元素的顺序。

注释:该方法会改变原来的数组,而不会创建新的数组。
Eg1: var a= [6, "hello", "v", "i", "e", "w"];
reverse(); 返回: ["w", "e", "i", "v", "hello", 6]

7. sort() 排序数组

eg1:按字母顺序升序
fruits = ["Banana", "Orange", "Apple", "Mango"]; fruits.sort();
返回结果:["Apple", "Banana", "Mango", "Orange"]
Eg2:按字数字升序
var points = [40,100,1,5,25,10];
points.sort(function(a,b){return a-b});
返回结果:[1, 5, 10, 25, 40, 100]
Eg3:降序排序数组
var points = [40,100,1,5,25,10];
points.sort(function(a,b){return b-a});
返回结果:[100, 40, 25, 10, 5, 1]

8. indexOf() 方法可返回某个指定的字符串值在字符串中首次出现的位置。

语法
stringObject.indexOf(searchvalue,fromindex)

参数 描述
searchvalue 必需。规定需检索的字符串值。
fromindex 可选的整数参数。规定在字符串中开始检索的位置。它的合法取值是 0 到 stringObject.length - 1。如省略该参数,则将从字符串的首字符开始检索。

说明
该方法将从头到尾地检索字符串 stringObject,看它是否含有子串 searchvalue。开始检索的位置在字符串的 fromindex 处或字符串的开头(没有指定 fromindex 时)。如果找到一个 searchvalue,则返回 searchvalue 的第一次出现的位置。stringObject 中的字符位置是从 0 开始的。

Eg: var str="Hello world!"
document.write(str.indexOf("Hello") + "<br />")
document.write(str.indexOf("World") + "<br />")
document.write(str.indexOf("world"))
以上代码的输出:
0
-1
6

9. lastIndexOf() 方法可返回一个指定的字符串值最后出现的位置,在一个字符串中的指定位置从后向前搜索。

参数 描述
searchvalue 必需。规定需检索的字符串值。
fromindex 可选的整数参数。规定在字符串中开始检索的位置。它的合法取值是 0 到 stringObject.length - 1。如省略该参数,则将从字符串的最后一个字符处开始检索。
返回值
如果在 stringObject 中的 fromindex 位置之前存在 searchvalue,则返回的是出现的最后一个 searchvalue 的位置。
说明
该方法将从尾到头地检索字符串 stringObject,看它是否含有子串 searchvalue。开始检索的位置在字符串的 fromindex 处或字符串的结尾(没有指定 fromindex 时)。如果找到一个 searchvalue,则返回 searchvalue 的第一个字符在 stringObject 中的位置。stringObject 中的字符位置是从 0 开始的。
提示和注释
注释:lastIndexOf() 方法对大小写敏感!
注释:如果要检索的字符串值没有出现,则该方法返回 -1。
var str="Hello world!"
document.write(str.lastIndexOf("Hello") + "<br />")
document.write(str.lastIndexOf("World") + "<br />")
document.write(str.lastIndexOf("world"))
以上代码的输出:
0
-1
6

Eg: var str="hello world on oh!"; str.lastIndexOf('o'); 输出:15

Eg: str.indexOf('o'); 输出:4

10. concat 合并数组

var hege = ["Cecilie", "Lone"];
var stale = ["Emil", "Tobias", "Linus"];
var kai = ["Robin"];
var children = hege.concat(stale,kai);
输出children ;结果:["Cecilie", "Lone", "Emil", "Tobias", "Linus", "Robin"]

11. slice() 方法可从已有的数组中返回选定的元素。

语法
arrayObject.slice(start,end)

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

end 可选。规定从何处结束选取。该参数是数组片断结束处的数组下标。如果没有指定该参数,那么切分的数组包含从 start 到数组结束的所有元素。如果这个参数是负数,那么它规定的是从数组尾部开始算起的元素。
返回值
返回一个新的数组,包含从 start 到 end (不包括该元素)的 arrayObject 中的元素。
说明
请注意,该方法并不会修改数组,而是返回一个子数组。如果想删除数组中的一段元素,应该使用方法 Array.splice()。
var arr = new Array(3)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"

document.write(arr + "<br />")
document.write(arr.slice(1) + "<br />")
document.write(arr)
输出:
George,John,Thomas
John,Thomas
George,John,Thomas

forEach filter(过滤) map(映射) find some every includes reduce

(find includes es6)

node 版本

LTS标准版 9.00Current 当前最新版

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

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

array.forEach(function(currentValue, index, arr), thisValue)
参数 描述
function(currentValue, index, arr) 必需。 数组中每个元素需要调用的函数。
函数参数:
参数 描述
currentValue 必需。当前元素
index 可选。当前元素的索引值。
arr 可选。当前元素所属的数组对象。

thisValue 可选。传递给函数的值一般用 "this" 值。
如果这个参数为空, "undefined" 会传递给 "this" 值

Eg:
var s = ["Cecilie", "Lone", "Emil", "Tobias", "Linus", "Robin"];
s.forEach(function(item,index,s){

console.log("item:"+item);
console.log("index:"+index);
console.log("s:"+s);
},this);
14:46:28.079 VM1460:4 item:Cecilie
14:46:28.080 VM1460:5 index:0
14:46:28.080 VM1460:6 s:Cecilie,Lone,Emil,Tobias,Linus,Robin
14:46:28.080 VM1460:4 item:Lone
14:46:28.080 VM1460:5 index:1
14:46:28.080 VM1460:6 s:Cecilie,Lone,Emil,Tobias,Linus,Robin
14:46:28.081 VM1460:4 item:Emil
14:46:28.081 VM1460:5 index:2
14:46:28.081 VM1460:6 s:Cecilie,Lone,Emil,Tobias,Linus,Robin
14:46:28.081 VM1460:4 item:Tobias
14:46:28.081 VM1460:5 index:3
14:46:28.082 VM1460:6 s:Cecilie,Lone,Emil,Tobias,Linus,Robin
14:46:28.082 VM1460:4 item:Linus
14:46:28.082 VM1460:5 index:4
14:46:28.082 VM1460:6 s:Cecilie,Lone,Emil,Tobias,Linus,Robin
14:46:28.082 VM1460:4 item:Robin
14:46:28.082 VM1460:5 index:5
14:46:28.082 VM1460:6 s:Cecilie,Lone,Emil,Tobias,Linus,Robin
14:46:28.104 undefined

2. filter

array.filter(function(currentValue,index,arr), thisValue)
参数 描述
function(currentValue, index,arr) 必须。函数,数组中的每个元素都会执行这个函数
函数参数:
参数 描述
currentValue 必须。当前元素的值
index 可选。当前元素的索引值
arr 可选。当前元素属于的数组对象

thisValue 可选。对象作为该执行回调时使用,传递给函数,用作 "this" 的值。
如果省略了 thisValue ,"this" 的值为 "undefined"

var s = [1,20,40,0,-60,100,209];
s.filter(function(item){
return item>10;
});
结果:[20, 40, 100, 209]

3. map

map定义和方法
map()方法返回一个新数组,数组中的元素为原始数组元素调用函数处理的后值。
map()方法按照原始数组元素顺序依次处理元素。
注意:
map不会对空数组进行检测
map不会改变原始数组
arr.map(function(currentValue,index,arr),thisValue)
参数说明
function(currentValue,index,arr)
必须,函数,数组中的每个元素都会执行这个函数函数参数
函数参数
currentValue 必须 当前元素值
index 可选 当前元素的索引值
arr 可选 当前元素属于的数组对象。

var numbers = [25,36,121,49];

    function myFunction(num,index,arr){
        console.log(arr);
        return num * 10;
    }

numbers.map(myFunction);
15:12:18.585 VM1521:4 (4) [25, 36, 121, 49]
15:12:18.585 VM1521:4 (4) [25, 36, 121, 49]
15:12:18.586 VM1521:4 (4) [25, 36, 121, 49]
15:12:18.586 VM1521:4 (4) [25, 36, 121, 49]
15:12:18.596 (4) [250, 360, 1210, 490]

4. find

find() 方法返回传入一个测试条件(函数)符合条件的数组第一个元素。
find() 方法为数组中的每个元素都调用一次函数执行:
• 当数组中的元素在测试条件时返回 true 时, find() 返回符合条件的元素,之后的值不会再调用执行函数。
• 如果没有符合条件的元素返回 undefined
注意: find() 对于空数组,函数是不会执行的。
注意: find() 并没有改变数组的原始值。
表格中的数字表示支持该方法的第一个浏览器版本号。
方法 谷歌 IE 火狐 Safri opera
find() 45.0 12.0 25.0 7.1 32.0
注意: IE 11 及更早版本不支持 find() 方法。
array.find(function(currentValue, index, arr),thisValue)
参数 描述
function(currentValue, index,arr) 必需。数组每个元素需要执行的函数。
函数参数:
参数 描述
currentValue 必需。当前元素
index 可选。当前元素的索引值
arr 可选。当前元素所属的数组对象

thisValue 可选。 传递给函数的值一般用 "this" 值。
如果这个参数为空, "undefined" 会传递给 "this" 值
var ages = [4, 12, 16, 20];
function checkAdult(age){
return age >= 18 }
ages.find(checkAdult);

输出结果:20

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

some() 方法会依次执行数组的每个元素:
• 如果有一个元素满足条件,则表达式返回true , 剩余的元素不会再执行检测。
• 如果没有满足条件的元素,则返回false。
注意: some() 不会对空数组进行检测。
注意: some() 不会改变原始数组。
语法
array.some(function(currentValue,index,arr),thisValue)
参数 描述
function(currentValue, index,arr) 必须。函数,数组中的每个元素都会执行这个函数
函数参数:
参数 描述
currentValue 必须。当前元素的值
index 可选。当期元素的索引值
arr 可选。当期元素属于的数组对象

thisValue 可选。对象作为该执行回调时使用,传递给函数,用作 "this" 的值。
如果省略了 thisValue ,"this" 的值为 "undefined"
Eg:

var ages = [4, 12, 16, 20];
function checkAdult(age) {
return age >= 18;
}
ages.some(checkAdult);

结果:true

6. every

every() 方法用于检测数组所有元素是否都符合指定条件(通过函数提供)。
every() 方法使用指定函数检测数组中的所有元素:
• 如果数组中检测到有一个元素不满足,则整个表达式返回 false ,且剩余的元素不会再进行检测。
• 如果所有元素都满足条件,则返回 true。
注意: every() 不会对空数组进行检测。
注意: every() 不会改变原始数组。
语法
array.every(function(currentValue,index,arr), thisValue)
参数 描述
function(currentValue, index,arr) 必须。函数,数组中的每个元素都会执行这个函数
函数参数:
参数 描述
currentValue 必须。当前元素的值
index 可选。当前元素的索引值
arr 可选。当前元素属于的数组对象

thisValue 可选。对象作为该执行回调时使用,传递给函数,用作 "this" 的值。
如果省略了 thisValue ,"this" 的值为 "undefined"

7. includes是否包含给定的值,返回true 或false

[1, 2, 3].includes(2); // true
[1, 2, 3].includes(4); // false
[1, 2, NaN].includes(NaN); // true

8. reduce() 方法接收一个函数作为累加器,数组中的每个值(从左到右)开始缩减,最终计算为一个值。

reduce() 可以作为一个高阶函数,用于函数的 compose。
注意: reduce() 对于空数组是不会执行回调函数的。
array.reduce(function(total, currentValue, currentIndex, arr), initialValue)
参数 描述
function(total,currentValue, index,arr) 必需。用于执行每个数组元素的函数。
函数参数:
参数 描述
total 必需。初始值, 或者计算结束后的返回值。
currentValue 必需。当前元素
currentIndex 可选。当前元素的索引
arr 可选。当前元素所属的数组对象。

initialValue 可选。传递给函数的初始值
var numbers = [15.5, 2.3, 1.1, 4.7];
function getSum(total, num) { return total + Math.round(num); }
numbers.reduce(getSum, 0);
输出结果:24

var numbers = [15.5, 2.3, 1.1, 4.7];
function getSum(total, num) { return total + Math.round(num); }
numbers.reduce(getSum, 10);
输出结果:34
[1,2,3,4,5].reduce(function(prev,next,index,item){
console.log(arguments);
});

Question:
Let arr=[1,2,3,4,5];
For(let i=0;i<arr.length;i++){//编程式
Console.log(arr[i]);
}
//forEach 不支持returns
forEach,for in, for,for of的区别

arr.forEach(function(item){//声明式(不关心如何实现)
{
console.log(item);

}
});
for(let key in arr){//key会变成字符串类型,包括数组的私有属性也可以打印出来
console.log(key);
}
For(let val of arr){//支持return 并且是值of数组(不能遍历对象)
console.log(val);
}

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 194,088评论 5 459
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 81,715评论 2 371
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 141,361评论 0 319
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 52,099评论 1 263
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 60,987评论 4 355
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 46,063评论 1 272
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 36,486评论 3 381
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 35,175评论 0 253
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 39,440评论 1 290
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 34,518评论 2 309
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 36,305评论 1 326
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 32,190评论 3 312
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 37,550评论 3 298
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 28,880评论 0 17
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 30,152评论 1 250
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 41,451评论 2 341
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 40,637评论 2 335

推荐阅读更多精彩内容