JavaScript 数组


一、数组的创建、读写和长度

数组的出现就是为了批量处理数据。

1、数组的创建

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

var numberArray = [1,2,3,4,5];//数字数组
var stringArray = ["java","script","edu","coder"];//字符串数组
var mixArray = [1,2,"java",true,6.6];//混合数组

如上,各元素之间用,隔开。JavaScript中数组的元素可以是不同的数据类型,如上面的第三个数组。
创建数组的第二种方法是新建一个Array对象的实例,如:

var myArray = new Array();//创建一个初始为空的数组
var lengthMixArray = new Array(6);//创建一个长为6的数组

这种情况下可以设置数组的长度(即数组中元素的个数),也可以不设置。

2、数组元素的读取和写入

数组元素的读取和写入在形式上相似,都是用赋值符号连接的两个表达式。

读取时,存放读入值的变量在左边,数组元素在右边:

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

3、数组长度

数组长度指数组中元素的个数,等于最大索引值加1,数组的length属性即数组的长度。

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

数组的长度也可以写入,当写入的值小于数组的实际长度时,数组会被删除一部分。大于实际长度时,数组会在尾部添加一些空的区域。

arrayLength.length = 2;
console.log(arrayLength);//输出[1,"js"]

二、数组元素的增减

数组元素的增删是JavaScript的一个特点,因为其他很多编程语言的数组是不允许增加或者删除元素的。

1、数组元素的增加

在JavaScript中,为数组增加元素可以在数组头部(索引最小处)或者尾部进行,可以使用数组的方法或者直接使用运算符

(1)在尾部添加元素

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

var numberArray = [12,23,34,45];
numberArray[numberArray.length] = 56;
console.log(numberArray);//输出[12,23,34,45,56]

第二种方法是使用push()函数,往数组的末尾添加一个或多个元素,参数是要添加的元素,返回数组长度。

//利用push()方法在数组尾部添加元素
var numberArray = [12,23,34,45];
var newLength = numberArray.push(56);
console.log(newLength);//输出5
console.log(numberArray);//输出[12,23,34,45,56]

(2)在头部添加元素

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

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

2、数组元素的删除

删除也能在数组头部(索引值小)或者尾部进行。

1、在尾部删除元素

第一种:直接修改数组长度为更小的值。

var array = [1,2,true,"hello"];
array.length = 3;//索引最大的元素被删除
console.log(array);//输出[1,2,true]

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

var dArray = [11,22,33,44,55];
delete dArray[4];//删除索引最大的元素
console.log(dArray);//输出[11,22,33,44]
console.log(dArray.length); //长度为5

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

//利用pop()方法在数组尾部删除元素
var numberArray = [3,4,5,6,7];
var deletedNumber = numberArray.pop();
console.log(deletedNumber);//输出被删除的元素7
console.log(numberArray);//删除后的数组为[3,4,5,6]

(2)在头部删除元素

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

初学者很容易混淆这两个方法,建议记住shift单词的意思是:删除,去掉。

var dArray = [11,22,33,44,55];
console.log(dArray.shift());//输出11,11被从数组中删除
console.log(dArray);//输出[22,33,44,55]

三、数组的遍历和多维数组

1、数组的遍历

数组的遍历指按顺序访问你数组的每一个元素。有两种方法

(1)使用for循环

//依次在浏览器的控制台输出one,two,three,four
var stringArray = ["one","two","three","four"];
for(var i=0,sLength=stringArray.length;i<sLength;i++) {
    console.log(stringArray[i]);
}

(2)使用forEach()方法

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

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]

2、多维数组的实现

多维数组实际上就是数组的数组,指数组的每一个元素也是一个数组,这里仅讨论二维数组。

JavaScript中二维数组的列的长度不唯一,第一列可以有4个元素,第二列可以有5个元素,等等。
二维数组的创建 创建已知的二维数组:

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

创建仅知道长度的二维数组:

//创建一个4行6列的二维数组
var muArr = new Array(4);
for(var i = 0;i <4;i++) {
    muArr[i] = new Array(6);
}

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

var multiArr = [[1,2,3,4],[5,6,7],[8,9]];
console.log(multiArr[1][1]);//读元素,输出6
multiArr[0][0] = 0;//写元素

四、数组的常用方法

(1)查找元素的位置

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

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

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处开始搜索

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

var search = ["a","b","a","b"];
console.log(search.indexOf("a"-3));//输出2
console.log(search.lastIndexOf("a"-3));//输出0

(2)数组的合并

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

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

(3)数组倒置

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

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

(4)元素合并

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

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

(5)元素排序

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

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.sort(function(a,b){
            return a-b;  //升序排列
})

或者:

arr.sort(function(a,b){
            return b-a;  //降序排列
})

说明:
arr是要排序的数组;
a,b是两个参数,返回a-b,升序排列,返回b-a,降序排列。
对于数字的排序,sort()带参数和不带参数是不一样的,例子如下:

var arr = [1,2,10,5,12];
arr.sort();
console.log(arr);//输出[1,10,12,2,5]
arr.sort(function(a,b){
     return a-b;
});
console.log(arr);//输出[1,2,5,10,12]

(6)提取子数组

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

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

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

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"]

  • 3
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

长街395

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值