javascript数组介绍

来源：互联网发布：js 保存图片到本地编辑：程序博客网时间：2024/05/16 06:48

1 JavaScript数组简介

JavaScript数组是一种包含已编码的值的复合数据。数组区别于关联数组，关联数组是将值和字符串关联在一起，而数组是将值和非负整数关联在一起。

数组是对象(可利用typeof运算符)。

2 数组和数组元素

2.1 元素和下标的概念

数组是一种数据类型，包含或存储了编码的值。每个编码的值就叫做

数组的一个元素，每个元素的编码就叫做下标。

由于JavaScript是一种弱数据类型，所以数据的元素可以是任何的数据类型，包括对象、数组等。

2.2 数组的创建

数组是用构造函数Array()和运算符new创建的。你可以使用以下几种方式来创建数组：

2.2.1 无参数调用

var a = new Array();

2.2.2 明确指定前N个元素的值

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

2.2.3 传递一个数字参数，指定数组长度

var a = new Array(10)，在没有赋值前每个元素的值都是undefined

2.2.4 数组直接量

var primes = [2, 3, 5, 7, 11];

var a = ['a', true, 4.78];

var b = [[1,{x:1, y:2}], [2, {x:3, y:4}]];

2.3 数组元素读写

2.4 添加数组新元素

区别于C、java数组的元素个数是固定的，在JavaScript中，数组的元素个数是可以任意改变。

JavaScript数组还有一个特点，就是它的元素所存储的值在内存中不一定是连续的，系统只对有存储数值的元素分配内存。例如：a[0]=0,a[100]=’test’,系统只对0和100这两个下标的元素分配内存。

2.5 数组的长度

在JavaScript中，所有的数组(包括数组直接量)都有一个属性length，用来说明数据元素的个数。例如：

var a = new Array( ); //没有定义元素

document.write(a.length,'<br>');

a = new Array(10); //定义10个元素，每个元素都是undefined

document.write(a.length,'<br>');

a = new Array(1,2,3);

document.write(a.length,'<br>');

a = [4, 5]; //数组直接量

document.write(a.length,'<br>');

a[5] = -1; //添加新元素

document.write(a.length,'<br>');

a[49] = 0; //添加新元素

document.write(a.length,'<br>');

</script>

运行结果：

0
10
3
2
6
50

2.6 多维数组

JavaScript并不支持真正的多维数组，但可以通过把一个数组赋值给另一个数组的元素，就可以模拟多维数组。例如：

a = new Array(10); //定义10个元素，每个元素都是undefined

b = [1,2,3];

a[0] = b;

for(var i=0; i<a[0].length; i++){

document.write(a[0][i],'<br>');

}

</script>

运行结果：

1
2
3

3 数组的方法

3.1 join()方法

join()方法把数组所有元素的值都转移成字符串，再连接起来，如果方法中没有指定参数，就用逗号连接起来；如果指定参数，就用参数来连接。例如：

var a = [1,2,3];

document.write(a.join(),'<br>');

document.write(a.join('#'),'<br>');

</script>

运行结果：

1,2,3
1#2#3

3.2 reverse()方法

reverse()方法把数组元素的顺序颠倒并返回。例如：

var a = [1,2,3];

document.write(a.join(),'<br>');

a = a.reverse();

document.write(a.join(),'<br>');

</script>

运行结果：

1,2,3
3,2,1

3.3 sort()方法

sort()方法对数组进行排序并返回。如果没有传递参数，那么它就按照字母顺序对数组元素进行排序。如果数组有元素的值为undefined，那排序后这些元素的值将被置后。如果要对数组按照别的顺序进行排序，必须将一个比较函数传递给sort()。例如：

var a = [33, 4, 1111, 222];

document.write(a.join(),'<br>');

a.sort();

document.write(a.join(),'<br>');

a.sort(function(a,b) { //定义一个函数直接量，用于比较数值大小

return a-b;

});

document.write(a.join(),'<br>');

</script>

运行结果：

33,4,1111,222
1111,222,33,4
4,33,222,1111

3.4 concat()方法

concat()方法能创建并返回一个数组，这个数组包括了调用concat()方法的原始数组的元素，还包含了concat()的参数。

var a = [1,2,3];

document.write(a.join(),'<br>');

a = a.concat(4, 5)

document.write(a.join(),'<br>');

a = a.concat([4,5]);

document.write(a.join(),'<br>');

a = a.concat([4,5],[6,7])

document.write(a.join(),'<br>');

a = a.concat(4, [5,[6,7]])

document.write(a.join(),'<br>');

</script>

运行结果：

1,2,3
1,2,3,4,5
1,2,3,4,5,4,5
1,2,3,4,5,4,5,4,5,6,7
1,2,3,4,5,4,5,4,5,6,7,4,5,6,7

3.5 slice()方法

slice()方法返回的是指定数据的一个片段，或者说是子数组。它的两个参数指定了要返回的片段的起止点。返回的数组包含由第一个参数指定的元素和从那个元素开始到第二个参数指定的元素为止的元素，但并不包含第二个参数所指定的元素。如果只传递一个参数，那么返回的数组将包含从起始位置开始到原数组结束处的所有的元素。如果两个参数中有一个是负数，那么它指定的是相对于数组中的最后一个元素而言的元素。例如：参数值为-1指定的是数组最后一个元素，-3表示最后一个元素数起，倒数第三个元素。例如：

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

document.write(a.slice(0,3).join(),'<br>');

document.write(a.slice(3).join(),'<br>');

document.write(a.slice(1,-1).join(),'<br>');

document.write(a.slice(-3,-2).join(),'<br>');

</script>

运行结果：

1,2,3
4,5
2,3,4
3

3.6 splice()方法

splice()方法是插入或删除数组元素的通用方法。splice()方法第一个参数指定了要插入或删除的元素在数组中的位置，第二个参数指定了要从数组中删除的元素个数。如果第二个参数被省略，那么将删除从开始元素到数组结尾所有的元素。splice()方法返回了是删除元素后的数组，如果没有删除任何元素，那么将返回一个空数组。例如：

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

document.write(a.join(),'<br>');

a.splice(4,a.length-4); //返回[5,6,7,8]; a=[1,2,3,4]

document.write(a.join(),'<br>');

a.splice(1,2); //返回[2,3]; a=[1,4]

document.write(a.join(),'<br>');

a.splice(1,1); //返回[4]; a=[1]

document.write(a.join(),'<br>');

</script>

运行结果：

1,2,3,4,5,6,7,8
1,2,3,4
1,4
1

splice()的前两个参数指定了应该删除的数组元素。这两个参数之后还可以有任意多个额外的参数，它们指定的是要从第一个参数指定的位置处开始插入的元素。例如：

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

a.splice(2,0,'a','b'); //返回[]; a=[1,2,'a','b',3,4,5]

document.write(a.join(),'<br>');

a.splice(2,2,[1,2],3); //返回['a','b']; a=[1,2,[1,2],3,3,4,5]

document.write(a.join(),'<br>');

</script>

运行结果：

1,2,a,b,3,4,5
1,2,1,2,3,3,4,5

3.7 push()和pop()方法

push()和pop()方法可以使我们像栈一样操作数组。push()方法可以添加一个或多个新元素在数组的尾部，然后返回数组的新长度。pop()方法恰恰相反，它删除数组最后一个元素，然后返回删除的元素的值。

要注意的是这两个方法是在原数组上进行修改，而非生成一个修改过的数组的副本。

联合使用push()和pop()方法可以实现先进后出栈。例如：

var stack = []; //定义空的stack数组直接量

stack.push(1,2); //stack: [1,2]，并返回2

document.write(stack.join(),'<br>');

stack.pop(); //stack: [1]，返回2

document.write(stack.join(),'<br>');

stack.push(3); //stack: [1,3]，返回2

document.write(stack.join(),'<br>');

stack.pop( ); //stack: [1]，返回3

document.write(stack.join(),'<br>');

stack.push([4,5]); //stack: [1,[4,5]]，返回2

document.write(stack.join(),'<br>');

stack.pop( ) //stack: [1]，返回[4,5]

document.write(stack.join(),'<br>');

stack.pop( ); //stack: []，返回1

document.write(stack.join(),'<br>');

</script>

运行结果：

1,2
1
1,3
1
1,4,5
1

3.8 unshift()和shift()方法

unshift()和shift()方法和push()和pot()方法非常相似，不过unshift()和shift()方法是在数组头部进行元素添加和删除。unshift()方法将一个或多个元素添加到数组头部，然后把原有的元素向后移，返回的是数组的新长度。shift()方法删除第一个元素，后面的元素向前移，返回的是删除的元素的值。例如：

var a = []; //定义空a数组直接量

a.unshift(1); // a:[1]，返回1

document.write(a.join(),'<br>');

a.unshift(22); // a:[22,1]，返回2

document.write(a.join(),'<br>');

a.shift( ); // a:[1]，返回22

document.write(a.join(),'<br>');

a.unshift(3,[4,5]); // a:[3,[4,5],1]，返回3

document.write(a.join(),'<br>');

a.shift( ); // a:[[4,5],1]，返回3

document.write(a.join(),'<br>');

a.shift( ); // a:[1]，返回[4，5]

document.write(a.join(),'<br>');

a.shift( ); // a:[]，返回1

document.write(a.join(),'<br>');

</script>

运行结果：

1
22,1
1
3,4,5,1
4,5,1
1

3.9 toString()和toLocaleString()方法

由于数组是对象，所以它也有toString()方法，数组的toString()方法将数组每个元素都转换成字符串，再将这些字符串连接起来，用逗号分隔开。例如：

document.write([1,2,3].toString(),'<br>');

document.write(["a", "b", "c"].toString(),'<br>');

document.write([1, [2,'c']].toString(),'<br>');

</script>

运行结果：

1,2,3
a,b,c
1,2,c

toLocaleString()是toString()方法局部化的版本。它将调用每个元素的toLocaleString()方法把数组元素都转换成字符串，然后把生成的字符串用局部特定(和定义的实现)的分隔符字符串连接起来。