JavaScript中数组详解

JavaScript中数组详解

数组

数组创建读写和长度

创建数组的方法有两种：一是使用数组字面量，简单来说就是在[]之中列出数组的所有元素：

​ 二是新建一个对象的实例。

<script>
    //第一种
	var var numberArray = [1,2,3,4,5];//数字数组
    var stringArray = ["java","script","edu","coder"];//字符串数组
    var mixArray = [1,2,"java",true,6.6];//混合数组	
    //第二种
    //情况下可以设置数组的长度（即数组中元素的个数），也可以不设置。
    var myArry=new Array();//创建一个初始为空的一个数组
    var ss=new Array(6);//创建一个长度为6的数组
</script>

数组的读取和写入

读取：存放读入值的变量放在左边，数组元素放在右边。

写入：数组元素在左边，待写值在右边：

<script>
    //读取
    var readArray = [1,3,"js",true,2.22];
	var read = readArray[0];//读取第一个元素到变量read中
	//写入
    var writeArray = [1,3,"js",true,2.22];
    writeArray[0] = 2;//在第一个元素的位置写入2
    console.log(writeArray[0]);//原来的1已经被覆盖，输出2
</script>

数组长度

数组长度指数组中元素的个数，等于最大索引值加1，数组的length属性即数组的长度。数组的长度也可以写入，当写入的值小于数组的实际长度时，数组会被删除一部分。大于实际长度时，数组会在尾部添加一些空的区域。

<script>
	var arrayLength = [1,"js",true];
	console.log(arrayLength.length);//输出3
    arrayLength.length = 2;
	console.log(arrayLength);//输出[1,"js"]
</script>

数组元素的增加：

尾部元素添加元素

最直观的方法就是直接给当前尾部元素后一个位置赋值

第二种方法就是受用push（）函数，往数组的末尾添加一个或多个元素，参数是要添加的元素，返回数组长度。

<script>
    //第一种
	var numberArray = [12,23,34,45];
    numberArray[numberArray.length] = 56;
    console.log(numberArray);//输出[12,23,34,45,56]
    //第二种
    var numberArray = [12,23,34,45];
    var newLength=numberArray.push(56);//返回值是数组的长度
    console.log(newLength);//输出5 
    console.log(numberArray);//输出[12,23,34,45,56]
</script>

头部添加元素

unshift()方法在数组的头部添加元素，并返回数组新的长度，其余元素自动向索引大的方向移动。

<script>
	var sArray = ["ja","va","script"];
    var newLength = sArray.unshift("he","llo");
    console.log(newLength)//输出5
    console.log(sArray);//输出["he","llo","ja","va","script"];
</script>

数组元素的删除

尾部元素的删除

第一种刚才介绍的方法，直接修改数组长度的值

第二种是使用delete运算符，delete运算符后接上要删除的元素，但是删除后会有一个空占位符，所以数据的长度保持不变

第三中方法是使用pop(),一次删除一个，并返回被删除的元素。

<script>
    //第二种
	var dArray=[11,22,33,44,55];
    delete.dArray[4];//产出索引最大的元素
	console.log(dArray);//输出[11,22,33,44]
    console.log(dArray.length);//长度为5
    //第三种
    var numberArray = [3,4,5,6,7];
    var c=numberArray.pop();
    console.log(deletedNumber);//输出被删除的元素7
	console.log(numberArray);//删除后的数组为[3,4,5,6]
</script>

头部元素的删除

shift()的作用是删除数组头部一个元素并返回该元素，然后所有元素往索引值小的方向移动一位。

<script>
	var dArray=[11,22,33,44,55];
    console.log(dArray.shift());输出11，并在数组删除11
    console.log(dArray);//输出[22,33,44,55]
</script>

数组的遍历和多维数组

forEach()方法 forEach()方法的参数是一个无名字的函数，函数有三个参数，第一个参数是当前的数组元素，第二个参数是当前的索引，第三个参数是数组对象的索引。与for循环的区别是无法用break中断循环。

<script>
	var numArr=[10,11,12,13,14];
    numArr.foreach(function(mem,i,arr){
                   mem*=10;
        			arr[i]=mem;
                   });
    console.log(numArr);//输出[100,110,120,130,140]
</script>

多维数组的实现

二维数组的创建 创建已知的二维数组

var multiArr = [[1,2,3,4],[5,6,7],[8,9]];

二维数组的读写 二维数组的读写用数组名[][]的方式，第一个中括号内为行数，从0计数，第二个中括号内为列数，也从0计数。 以上面的数组multiArr为例：

<script>
	//创建一个4行6列的二维数组
    var muArr = new Array(4);
    for(var i = 0;i <4;i++) {
        muArr[i] = new Array(6);
    }
    
    var multiArr = [[1,2,3,4],[5,6,7],[8,9]];
    console.log(multiArr[1][1]);//读元素，输出6
    multiArr[0][0] = 0;//写元素
</script>

查找元素的位置

根据值查找元素的位置，有两个方法：indexOf()和lastIndexOf()，前者从索引小处往大搜索，后者相反。都返回第一次遇到该元素时的索引。

两者都有两个参数，第一个参数为要查找的元素，第二个参数可选，为搜索的起点索引。

第二个参数可以是负数，-1表示倒数第一个元素，-2表示倒数第二个元素，依次类推。如：

<script>
	var search = ["a","b","a","b","c","d","a","a","b","a"];
    console.log(search.indexOf("a"));//输出0
    console.log(search.lastIndexOf("a"));//输出9
    console.log(search.indexOf("a",2));//输出2，从索引为2处开始搜索
    var search = ["a","b","a","b"];
    console.log(search.indexOf("a"，-3));//输出2
    console.log(search.lastIndexOf("a"，-3));//输出0
</script>

数组的合并

concat()实现数组合并，其形式是数组a.concat(数组b)，合并之后返回新数组，新数组为数组a后面连接数组b，但是数组a和b不变。

<script>
	var a = [1,2,3];
    var b = [4,5,6];
    var c = a.concat(b);//合并后返回新数组
    console.log(c);//输出[1,2,3,4,5,6]
</script>

数组倒置

reverse()实现数组倒置，无参数，返回倒置后的数组，同时调用该方法的数组也会被倒置。称为就地逆置。

<script>
	var a = [1,2,3,4];
    var b = a.reverse();
    console.log(a);//输出[4,3,2,1]
    console.log(b);//输出[4,3,2,1]
</script>

元素合并

join()将数组的所有元素连接起来组成字符串，参数为元素之间的分隔符，默认逗号。

<script>
	var sArray = ["June","July","August"];
    console.log(sArray.join());//输出June,July,August
    console.log(sArray.join("+"));//输出June+July+August
</script>

元素排序

sort()实现数据元素排序，不带该参数表示元素按照ASCII表从小到大排序

<script>
	var stringArray = ["a","ab","b","aa"];
    stringArray.sort();
    console.log(stringArray);//输出["a","aa","ab","b"]
    //需要注意的是数字的排序，例子如下：
    var arr = [1,2,10,5,12];
    arr.sort();
    console.log(arr);//输出[1,10,12,2,5];
   //参数的格式如下：arr是要排序的数组；a，b是两个参数，返回a-b，升序排列，返回b-a，降序排列。
    arr.sort(function(a,b){
                return a-b;  //升序排列
    })
    arr.sort(function(a,b){
            return b-a;  //降序排列
	})
</script>

提取子数组

slice()返回切割出的子数组，不修改原来的数组。

它有两个整数参数a和b，a表示切割的起点，该点属于子数组；b可选，表示切割的终点，该点不属于子数组。

a和b都可以为负数，如-1表示倒数第一个位置，依次类推。

<script>
	var arr = ["a","b","c","d","e"];
    console.log(arr.slice(0,3));//["a","b","c"]
    console.log(arr.slice(0,-2));//["a","b","c"]
    console.log(arr.slice(4));//["e"]
    console.log(arr.slice(-4));//["b","c","d","e"]
</script>