资讯专栏INFORMATION COLUMN

javascript中Array常用方法总结

harriszh / 513人阅读

摘要:函数接受个参数前一个值,当前值,项索引,数组本身。更多数组方法请看

js内置对象之Array

一,会改变原数组 1.移除数组末尾最后一项.pop()

返回删除的元素

如果你在一个空数组上调用 pop(),它返回 undefined

    let word = ["a", "b", "c", "d"];  
    let newArr = word.pop();  
    console.log(word);      //["a", "b", "c"]  
    console.log(newArr);    //d  
  
    let nullArr = [];  
    console.log(nullArr.pop()); //undefined  
2.在数组末尾添加一个或多个元素.push()

返回修改后数组长度

    let word = ["a", "b", "c", "d"];  
    let newArr = word.push("e","f");  
    console.log(word);      //["a", "b", "c", "d", "e", "f"]  
    console.log(newArr);    //6
3.移除数组第一项.shift()

返回移除的元素

    let word = ["a", "b", "c", "d"];  
    let newArr = word.shift();  
    console.log(word);      //["b", "c", "d"]  
    console.log(newArr);    //a 
4.在数组头部添加一个或多个元素.unshift()

返回修改后数组长度

    let word = ["a", "b", "c", "d"];  
    let newArr = word.unshift("11","22");  
    console.log(word);      //["11", "22", "a", "b", "c", "d"]  
    console.log(newArr);    //6 
5.对数组元素排序.sort()

返回排序后的数组

默认排序顺序是根据字符串Unicode码点

    let fruit = ["cherries", "apples", "bananas"];  
    console.log(fruit.sort());       // ["apples", "bananas", "cherries"]  
      
    let scores = [1, 10, 21, 2];   
    console.log(scores.sort());  
    // [1, 10, 2, 21]  
    // 注意10在2之前,  
    // 因为在 Unicode 指针顺序中"10"在"2"之前  
  
    let things = ["word", "Word", "1 Word", "2 Words"];  
    console.log(things.sort());   
    // ["1 Word", "2 Words", "Word", "word"]  
    // 在Unicode中, 数字在大写字母之前,  
    // 大写字母在小写字母之前.  
  
    function compare(a, b) {  
        if(a < b) {  
            return -1;  
        }else if(a > b) {  
            return 1;  
        }else {  
            return 0;  
        }  
    }  
    let num = [1, 10, 21, 2];  
    console.log(num.sort(compare)); //[1, 2, 10, 21]
6.颠倒数组元素.reverse()

返回颠倒后的数组

    let word = ["a", "b", "c", "d"];  
    let newArr = word.reverse();  
    console.log(word);      //["d", "c", "b", "a"]  
    console.log(newArr);    //["d", "c", "b", "a"]  
7.删除或插入元素.splice()

返回数组删除的项

没有删除的项,返回空数组

    var word = ["a", "b", "c", "d"];  
    //删除,前闭后开  
    var newArr = word.splice(0,2);  
    console.log(word);      //["c", "d"]  
    console.log(newArr);    //["a", "b"]  
  
    //插入,当前数组索引1处插入hello  
    var newArr = word.splice(1,0,"hello");  
    console.log(word);      //["c", "hello", "d"]  
    console.log(newArr);    //[]  
  
    //替换  
    var newArr = word.splice(1,1,"world");  
    console.log(word);      //["c", "world", "d"]  
    console.log(newArr);    //["hello"]  
二,不会改变原数组 1.合并两个或多个数组.concat()

返回新数组

    let word = ["a", "b", "c", "d"];  
    let word2 = ["hello","world"];  
    let newArr = word.concat(word2);  
    console.log(word);      //["a", "b", "c", "d"]  
    console.log(newArr);    //["a", "b", "c", "d", "hello", "world"] 
2.将数组所有元素连接成一个字符串.join()

返回连接后的字符串

    let word = ["a", "b", "c", "d"];  
    let newArr = word.join("---");  
    console.log(word);      //["a", "b", "c", "d"]  
    console.log(newArr);    //a---b---c---d  
3.截取数组元素到新数组中.slice()

返回新数组

    let word = ["a", "b", "c", "d"];  
    //原数组索引为1开始截取后面所有元素  
    let newArr = word.slice(1);  
    console.log(word);      //["a", "b", "c", "d"]  
    console.log(newArr);    //["b", "c", "d"]  
      
    //截取原数组索引为1到3之间的元素,前闭后开  
    let newArr2 = word.slice(1,3);  
    console.log(word);      //["a", "b", "c", "d"]  
    console.log(newArr2);    //["b", "c"]  
  
    //截取原数组倒数第三个元素与倒数第一个元素之间的元素,前闭后开  
    let newArr3 = word.slice(-3,-1);  
    console.log(word);      //["a", "b", "c", "d"]  
    console.log(newArr3);    //[["b", "c"]  
4.获取查询元素第一次出现的索引.indexOf()

找不到查询元素,则返回-1

    let word = ["a", "b", "b", "c", "d"];  
    let index = word.indexOf("b");      //1,第一次出现b的索引值  
    let index2 = word.indexOf("hello"); //-1  
    console.log(index);  
    console.log(index2);  
5.获取查询元素最后一次出现的索引.lastIndexOf()

找不到查询元素,则返回-1

    let word = ["a", "b", "b", "c", "d"];  
    let index = word.lastIndexOf("b");      //2,最后一个b的索引值为2  
    let index2 = word.lastIndexOf("hello"); //-1  
    console.log(index);  
    console.log(index2);  
6.toString()返回由数组每个元素的字符串形式拼接而成的以逗号分隔的字符串
    let word = ["a", "b", "b", "c", "d"];  
    let str = word.toString();      //a,b,b,c,d  
    console.log(str);  
7.toLocaleString()返回一个字符串表示数组中的元素,更多了解查看MDN 三,迭代方法

每个方法接受含有三个参数的函数,三个参数为:数组中的项,元素索引,数组本身

1.every(),数组所有元素都满足要求则返回true,否则返回false
2.some(),只要有满足要求的就返回true
3.filter(),返回过滤后的结果数组
4.map(),返回在函数中处理过的数组
5.forEach(),遍历整个数组

    var number = [1,2,3,4,5,6,7,8];  
    var res = number.every(function(item, index, array) {  
        return (item > 2);  
    })  
    console.log(res);   //false  
  
    var res = number.some(function(item, index, array) {  
        return (item > 2);  
    })  
    console.log(res);   //true  
  
    var res = number.filter(function(item, index, array) {  
        return (item > 2);  
    })  
    console.log(res);   //[3, 4, 5, 6, 7, 8]  
  
    var res = number.map(function(item, index, array) {  
        return (item * 2);  
    })  
    console.log(res);   //[2, 4, 6, 8, 10, 12, 14, 16]  
  
    var res = number.forEach(function(item, index, array) {  
        //执行某些操作 
    })  
四,归并方法

迭代数组所有项,构建最终返回值,每个方法接受两个参数:调用的函数和作为归并基础的初始值。函数接受4个参数:前一个值,当前值,项索引,数组本身。函数返回的值都会作为第一个参数自动传给下一项,第一次迭代从数组第二项开始,当前值为数组第二项

1.reduce(),从数组第一项开始遍历到最后
2.reduceRight(),从数组最后一项开始遍历到第一项

     /* 
        开始执行回调函数cur为2,prev为1, 
        第二次执行回调函数,在之前的基础上加1 
        函数返回的值都会作为一个参数传给下一项, 
        最后执行函数时就是28+8 
    */  
    var number = [1,2,3,4,5,6,7,8];  
    var res = number.reduce(function(prev, cur, index, array) {  
        return prev + cur;  
    })  
    console.log(res);   //1+2+3+4+5+6+7+8=36  
  
    var res = number.reduceRight(function(prev, cur, index, array) {  
        return prev + cur;  
    })  
    console.log(res);   //8+7+6+5+4+3+2+1=36  
五,结束语

数组是除了函数对象之外在js中使用最多的数据类型,掌握一些数组中常用方法在使用js做开发时还是会有帮助的,而且有些面试中也会问到相关问题,比如数组操作方法中哪些会改变原数组,哪些不会。更多数组方法请看MDN

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/93669.html

相关文章

  • (转)JavaScrit常用数组算法总结

    摘要:原文地址不管是在面试中还是在笔试中,我们都会被经常问到关于数组的一些算法,比方说数组去重数组求交集数组扰乱等等。今天抽点时间把中的一些常用的数组算法做一下总结,以方便大家面试笔试或者日常开发过程中用到。 原文地址:http://www.cnblogs.com/front-... 不管是在面试中还是在笔试中,我们都会被经常问到关于javascript数组的一些算法,比方说数组去重、数组求...

    warnerwu 评论0 收藏0
  • JavaScriptArray方法的详细总结常用数组操作(附完整示例)

    摘要:数组索引只是具有整数名称的枚举属性,并且与通用对象属性相同。利用的解构赋值解构赋值尾递归优化递归非常耗内存,因为需要同时保存成千上百个调用帧,很容易发生栈溢出。而尾递归的实现,往往需要改写递归函数,确保最后一步只调用自身。 一.前言 因为在工作当中,经常使用到js的数组,而其中对数组方法的使用也是很频繁的,所以总是会有弄混或者概念不够清晰的状况,所以,写下这篇文章整理一番,本文有对几乎...

    Alfred 评论0 收藏0
  • JavaScript数组——常用数组方法汇总

    摘要:本文记录关于数组的一些常用方法,搜集总结。对于数组中的每个元素,都会调用函数一次。返回值是一个新数组,其中的每个元素均为关联的原始数组元素的回调函数返回值。 本文记录关于js数组的一些常用方法,搜集总结。 主要思路: 1. 方法功能是什么 2. 传递的参数是什么 3. 返回值是什么 4. 原来的数组是否改变 第一组:关于数组的增加、删除和修改 1.push 向数组末尾增加新的...

    HollisChuang 评论0 收藏0
  • JavaScript:对Object对象的一些常用操作总结

    摘要:一可以用作对象的复制可以用作对象的合并注意目标对象自身也会改变。对象四返回一个数组,包括对象自身的不含继承的所有可枚举属性不含属性的键名。该方法返回被冻结的对象。方法判断一个对象是否被冻结。 JavaScript对Object对象的一些常用操作总结。 一、Object.assign() 1.可以用作对象的复制 var obj = { a: 1 }; var copy = Object....

    马龙驹 评论0 收藏0
  • JavaScript-总结常用代码书写规范

    摘要:函数声明应该在作用域的顶层。数组和对象字面量用数组和对象字面量来代替数组和对象构造器。数组构造器很容易让人在它的参数上犯错。推荐对象构造器不会有类似的问题,但是为了可读性和统一性,我们应该使用对象字面量。 javascript 代码规范 代码规范我们应该遵循古老的原则:能做并不意味着应该做。 全局命名空间污染 总是将代码包裹在一个立即的函数表达式里面,形成一个独立的模块。 不推荐 va...

    Berwin 评论0 收藏0

发表评论

0条评论

harriszh

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<