操作数组的方法总结

判断数组的通用方法:Object.prototype.toString.call(变量名) === "[object Array]"

进入正题:

、不改变原数组,生成新数组:

1.split()按指定字符串进行分割,分割前为字符串,分割后为新数组

例: var a= "a,b,c"

    var b= a.split(,)

    console.log(b)   // ["a", "b", "c"]     新数组

    console.log(b)  // a,b,c                  原字符串

2.join()按选定字符串进行合并,合并前为数组,合并后为新字符串

    var a = ["a","b","c"]

    var b = a.join("-")

    console.log(b)   //a-b-c                 新字符串

        console.log(b)  // ["a","b","c"]       原数组

3.concat()将两数组连接成一个新数组

    var a = ["a","b","c"]

    var c = a.concat("d")

    console.log(a)  // ["a","b","c"]       原数组

    console.log(c)  // ["a","b","c","d"]       原数组

4.chatAt()返回指定下标位置的字符,起始值为0

    var a = "abcd"

    var b = a.charAt(0)

    console.log(b)  //a             返回下标为0的字符

5.charCodeAt()返回指定位置的字符的Unicode编码

    var a = "abcd"

    var b = a.charCodeAt(0)

     console.log(b)   //97     a的Unicode编码是97

6.slice(strat,end) strat是必需项,表示开始截取的下标位置。end是可选项,表示停止截取的下标位置(注意此位置不被截取)。如果strat是负数,那从数组尾部开始截取,若end下标小于等于start下标,则截取不到,内容为undefined。允许负数。

    var a = "abcd"

    var b = a.slice(1,2)//截取下标1的字符串

    var c = a.slice(0,2) //截取下标0和1组成的字符串

    var d = a.slice(-2,2)

    console.log(b,c,d)//b ab undefied

7.substr(start,length)strat是必需项,end是可选项。如果length是负数或0,返回空字符串。

    var a = "abcd"

    var b = a.substr(-2,2)

    console.log(b) // cd

8.substring(start,end)strat是必需项。end是可选项,表示停止截取的下标位置(注意此位置不被截取)。如果start与end相等,返回空字符串。如果两者中有负数,则替换为0。如果start大于end,则交换位置。

    var a = "abcd"

    var b = a.substring(-2,2) //a: abcd     b:ab

9.includes这个方法用来判断数组中是否存在该元素,参数是具体的数组元素,他与indexOf()相比更优,indexOf()返回的是数组中元素的位置,且不能解析NaN,会把数组中的NaN漏掉,因此includes更优

10.indexOf:获取字符第一个下标位置

    lastIndexOf:获取字符最后一个下标位置  

    var a= [1,2,2,4]

    var b= a.indexOf(2)  //a:[1,2,2,4] b:1

    var c= a.lastIndexOf(2) //a:[1,2,2,4] b:2

11.find()该方法找到第一个符合条件的成员。返回值是数组的成员,不是索引。找不到返回undefined

    var a= [1,2,2,4]

    var d= a.find(function(x){

        return x>1

    }) 

    //d:[1,2,2,4] b:2 找到第一个符合条件的成员2

12.findIndex()返回成员的位置。没找到返回-1输入是回调函数,所有数组成员一次执行该函数,直到找到第一个返回值为true的成员。回调函数可以接受三个参数,依次为值,位置,原数组。

    var arr = [1,2,3,4,5,5,5];

    var arr1 = arr.findIndex(function(x){

       return x == 5; 

    });    //arr1 = 4    返回满足x==5的成员的下标4

    等同于下面:

    var arr2 = arr.indexOf(5);    //arr2 = 4

、改变原数组,生成新数组:

1.通用方法—splice(start,删除长度,插入项目...)

    var a =[1,2,3,4]

    var b=a.splice(0,2,55,66)//a:[55,66,2,3,4]   b:55,66

2.shift:删除原数组第一项,返回删除的值。如果数组为空返回undefined,可用splice(0,1)代替

    var a= [1,2,3,4]

    var b = a.shift()       //a:[2,3,4]   b:1

3.unshift:将参数加到原数组开头,返回数组长度。

    var a= [1,2,3,4]

    var b = a.unshift(1,-1)       //a:[1,-1,2,3,4]   b:5

     这个方法的返回值不可靠,可用splice(0,0,加入项目)代替

4.pop删除原数组最后一项,返回删除的值。如果数组为空返回undefined,可用splice(原数组.length-1,0,插入项目)代替

    var a= [1,2,3,4]

    var b = a.pop()       //a:[1,2,3]   b:4

5.push将参数追加到原数组末尾,返回数组长度

    var a= [1,2,3,4]

    var b = a.push(5,6)       //a:[1,2,3,4,5,6]   b:5,6

6.将数组反转

    var a= [1,2,3,4]

    var b=a.reverse()        //a:[1,2,3,4]   b:[4,3,2,1]

7.将数组排序

    var a= [1,4,3,2]

    var b=a.reverse()        //a:[1,2,3,4]   b:[1,2,3,4] 

三、迭代方法

1.every()这个方法是测试数组的所有元素是否都通过了指定函数的测试,每一项都返回true,则返回true

    var arr = [1,2,3,4,5];

    var arr1 = arr.every(function(x){

            return x<3;

        })    //false

2.some()与every()相似,区别在于任意一项返回true,则返回true

    var arr = [1,2,3,4,5];

    var arr1 = arr.some(function(x){

        return x<3;

    })    //true

3.filter:将数组元素执行特定函数,而返回一个子集。输入是执行逻辑判断的函数,该函数返回true或false,输出是判定为true的元素

    var arr = [1,2,3,4,5];

    var arr1 = arr.filter(function(x){

        return x<3;

    })      //arr1 = [1,2]

4.foreach:为每个元素调用指定函数。改变数组本身。函数的参数依次是:数组元素,元素的索引,数组本身。

这种方法不能使用break语句跳出循环也不能使用return语句从闭包函数中返回

    var arr = [1,2,3,4];

    arr.forEach(function(element,index,arr1){

        arr1[index] = element+1;

    })      // arr = [2, 3, 4, 5]

5.map:调用的数组的每一个元素传递给指定的函数,并返回一个新数组。不改变原数组。函数的参数只有传进来的数组元素。

    var arr = [1,2,3,4,5];

    var arr1 = arr.map(function(x){

        return x*x;                    //一对一的关系,传进来一个值,返回一个对应的值。

    })      //arr1 = [1,4,9,16,25]

6.for in:这种方法不仅数组本身元素将被遍历到,那些由用户添加的附加元素也将被遍历到,甚至连数组原型中的属性也将被遍历到。甚至在某些情况下,上面代码将会以任意顺序去遍历数组元素

    for…in是用于遍历包含键值对(key-value)的对象,对数组并不是那么友好。

    由于每次迭代操作要搜索实例或原型属性, for-in 循环会产生更多开销,因此执行速度比其他循环类型慢。

7.for of是由es6提出的,目的是作为遍历所有数据结构的统一方法。

    foreach是为便利数组而设计的,不能正确响应break、continue和return语句

    for in被设计用来枚举对象的属性的,遍历对象的属性

    for in用在数组上,除了遍历数组元素还会遍历自定义属性,甚至原型链上的属性,另外,遍历顺序是随机的

    for of语法同for in一样简洁,但避开了for in的缺陷

    跟for in不一样,数组的遍历器接口只返回具有数字索引的属性

    for in读取的是对象的键名,for of读取的是键值

    避开了foreach缺陷能正确响应break、continue和return语句

    提供遍历所有数据结构的统一方法。for of不仅可以遍历数组,还可以遍历Set、Map结构,某些类似数组的对象(如:argument对象、DOM NodeList对象),Generator对象,以及字符串。

四、归并方法

1.reduce::使用指定的函数将数组元素进行组合生成单个值。

求和:

    var arr = [1,2,3,4,5,5,5];

    var sum = arr.reduce(function(prev,curr,index,array){

        return prev+curr;

    })    //sum = 25

将多个数组合并成一个数组:

    var arr = [1,2,3,4,5],

    arr1 = [6,7,8,9],

    arr2 = [10,11,12];

    var newArr = [arr,arr1,arr2];

    var ret = newArr.reduce(function(a,b){

        return a.concat(b);

    })    // ret = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12]

2.reduceRigth:该方法的功能和reduce功能是一样的,不同的是 reduceRight() 从数组的末尾向前将数组中的数组项做累加。

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

备注:本文章仅供自我学习总结,感谢相关作者的分享:

https://segmentfault.com/a/1190000009985137

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

推荐阅读更多精彩内容