javascript中数组及常见操作方式

js中遇到数组是很常见的事情,处理数组也是进阶前端必经之路,很多只会html和css的朋友就怕遇见数组,不知道怎么处理,七娃也处于这样的过渡期,为方便自己加深对数组的理解和使用,所以整理出这篇博客!

数组,用来在单独的变量名中存储一系列的值。换句话说,就是存放各种数据的地方。


定义数组:

第一种定义数组如下:

var mycars=new Array()
mycars[0]="Saab"
mycars[1]="Volvo"
mycars[2]="BMW"

第二种定义方式如下:

var mycars=new Array("Saab","Volvo","BMW")

访问数组

访问数组,必须通过数组名+索引号进行访问,例如访问mycars中第二个元素数据:

document.write(mycars[1]);//输出就是第二个“Volvo”

修改数组

同样的假如需要修改第二个数据,可以通过数组名+索引号进行”赋值“修改,例如修改mycars第二元素为rongwei:

mycars[1]="rongwei";

数组长度和索引

数组有索引和长度的属性,对于长度就用“length”获取就行,如下:

var len = mycars.length;//len的值就是mycars里面数组的数据的数量多少

对于索引,就是数组mycars后的中括号里面的数字,[i],有了索引,我们才能指定的访问第几个数据,索引是从0开始的,0,1,2,3….

mycars[1] = 99;也是通过索引进行赋值

反过来,若是知道数据想知道处于数组的第几个位置,需要用indexof进行获取:

mycars.indexOf(99);//查询数据99所在的索引号

数组截取和复制数组

假如只想加载前三个数据,后面的我不需要,那我们就没有必要全部获取,显示出来,这就用到了“slice”,

slice()就是对应String的substring()版本,它截取Array的部分元素,然后返回一个新的Array:

mycars.slice(0, 2);//获取前三个

这里是有参数的,假如不穿参数,那就算 复制了一遍数组,一模一样:

var  newCar = mycars.slice();//复制数组

数组尾部追加和删除最后数据

push()向Array的末尾添加若干元素

var arr = [1, 2];
arr.push('A', 'B'); // 返回Array新的长度: 4
arr; // [1, 2, 'A', 'B']

pop()则把Array的最后一个元素删除掉:

arr; // [1, 2, 'A', 'B']
arr.pop(); // pop()清除'B'
arr; // [1, 2, 'A']
arr.pop(); arr.pop(); arr.pop(); // 连续pop 3次
arr; // []
arr.pop(); // 空数组继续pop不会报错,而是返回undefined
arr; // []

更多对数组的操作如下:

1.如果要往Array的头部添加若干元素,使用unshift()方法,shift()方法则把Array的第一个元素删掉:

2.sort()可以对当前Array进行排序,它会直接修改当前Array的元素位置,直接调用时,按照默认顺序排序:

3.reverse()把整个Array的元素给掉个个,也就是反转:

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

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

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

多维数组

多维数组,有2个以上的数组组合而成的就是多维数组。第一个[]表示第几个数组,第二个[]表述第几个,这样就可以把一个二维数组读取出来了,我们就可以进行相应的操作了.

 //使用[]方式创建一个二维数组
            var arr = [
                [1,2,3,4],
                [4,5,6,7],
                [8,9,10,11]
            ];         
            document.write(arr[1][1]);    

赞(0) 打赏
未经允许不得转载:版权所有@七娃设计室七娃博客 » javascript中数组及常见操作方式
分享到: 更多 (0)

评论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

七娃设计,让设计贴近生活

联系我们

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏