• Sep 30th-JavaScript的数组方法总结


    Js的Array包含多种数据类型,并且有指定的某个位置(索引)来访问每个元素。

    1.length属性

    var arr=[1,2,3.14,null,'hello',true];
    
    arr.length; //6

    ps:直接给Array的length值赋予一个新的值会导致Array的大小发生变化

    var arr=[1,2,3];
    
    arr.length;//3
    
    arr.length=6;
    
    arr;//arr变为[1, 2, 3, undefined × 3]
    
    arr.length=2;
    
    arr;//arr变为[1,2]

    2.Array的索引

    Array可以通过索引把对应的元素修改为新的值,因此,对Array的索引进行赋值会直接修改整个Array

    var arr=[1,2,3];
    arr[1]=99;
    arr;//arr变为[1,99,3]

    ps:如果索引赋值时,超过了本身array长度的范围,array的长度将引起变化。

    var arr=[1,2,3];
    arr[5]=99;
    arr;//arr变为[1,2,3,undefined,undefined,99]

    大多数其他编程语言不允许直接改变数组的大小,越界访问索引会报错。然而,JavaScript的Array却不会有任何错误。在编写代码时,不建议直接修改Array的大小,访问索引时要确保索引不会越界。

    3.indexOf()

    通过indexOf()来搜索某个元素的索引

    var arr=[20,30,40,'50'];
    arr.indexOf(20);//元素20的索引为0
    arr.indexOf(40);//元素30的索引为2
    arr.indexOf(50);//元素没有找到,返回-1
    arr.indexOf('50');//元素'50'的索引为3

    4.slice()

    截取array的部分元素,返回一个新的array

    var arr=['a','b','c','d','e','f','g','h'];
    arr.slice(0,3);//从索引0开始到索引3结束,但是不包括索引3 返回["a", "b", "c"]
    arr.slice(3);//从索引3开始到结束,返回["d", "e", "f", "g", "h"]

    ps:slice()的起止参数包括开始索引,不包括结束索引

    如果不给slice传递任何参数,它将从头到尾截取整个数组。利用这个,我们可以很快的copy到一整个数组。(标记)

    var arr=['a','b','c','d','e','f','g','h'];
    var aCopy=arr.slice();
    aCopy;//["a", "b", "c", "d", "e", "f", "g", "h"]
    aCopy=arr;//["a", "b", "c", "d", "e", "f", "g", "h"]
    aCopy==arr;//true
    aCopy === arr;//true

    5.push()和pop()

    push()是向array尾部添加若干元素,pop()则是把array最后一个元素删除掉。

    var arr=[1,2,3];
    arr.push('a','b');//返回5
    arr;//[1, 2, 3, "a", "b"]
    arr.pop();
    arr;//[1, 2, 3, "a"]
    arr.pop();arr.pop();arr.pop();arr.pop();//返回1
    arr;//[]
    arr.pop();//返回undefined
    arr;//[]

    6.unshift()和shift()

    unshift()是向array头部添加若干元素,pop()则是把array第一个元素删除掉。

    var arr=[1,2,3];
    arr.unshift('a','b');//返回5
    arr;//["a", "b", 1, 2, 3]
    arr.shift();//'a'
    arr;//["b", 1, 2, 3]
    arr.shift();arr.shift();arr.shift();arr.shift();//3
    arr;//[]
    arr.shift();//undefined
    arr;[]

    7.sort()

    如果调用该方法时没有使用参数,将按字母顺序对数组中的元素进行排序,说得更精确点,是按照字符编码的顺序进行排序。要实现这一点,首先应把数组的元素都转换成字符串(如有必要),以便进行比较。

    如果想按照其他标准进行排序,就需要提供比较函数,该函数要比较两个值,然后返回一个用于说明这两个值的相对顺序的数字。比较函数应该具有两个参数 a 和 b,其返回值如下:

    • 若 a 小于 b,在排序后的数组中 a 应该出现在 b 之前,则返回一个小于 0 的值。
    • 若 a 等于 b,则返回 0。
    • 若 a 大于 b,则返回一个大于 0 的值。
    var arr=['c','b','a'];
    arr.sort();
    arr;//['a','b','c']
    var arr=[1,100,233,322,3312,333];
    arr.sort();
    arr;//[1, 100, 233, 322, 3312, 333]

    以上代码是没有数字大小排序,如果想要按照数字大小排序,使用一个排序函数。

    function sortNumber(a,b){
        return a-b;
    }
    
    var arr=[1,22,342,566,10,389];
    arr.sort(sortNumber);
    arr;

    8.reverse()

    把整个数组反转,就是颠倒顺序。(标记)

    var arr=['d','d','a','uoui','hlkj','bn'];
    arr.reverse();
    arr;//["bn", "hlkj", "uoui", "a", "d", "d"]

    9.splice()

    splice()方法是修改Array的“万能方法”,它可以从指定的索引开始删除若干元素,然后再从该位置添加若干元素:

    var arr=['bmbjkh','uoi','da89','hkjh','kh','jklj'];
    
    //从索引为2的元素开始,删除3个元素,在加入两个元素
    arr.splice(2,3,'a','b');
    arr;//["bmbjkh", "uoi", "a", "b", "jklj"]
    
    //从索引为2的元素开始,删除2个元素,不添加任何元素
    arr.splice(2,2);//返回["a", "b"]
    arr;//["bmbjkh", "uoi", "jklj"]
    
    //所索引为2的元素开始,删除0个元素,添加其他元素
    arr.splice(2,0,'a','1','2');
    arr;//["bmbjkh", "uoi", "a", "1", "2", "jklj"]

    10.concat()

    concat()方法把当前的Array和另一个Array连接起来,并返回一个新的Array

    var arr=['a','b','c'];
    arr.concat([1,2,3]);//返回["a", "b", "c", 1, 2, 3],concat()方法并没有修改当前Array,而是返回了一个新的Array
    arr;//["a", "b", "c"]原数组并没有改变

    11.join()

    join()方法是一个非常实用的方法,它把当前Array的每个元素都用指定的字符串连接起来,然后返回连接后的字符串:

    var arr=['a','b','c',12,2,3];
    arr.join('*');//"a*b*c*12*2*3" 如果Array的元素不是字符串,将自动转换为字符串后再连接。
    arr;//["a", "b", "c", 12, 2, 3]

    12.多维数组

    如果数组的某个元素又是一个Array,则可以形成多维数组,例如:

    var arr = [[1, 2, 3], [400, 500, 600], '-'];
    //上述Array包含3个元素,其中头两个元素本身也是Array。

    学习-----------廖雪峰老师的官方网站

  • 相关阅读:
    Singleton模式
    c++ 的重载、覆盖、隐藏
    Facade模式
    c++ 函数设计
    Adapter模式
    php.ini之完全中文版
    用PHP使Web数据分析进入更高境界
    PHP缩略图生成程序
    PHP例解Webzine编辑和发送
    原创]HTML网页间利用JavaScript通过URL传递变量
  • 原文地址:https://www.cnblogs.com/gringe/p/4848474.html
Copyright © 2020-2023  润新知