JS--JavaScript数组Array(join、split、reverse、concat、slice)详解

小灰灰 2021-08-13 11:52 427阅读 0赞

#### JavaScript数组 ####

数组（Array）是一组有序数据集合，拥有大量方法，适合完成一些复杂的运算。

#### 定义数组 ####

定义数组通过构造函数Array()和运算符new来实现，具体方法如下：

**1. 定义空数组：**

var a = new Array();

通过这种方式定义的数组是 一个没有任何元素的空数组。

**2. 定义带有参数的数组：**

var a = new Array(1,2,3,"4","5");

数组中的每个参数都表示一个元素值，数组的元素**没有类型限制**。可以通过数组下标来定位每个元素。通过数组的length属性确定数组的长度。

**3. 定制指定长度的数组：**

var a = new Array(6);

采用这种方式定义的数组拥有指定的元素个数，但是没有为元素初始化赋值，这时它们的初始值都是undefined。

定义数组时，可以省略new运算符，直接使用Array()函数来实现。

**4. 定义数组直接量：**

var a = [1, 2, 3, "4","5"];

#### 存取数组元素 ####

使用\[\]运算符可以存取数组元素的值。同时可以修改元素的值。

var a = [1, 2,3,"4", "5"];
    a[2] = 2;
    alert(a[2]);

使用length属性和数组下标，可以遍历数组元素，从而实现动态控制数组元素。

var str = "";
    var a = [1,2,3,"4","5"];
    for(var i = 0; i < a.length; i++){ 
    	str += a[i] + "-";
    }
    document.write(a + "<br/>");
    document.write(str);

**1. 改变数组的长度：**  
数组的大小不是固定的，可以动态增加或删除数组元素。

var a = [1,2,3,4,5];
    a.length = 4;
    document.write(a);

当改变数组的长度时，会自动在数组的末尾增加或删除元素，以实现改变数组的大小。  
**使用delete运算符**可以删除数组元素的值，但是不糊i改变length属性的值。

**2. 使用push()和pop()方法来操作数组：**

*  push()：在数组末尾插入一个或多个元素
 *  pop()：从末尾依次取出一个或多个元素，并从数组中删除掉

var a = [];
    a.push(1,2,3);//得到a[1,2,3]
    a.push(4,5);	//得到a[1,2,3,4,5]
    a.pop();		//得到a[1,2,3,4]

**3. 使用unshift()和shift()方法：**  
unshift()和shift()方法与push()和pop()方法类似，但是是作用于数组头部

var a = [];
    a.unshift(1,2,3);//得到a[1,2,3]
    a.unshift(4,5);	//得到a[4, 5,1,2,3]
    a.shift();		//得到a[5,1,2,3]

**4. 使用splice()方法：**  
该方法是一个通用删除和插入元素的方法，它可以在数组指定的位置开始删除或插入元素。  
splice()方法包含3个参数：  
1：只当插入的起始位置  
2：指定要删除元素的个数  
3：第三个参数开始表示插入的具体元素

var a = [1,2,3,4,5,6];
    var b = a.splice(2,2);
    document.write(a + "<br />");	//输出[1,2,5,6]
    document.write(b);				//输出[3,4]

### 数组应用 ###

**1. 数组与字符串互转：**  
示例：使用join()方法可以把数组转换为多种形式的字符串。join()方法包含一个参数，用来定义合并元素的连接字符。如果join()方法不提供参数，则默认使用逗号。

var a = [1,2,3,4,5];
    a = a.join("-");
    document.write("a类型 = " + typeof(a) + "<br/>");
    document.write("a的值 = " + a);

![在这里插入图片描述][20190922191100119.png]

示例：使用split()方法把字符串劈开为一个数组，该方法包含两个参数：  
1：指定劈开的分隔符  
2：指定返回数组的长度

var a = [1,2,3,4,5];
    a = a.join("-");
    var s = a.split("-");
    document.write("s类型 = " + typeof(s) + "<br/>");
    document.write("s的值 = " + s);

![在这里插入图片描述][20190922191318529.png]

#### 数组排序 ####

使用reverse()方法可以颠倒数组元素的顺序。该方法是在元素组基础上进行操作的，不会新建数组。

var a = [1,2,3,4,5];
    var a = a.reverse();
    document.write(a);//输出[5,4,3,2,1]

sort方法能够对于数组中的元素进行排序，排序的方法通过其参数来决定。这个参数是一个比较两个元素值的闭包。如果省略参数，则sort()方法将默认的规则对数组进行排序。

var a = [3,2,5,1,4];
    var f = function(x,y){ 
    	return y - x;
    };
    var b = a.sort(f);
    document.write(b);//输出[5,4,3,2,1]

#### 连接数组 ####

concat()方法能够把该方法中的参数追加到指定数组中，形成一个新的连接数组。

var a = [1,2,3,4,5];
    var b = a.concat(4,5);
    document.write(b);  //输出[2,3,4,5,6,4,5]
    
    var a = [1,2,3,4,5];
    var b = a.concat([4,5],[1,[2,3]]);
    document.write(b);//输出[1,2,3,4,5,4,5,1,2,3]

#### 截取子数组 ####

slice()方法将返回数组中指定的片段，所谓片段就是数组中的一个子数组。  
该方法包含两个参数，它们指定要返回子数组在原数组中的起止点：  
1：指定的元素是被截取的范围之内  
2：指定的元素不在被截取的范围之内  
（左闭右开）

var a = [1,2,3,4,5,6,7,8,9];
    var b = a.slice(2, 5);
    document.write(b);//输出[3,4,5]

[20190922191100119.png]: /images/20210813/0cc3bb73b12b47fdb03ce9b11a665357.png
[20190922191318529.png]: /images/20210813/c8c8454ac332476b9446967d3df99825.png