javascript代码实例教程-javascript数组总结

发布时间:2019-01-20 发布网站:脚本宝典
脚本宝典收集整理的这篇文章主要介绍了javascript代码实例教程-javascript数组总结脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。
小宝典致力于为广大程序猿(媛)提供高品质的代码服务,请大家多多光顾小站,小宝典在此谢过。 数组是一个有序的集合,javascript数组中的元素的类型可以是任意的,同一个数组不同元素之间的类型也是可以不同的。数组也是对象,有个length属性,记录数组的长度。

 

 

 

创建数组

有两种方法:

  数组直接量,VAR arr = [1,2,];这样会创建一个有两个元素的数组。之所以不是3个元素,是因为最后一个逗号是可选的。

  另外一种是调用构造函数:

      var arr = new Array(10);这样会创建一个具有10个元素的数组;或者

          var arr = new Array(1,2,3,4,5,6);直接传进数组元素

  

数组元素的读写

数组是特殊的对象,数组特殊在维护了一个length属性。数组的索引其实也就是对象的属性,0--2`32-2的属性值是索引。0--2`32-2的索引会自动转化为字符串的属性值。如下:

var a = [1,2];

    console.@R_406_2869@(a.[0])//1

数组是对象,这因为着可以给它添加属性:

 

 

var a = [];

a.test = 'test';

console.log(a.length);

a['0'] = 3;

console.log(a.length);

console.log(a.test);//test

console.log(a['0']);//3

console.log(a[0])//3

 

 

 

从上面也可以看到,给数组添加‘0’的属性,也会自动转化成索引。

 

数组长度

length属性总是比最大的一个索引大1(非稀疏数组)。这个length属性有一些特殊的行为。

往数组添加索引时,自动维护:

var a = [1,2,3];

    console.log(a.length);//3

    a[3] = 4;

    console.log(a.length);//4

更改length为比现在当前长度的非负整数的时候,大于等于长度的那些元素会被删除:

 

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

    console.log(a.length);//9

    a.length = 8;

    console.log(a[8]);//undefined

    a.length = 7;

    console.log(a[7]);//undefined

更改length为比当前长度达的非负整数的时候,相当于增加了空白区域。

 

数组遍历

使用for:

for(var i = 0; i < array.length; i++){

        

    }

这样做有个问题就是:要访问很多遍array的length属性,所以更好的做法是下面这种:

 

for(var i = 0, len = array.length; i < len; i++){

 

    }

 

 

或者像下面这样从后面开始遍历:

 

for(var i = array.length - 1; i >= 0; i--){

        

    }

另外可以用for/in来遍历:

 

for(var i IN ARRAY){

        

    }

但是这样子带来的问题就是,除了索引属性之外,还会有继承来的属性、负整数属性、字符串属性也会被包含在其中。

 

ecma5定义了一个foreach函数:

 

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

    a.forEach(function(index){

        console.log(index)

    })

 

 

 

 

数组方法

  转换方法toString()、toLocalString()、valueOf(),join();

valueOf得到的还是数组本身。而第二、第三个得到的都是一个数组,实际上是在每个元素上调用了一次toString或toLocaleString函数。

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

    console.log(a.toLocaleString());//1,2,3,4,5

    console.log(a.toString());//1,2,3,4,5

    console.log(a.valueOf());//[1,2,3,4,5]

而且会将数组扁平化:

 

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

    console.log(a.toLocaleString());// 1,2,3,4,5,6,7,8,9

    console.log(a.toString());// 1,2,3,4,5,6,7,8,9

join方法是利用给定的字符将数组元素连成一个字符串。实际上对每个元素调用了toString方法。

 

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

console.log( a.join('*') );//1*2*3*4*5*6,7,8,9

console.log(a);//var a = [1,2,3,4,5,[6,7,[8,9]]]

 

栈方法push()、pop()

push会在数组后面添加一个元素,并增加length的值。

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

    console.log(a.length);//5

    a.push(6);

    console.log(a.length);//6

    console.log( a[a.length - 1] );//6

pop刚好相反,它会返回删除的元素。

 

队列方法shift()、unshift()

shift将数组的第一个元素删除并返回,后面的元素往前移,减少length的值。

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

    console.log(a.length);//5

    a.shift();

    console.log(a.length);//4

    console.log( a[0] );//2

unshift刚好相反。

 

重排序方法reverse()、sort()

reverse方法是将数组反序。

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

    console.log( a.reverse() );//[5, 4, 3, 2, 1]

    console.log(a);//[5, 4, 3, 2, 1]

可以看到,reverse是直接改变数组本身的。

另一个sort方法接受一个函数作为排序的依据。如果不传这个参数,则是对每个元素调用toString方法然后比较。也就是全部转换为字符串然后再比较。

 

    var a = [2,43,25,64,62,45,75,10,4,7]

    console.log(a.sort());//[10, 2, 25, 4, 43, 45, 62, 64, 7, 75]

    console.log(a);//[10, 2, 25, 4, 43, 45, 62, 64, 7, 75]

如果传入函数,则函数有两个参数,就是两个要进行比较的数据。如function(a1,a2){};要想a1排在前面就返回小于0;要想顺序不变返回0;另一种情况你懂得。如想要按照数字的小到大排序。

 

  var a = [2,43,25,64,62,45,75,10,4,7]

    console.log(a.sort(function(a, b){

        return a - b;

    }));//[2, 4, 7, 10, 25, 43, 45, 62, 64, 75]

    console.log(a);//[2, 4, 7, 10, 25, 43, 45, 62, 64, 75]

操作方法concat()、slice()、splice()

concat是将一个数组并接在另外一个数组后面。

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

    var b = [5,6,7,[7,8],9];

    console.log(a.concat(b))//[1, 2, 3, 4, 5, 6, 7, [7,8], 9]

    console.log(a)//[1,2,3,4];

    console.log(b)//[5,6,7,[7,8],9]

可以看到concat并不会将数组扁平化、而且不会改变原数组。它是想创建一个a的副本,然后将b复制进去然后返回。

 

slice是基于当前数组,创建一个新的数组。接受两个参数,第二个参数是可选的。如果只有一个参数,就是从指定位置到最后一个的项。如果有两个参数,则是从第一个到第二个指定位置的项,但不包括最后一个。第二个参数可以是负数,-1代表最后一个项,但不包括最后一个。

 

    var a = [1,2,3,4,5];www.2cto.COM

    console.log( a.slice(1) );//[2,3,4,5]

    console.log( a.slice(0, 3) );//[1,2,3]

    console.log( a.slice(0, -3) );;//[1,2]

同样的,slice不会改变原数组。并且当第二个参数的位置在第一个参数位置之前的时候,会返回一个空数组。

 

splice功能非常强大,可以删除、插入、替换

如果只传入两个参数,就是删除,第一个参数代表要删除的其实位置,第二个参数代表要删除的项的个数。

 

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

    console.log(a.splice(1,2));//[2,3]

    console.log(a);//[1,4,5]

 

如果传入两个以上参数,并且第二个参数是0,就是插入。第一个参数代表要插入的位置,第三个以及以后的参数代表要插入的项。

 

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

    console.log(a.splice(1,0,7,8));//[]

    console.log(a);//[1,7,8,2,3,4,5]

 

如果传入两个以上参数,并且第二个参数不是0,就是替换。第一个参数代表要替换的开始位置,第二个参数代表要替换掉多少个项,第三个以及以后的参数代表要替换进去的项。

 

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

    console.log(a.splice(1,2,7,8));//[2,3]

    console.log(a);//[1,7,8,4,5]

最后看一个例子:

 

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

    console.log(a.splice(-1,2,7,8));//[5]

    console.log(a);//[1, 2, 3, 4, 7, 8]

这个例子说明,第一个参数接受负数,-1代表最后一个项。

 

位置方法indexOf()、lastIndexOf()

两个方法的区别是一个从前往后找,一个从后往前找。返回第一个找到的项的位置。

接受两个参数,第一个是要查找的项,第二个是开始的位置。

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

    console.log(a.indexOf(4));//3

    console.log(a.lastIndexOf(4));//5

 

 

迭代方法forEach()、some()、map()、filter()、every()

这些方法都接受两个参数,第一个是一个将要被调用的函数,第二个参数是可选的,如果有第一个函数会作为该参数的方法调用。传入的函数有三个参数,数组元素、元素索引、数组本身

 

forEach是对每个项调用函数,没有返回值。且不能用break提前结束。

map对每个项调用函数,返回函数返回值组成的数组。

filter对每个项调用函数,返回使函数返回值为true的项组成的数组。该方法会跳过空元素。

every对每个项调用函数,如果每个返回值都为true才返回true。

some对每个项调用函数,如果每个返回值都为false才返回false。

归并函数reduce(),reduceRight()

这些方法都接受两个参数,第一个是一个将要被调用的函数,第二个参数是可选的,是传递个函数的初始值。传入的函数有四个参数,上一次归并结果、数组元素、元素索引、数组本身。

reduce会从第一个项开始调用函数,函数返回值作为第一个参数传给下一次函数调用,以此类推,直到最后,返回一个最后的值作为返回值。

 

var a = [];

    for(var i = 1; i <= 100; i++){

        a[i-1] = i;

    }

    var resule = a.reduce(function(last, value, i, arr){

        return last + value

    })

    console.log(resule)//5050

 

觉得可用,就经常来吧! 脚本宝典 欢迎评论哦! js脚本,巧夺天工,精雕玉琢。小宝典献丑了!

脚本宝典总结

以上是脚本宝典为你收集整理的javascript代码实例教程-javascript数组总结全部内容,希望文章能够帮你解决javascript代码实例教程-javascript数组总结所遇到的问题。

如果觉得脚本宝典网站内容还不错,欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。