数组内建方法大全(二)

数组内建方法大全(一)中,介绍了7种不太常见(我很多没见过)的数组内建方法。如果说有点华而不实,那在这一篇我将再展示几种实用的方法,当然,也是面试踩雷区

同样,翻译原文中文文档都在此,随便戳.

增删改查:splice、shift(unshift)、pop(push)

1.Array.protoType.splice(begin,end):分割数组,提取想要的范围,不改变原数组
  • 返回值:新的数组
  • 参数:
  1. begin(可选):起始位置
  2. end (可选):结束位置,没有指定结束位置,默认返回begin后所有值
  • 注意事项:
  1. 若begin > end ,返回空数组
  2. 返回的新数组内容从begin开始,到end的前一个值,即包含begin位,不包含end位
  3. 若参数为负数,则看做加上数组的length,如[0,1,2].splice(-2,-1)相当于[0,1,2].splice(1,2),结果都为[1]
  • 例子
var animals = ['1', '2', '3', '4', '5'];

console.log(animals.slice(2));
//  ["3", "4", "5"]
console.log(animals.slice(2, 4));
// ["3", "4"]
console.log(animals.slice(1, 5));
// ["2", "3", "4", "5"]

3.Array.protoType.shift():从数组中移除第一个元素,改变数组长度
  • 无参数

  • 返回值:被移除的元素

  • 对应相反方法: Array.unshift(element1,...),往数组前位添加元素

  1. 改变数组长度

  2. 返回值: 注意,unshift返回的是新数组的长度!

  • 例子:
var a = [1, 2, 3];

console.log(a.shift());  //   移除第一个元素,返回被移除的元素
//1 
console.log(a); 
// [2,3]

console.log(a.unshift(4,5));   //向数组中添加元素,返回新数组长度
// 4,
console.log(a); 
// [4 , 5 , 2 , 3]
4. Array.protoType.pop():从数组中移除最后一个元素,改变数组长度
  • 无参数

  • 返回值:被移除的元素

  • 对应相反方法:Array.push(element1,...),在数组最后添加元素

  1. 改变数组长度

  2. 返回值: 注意,push返回的是新数组的长度!

  • 例子:
var plants = ['1', '2', '3', '4', '5'];

console.log(plants.pop());   //移除最后一个元素,返回被移除的元素
// "5"
console.log(plants);
// ["1", "2", "3", "4"]

console.log(plants.push(“0”)); //6

遍历迭代:reduce、map、forEach

5.Array.protoType.reduce(callback(accumulator,currentValue,currentIndex),initialValue):对数组的值按索引顺序进行迭代操作,如累加
  • 返回值:最后一次调用得出的累积结果

  • 参数:

  1. callback:数组中每个值都会经过的回调操作
    a. accumulator:当前的累积操作结果
    b. currentValue(可选):当前正在操作的值
    c. currentIndex(可选):当前操作值的索引
  2. initialValue(可选):第一次操作前的初始值,若没有设置该参数,默
6.Array.protoType.map(callback(currentValue,index,array),thisArg):操作数组中的每个值
  • 返回值:一个每个值都已经过回调操作的新的数组

  • 参数:

  1. callback:
    a. currntValue:遍历的当前值
    b. index(可选) :索引
    c.array(可选):当前数组
  2. thisArg(可选):callback函数中的 this 关键字可引用的对象。如果省略 thisArg,则 undefined 将用作 this 值。
  • 例子:
var array1 = [1, 4, 9, 16];
// pass a function to map
const map1 = array1.map(x => x * 2);

console.log(map1);
// expected output: Array [2, 8, 18, 32]

认为数组中的第一个值,并从第二个值开始迭代

  • 例子:
const array1 = [1, 2, 3, 4];
const reducer = (accumulator, currentValue) => accumulator + currentValue;

// 1 + 2 + 3 + 4
console.log(array1.reduce(reducer));   //10

// 5 + 1 + 2 + 3 + 4
console.log(array1.reduce(reducer, 5));  //15

7.Array.protoType.forEach(callback(currentValue,index,array),thisArg):遍历数组
  • 返回值: undefined

  • 参数:

  1. callback():对数组每一个元素的操作函数
    a. currentValue:当前遍历的值
    b. index(可选):索引值
    c. array(可选):正在操作的数组
  2. thisArg(可选):callback函数中的 this 关键字可引用的对象。如果省略 thisArg,则 undefined 将用作 this 值。
  • 例子:

其他:indexOf(lastIndexOf)、sort、keys、join、some(every)

8.Array.protoType.indexOf(searchElement,fromIndex):匹配指定位置起出现的第一个指定元素
  • 返回值:匹配元素的索引值,若匹配不成功,返回-1

  • 参数:

  1. searchElement:待匹配的元素
  2. fromIndex(可选):开始匹配的位置,默认从0开始
  • 对应相反方法:Array.lastIndexOf(searchElement,fromIndex),匹配指定位置起出现的最后一个指定元素
    ** 返回值: 匹配元素的索引值,若匹配不成功,返回-1

  • 例子:

var a = [2, 9, 9]; 
a.indexOf(2); // 0 
a.indexOf(7); // -1

a.lastIndexOf(9); //2
9.Array.protoType.sort(compareFunction()):为数组排序
  • 返回值:排序后的新数组

  • 参数:
    compareFunction(a,b)(可选):自定义排序方法,默认为字Unicode码

    • 函数需要传递两个参数a,b
    • 若a < b ,即a排在b之前,则返回一个小于0的数
    • 若a = b ,则返回0
    • 若a < b ,则返回一个大于0的数
  • 例子:

var a = new Array(4, 11, 2, 10, 3, 1);
var b = a.sort();   //  b= [1,10,11,2,3,4].按照标准字符排序

function compareNum(first ,second{
    if (first == second)
        return 0;
    if (first < second)
        return -1;
    else
        return 1; 
}

var c = a.sort(compareNum)  //c = [1,2,3,4,10,11];
10.Array.protoType.keys():
  • 返回值:一个迭代器,它可返回数组的索引

  • 参数:无参数

  • 例子:

var arr = ['a', 'b', 'c'];
var k= arr.keys();
// k.next().value == 0
// k.next().value == 1
// k.next().value == 2 

11.Array.protoType.join(separator):在数组值之间插入分隔符,并将整个数组转化为字符串
  • 返回值:转化后的字符串

  • 参数:
    separator(可选):分隔符,可以为空。

  • 注:如果数组的任一元素为 undefined 或 null,则该元素将被视为空字符串。

  • 例子:

var elements = ['Fire', 'Wind', 'Rain'];

console.log(elements.join());  //Fire,Wind,Rain
console.log(elements.join('"'));// FireWindRain
console.log(elements.join('-'));  // Fire-Wind-Rain

12.Array.protoType.some(callback(currentValue,index,array),thisArg):判断数组中是否有满足回调方法中的值
  • 返回值:布尔值

  • 参数:

  1. callback():对数组每一个元素的操作函数
    a. currentValue:当前遍历的值
    b. index(可选):索引值
    c. array(可选):正在操作的数组
  2. thisArg(可选):callback函数中的 this 关键字可引用的对象。

*相关方法:array.every(callback())是判断数组中的所有值是否满足回调方法,参数一致

  • 例子:
function isBiggerThan10(element, index, array) {
  return element > 10;
}
[2, 5, 8, 1, 4].some(isBiggerThan10);  // false
[12, 5, 8, 1, 4].some(isBiggerThan10); // true

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

推荐阅读更多精彩内容