JavaScript Array数组对象属性及方法汇总

JavaScript Array数组对象属性及方法汇总

Array 对象

Array 对象用于在单个的变量中存储多个值。
创建 Array 对象的语法：

new Array();
new Array(size);
new Array(element0, element1, ..., elementn);

参数

参数 size 是期望的数组元素个数。返回的数组，length 字段将被设为 size 的值。

参数 element ..., elementn 是参数列表。当使用这些参数来调用构造函数 Array() 时，新创建的数组的元素就会被初始化为这些值。它的 length 字段也会被设置为参数的个数。

返回值

返回新创建并被初始化了的数组。

如果调用构造函数 Array() 时没有使用参数，那么返回的数组为空，length 字段为 0。

当调用构造函数时只传递给它一个数字参数，该构造函数将返回具有指定个数、元素为 undefined 的数组。

当其他参数调用 Array() 时，该构造函数将用参数指定的值初始化数组。

当把构造函数作为函数调用，不使用 new 运算符时，它的行为与使用 new 运算符调用它时的行为完全一样。

Array对象属性

Array 对象方法

1、concat()：连接两个或更多的数组，并返回结果。

定义和用法

concat() 方法用于连接两个或多个数组。

该方法不会改变现有的数组，而仅仅会返回被连接数组的一个副本。

语法

arrayObject.concat(arrayX,arrayX,……,arrayX)

arrayX ：必需参数。该参数可以是具体的值，也可以是数组对象。可以是任意多个。

返回值

返回一个新的数组。该数组是通过把所有 arrayX 参数添加到 arrayObject 中生成的。如果要进行 concat() 操作的参数是数组，那么添加的是数组中的元素，而不是数组。

var arr1 = [1, 2, 3]
var newArr1 = arr1.concat(4, 5, 6);
document.write(newArr1 + "<br>"); //1,2,3,4,5,6

var arr2 = ['a', 'b', 'c'];
var newArr2 = arr1.concat(arr2);
document.write(newArr2 + "<br>"); //1,2,3,a,b,c

var arr3 = ['la', 'la', 'la'];
var newArr3 = arr1.concat(arr2, arr3);
document.write(newArr3 + "<br>"); //1,2,3,a,b,c,la,la,la

2、join()：把数组的所有元素放入一个字符串。元素通过指定的分隔符进行分隔。

定义和用法

join() 方法用于把数组中的所有元素放入一个字符串。然后元素通过指定的分隔符进行分隔。

语法
arrayObject.join(separator)
separator：可选。指定要使用的分隔符。如果省略该参数，则使用逗号作为分隔符。

返回值

返回一个字符串。该字符串是通过把 arrayObject 的每个元素转换为字符串，然后把这些字符串连接起来，在两个元素之间插入 separator 字符串而生成的。

var arr4 = new Array();
arr4[0] = "Wangwei";
arr4[1] = "hahha";
arr4[2] = "lalala";
arr4[3] = "eeeeee";

document.write(arr4.join()); //Wangwei,hahaha,lalala,eeeeee
document.write("<br>");
document.write(arr4.join('/')); //Wangwei/hahaha/lalala/eeeeee

3、pop()、push()、shift()、unshift()

     * pop(): 删除并返回数组的最后一个元素
     * push()：向数组的末尾添加一个或更多元素，并返回新的长度。
     * shift()：删除并返回数组的第一个元素
     * unshift()：向数组的开头添加一个或更多元素，并返回新的长度。

var arr5 = ['lili', 'mary', 'lina', 'bob', 'androw'];
document.write(arr5.pop() + "<br>"); //androw
document.write(arr5 + "<br>"); //lili,mary,lina,bob(arr5已经改变)
document.write(arr5.push('lala', 'hahaha') + "<br>"); //6
document.write(arr5 + "<br>"); //lili,mary,lina,bob,lala,hahaha
document.write(arr5.shift() + "<br>"); //lili
document.write(arr5 + "<br>"); //mary,lina,bob,lala,hahaha
document.write(arr5.unshift('1', '2', '3') + "<br>"); //8
document.write(arr5 + "<br>"); //1,2,3,mary,lina,bob,lala,hahaha

4、slice()、splice()

slice() 从某个已有的数组返回选定的元素
splice() 删除元素，并向数组添加新元素。

//slice()方法
/*
 * slice()方法可以 接受一或两个参数，即要返回项的起始和结束位置。
 * 在只有一个参数的情况下，slice()方法返回从该 参数指定位置开始到当前数组末尾的所有项
 * 如果有两个参数，该方法返回起始和结束位置之间的项— —但不包括结束位置的项。
 * 注意，slice()方法不会影响原始数组
 */
var colors = new Array();
colors = ["red", "green", "blue"];

var color1 = colors.slice(0, 2);
document.write(colors + "<br>"); //red,green,blue
document.write(color1); //red,green
document.write("<br>");

//splice()方法
/*
 * 删除：可以删除任意数量的项，只需指定 2 个参数：要删除的第一项的位置和要删除的项数
 * 会影响原始数组
 */
var fruits = ["apple", "mango", "banana", "pear"];
var fruit1 = fruits.splice(0, 2);
document.write(fruits + "<br>"); //banana,pear
document.write(fruit1); //返回删除的项apple,mango
document.write("<br>");
/*
 * 插入：可以向指定位置插入任意数量的项，只需提供 3个参数：
 * 起始位置、0（要删除的项数） 和要插入的项
 */
var fruit2 = ["apple", "mango", "banana", "pear"];
var fruit3 = fruit2.splice(2, 0, "strawberry", "lalala");
document.write(fruit2 + "<br>");//apple,mango,strawberry,lalala,banana,pear
document.write(fruit3 + "<br>");//未删除项，所以返回空数组
/*
 * 替换：可以向指定位置插入任意数量的项，且同时删除任意数量的项，
 * 只需指定 3 个参数：起 始位置、要删除的项数和要插入的任意数量的项。
 * 插入的项数不必与删除的项数相等。
 */
var fruit4 = ["apple", "mango", "banana", "pear"];
var fruit5 = fruit4.splice(1, 2, "aaa", "bbb", "ccc");
document.write("<br>" + fruit4 + "<br>");//apple,aaa,bbb,ccc,pear
document.write(fruit5);  // 返回删除的项mango,banana

5、indexOf()、lastIndexOf()

/*
 * indexOf()和lastIndexOf()方法
 * 这两个方法都接收 两个参数：要查找的项和（可选的）表示查找起点位置的索引
 * indexOf()方法从数组的开头（位 置 0）开始向后查找
 * lastIndexOf()方法则从数组的末尾开始向前查找
 */
var arr = ["apple", "mango", "banana", "pear", "mango"];
var arr1 = arr.indexOf("mango", 1); //从位置1开始向后查找
alert(arr1); //1
var arr2 = arr.indexOf("mango", 2); //从位置2开始向后查找
alert(arr2);  //4

//lastIndexOf()
var arr3 = arr.lastIndexOf("mango", 2); //从位置2开始向前查找
alert(arr3);  //1
var arr4 = arr.lastIndexOf("mango", 4); //从位置4开始向前查找
alert(arr4); //4

5、reverse()、sort()

reverse() 颠倒数组中元素的顺序。

//反转数组reverse()方法
var arr1 = new Array();
arr1 = [5, 4, 3, 2 ,1];
var arr2 = arr1.reverse();
document.write(arr2); //1,2,3,4,5

sort() 方法用于对数组的元素进行排序。
语法
arrayObject.sort(sortby)

参数 描述
sortby 可选。规定排序顺序。必须是函数。

返回值

对数组的引用。请注意，数组在原数组上进行排序，不生成副本。

说明

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

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

若 a 小于 b，在排序后的数组中 a 应该出现在 b 之前，则返回一个小于 0 的值。
若 a 等于 b，则返回 0。
若 a 大于 b，则返回一个大于 0 的值。

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
    </head>
    <body>
        <script type="text/javascript">
            //反转数组reverse()方法
            var arr1 = new Array();
            arr1 = [5, 4, 3, 2 ,1];
            var arr2 = arr1.reverse();
            document.write(arr2); //1,2,3,4,5
            document.write("<br>");

            //sort方法，不添加函数参数，对字母进行比较
            var arr = new Array(6)
            arr[0] = "George"
            arr[1] = "John"
            arr[2] = "Thomas"
            arr[3] = "James"
            arr[4] = "Adrew"
            arr[5] = "Martin"
            document.write(arr + "<br />"); //George,John,Thomas,James,Adrew,Martin
            document.write(arr.sort());//Adrew,George,James,John,Martin,Thomas
            document.write("<br />");

            //sort方法，不添加函数参数，对数字字符进行比较
            var arr = new Array(6);
            arr[0] = "10"
            arr[1] = "5"
            arr[2] = "40"
            arr[3] = "25"
            arr[4] = "1000"
            arr[5] = "1"
            document.write(arr + "<br />");//10,5,40,25,1000,1
            document.write(arr.sort());//1,10,1000,25,40,5
            document.write("<br />");

            //数组比较，升序函数
            function compare1(value1, value2) {
                if(value1 < value2) {
                    return -1;
                }
                else if(value1 > value2) {
                    return 1;
                }
                else return 0;
            }
            //降序函数
            function compare2(value1, value2) {
                if(value1 < value2) {
                    return 1;
                }
                else if(value1 > value2) {
                    return -1;
                }
                else {
                    return 0;
                }
            }
//          把compare1函数传递给sort()方法
            var arr3 = [12, 19, 1, 8, 6, 17];
            arr3.sort(compare1);
            alert(arr3); //1, 6, 8, 12, 17, 19

            var arr4 = new Array();
            arr4 = [1, 3, 5, 2, 19, 12];
            arr4.sort(compare2);
            alert(arr4); //19, 12, 5, 3, 2, 1

    //对于数值类型或者其 valueOf()方法会返回数值类型的对象类型，可以使用一个更简单的比较函 数。这个函数只要用第二个值减第一个值即可。 
            function compare(value1, value2){
                return value2 - value1;
            }

            //用函数的方法使得数组按照给定的属性名称进行排序
            var arr5 = new Array();
            arr5 = [{
                "name": "WangWei",
                "age": 21
            },
            {
                "name": "GuiKe",
                "age": 22
            }];
            function compareByAttr(propertyName) {
                return function(obj1, obj2) {
                    var value1 = obj1[propertyName];
                    var value2 = obj2[propertyName];
                    if(value1 < value2 ) {
                        return -1;
                    }else if(value1 > value2) {
                        return 1;
                    }else {
                        return 0;
                    }
                }
            }
            //调用函数
            //按姓名排序
            /*
             * GuiKe:22
             * WangWei:21
             */
            var arr6 = arr5.sort(compareByAttr("name"));
            for(var i=0; i<arr6.length; i++) {
                document.write(arr6[i].name + ":");
                document.write(arr6[i].age + "<br>");
            }
            //按年龄排序
             /*
             * WangWei:21
             * GuiKe:22
             */
            var arr7 = arr5.sort(compareByAttr("age"));
            for(var j=0; j<arr7.length; j++) {
                document.write(arr7[j].name + ":"); //22 21
                document.write(arr7[j].age + "<br>");
            }
        </script>
    </body>
</html>

6、toString()、toLocaleString()

toString() 把数组转换为字符串，并返回结果。

定义和用法
toString() 方法可把数组转换为字符串，并返回结果。

语法
arrayObject.toString()

返回值
arrayObject 的字符串表示。返回值与没有参数的 join() 方法返回的字符串相同。

说明
当数组用于字符串环境时，JavaScript 会调用这一方法将数组自动转换成字符串。但是在某些情况下，需要显式地调用该方法。

<script type="text/javascript">
    var arr = new Array(3);
    arr[0] = "George";
    arr[1] = "John";
    arr[2] = "Thomas";

    document.write(arr.toString()); //George,John,Thomas

</script>

toLocaleString() 把数组转换为本地数组，并返回结果。
valueOf() 返回数组对象的原始值
toSource() 返回该对象的源代码。