您的位置:百味书屋 > 范文大全 > 经典范文 > JavaScript之数组(Array)详解 正文

JavaScript之数组(Array)详解

2017-01-19 06:12:49 来源网站: 百味书屋

篇一:Javascript数组及其操作

Javascript数组及其操作

1.如何创建数组

2.如何对数组进行操作(添加,删除,读取)

3.数组常见方法和属性

如何创建一个数组,一般地根据初始化设定简单分为3种:

1.单纯创建数组:

var arr=new Array();

要点:用new关键字创建数组对象Array(),Array()对象是一个本地类,可以用new创建一个对象后使用

2.创建数组的同时规定数组大小:

var arr=new Array(10);//这里就创建了一个初始化大小为10的数组

注意:当使用数组大小操作初始化大小时,数组会自动被撑大,不会像C语言那样发生错误.动态增长是js数组的一个性质.另外,js中支持最大数组长度为 4294967295

3.直接初始化:

var arr=new Array("love","hate","pain");//这里就直接初始化了数组 或var arr=["happy","cute","scare"];//括号也可以声明一个数组对象

当然,类似C语言,可以定义2维3维和多维的数组,例如:

<script language=Javascript>

var myArray = new Array();

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

myArray[i]=new Array();

myArray[i][0]=Math.floor(Math.random()*10);

myArray[i][1]=Math.floor(Math.random()*10);

myArray[i][2]=Math.floor(Math.random()*10);

myArray[i][3]=Math.floor(Math.random()*10);

myArray[i][4]=Math.floor(Math.random()*10);

myArray[i][5]=Math.floor(Math.random()*10);

myArray[i][6]=Math.floor(Math.random()*10);

myArray[i][7]=Math.floor(Math.random()*10);

myArray[i][8]=Math.floor(Math.random()*10);

}

myArray.sort( function(x, y) ...{

return

(x[0]==y[0])?((x[4]==y[4])?(x[8]-y[8]):(x[4]-y[4])):(x[2]-y[2]) });

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

document.write(myArray[i].join(",") + "<br/>");

}

</script>

数组的属性:length

arr.length返回数组arr的长度,常见于循环中对数组的遍历,比如:

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

执行部分

}

数组元素的访问: arr[index],其中index表示索引即数组基数,从0开始,共有arr.length个元素.比如: arr[0]访问第一个数组元素,arr[1]访问第二个数组元素....依次类推 数组的操作方法:先概览下下面的这些操作数组常用的方法(13个)

toString(),valueOf(),toLocalString(),join(),split(),slice(),concat(), pop(),push(),shift(),unshift(),sort(),splice()

下面逐一分析这些方法的功能和用法.

toString(),valueOf(),toLocalString():

功能:返回数组的全部元素

注:数组名也可以返回整个数组

代码:

var m=["am","bm","cm"];//用括号声明一个数组对象

alert(m.toString());//toString()返回数组对象的所有内容,用逗号分割,即am,bm,cm

alert(m.valueOf());//valueOf()也返回数组对象的所有内容

alert(m.toLocaleString());//toLocaleString()也返回数组对象的所有内容,但有地区语言区别,暂不研究

alert(m);//数组名也返回数组对象的所有内容

join():

功能:把数组各个项用某个字符(串)连接起来,但并不修改原来的数组

代码:

var m=["am","bm","cm"];//用括号声明一个数组对象

var n=m.join("---");//用---连接am,bm,cm.

alert(m.toString());//m并没有被修改,返回am,bm,cm

alert(n);//n是一个字符串,为am---bm---cm

split():

功能:把一个字符串按某个字符(串)分割成一个数组,但不修改原字符串

代码:

var str="I love maomao,I am caolvchong";

var arr=str.split("o");//按字符o把str字符串分割成一个数组 alert(arr);//输出整个数组

slice():返回某个位置开始(到某个位置结束)的数组部分,不修改原数组 代码:

var m=["am","bm","cm","dm","em","fm"];

var n=m.slice(2);//返回第二个元素bm后面的元素,即cm,dm,em,fm var q=m.slice(2,5);//返回第二个元素后到第五个元素,即cm,dm,em alert(n);

alert(q);

数组对象的栈操作:

push():数组末尾添加一个项

pop():删除数组最后一个项

代码:

var m=["am","bm","cm","dm","em","fm"];

m.push("gm");//在数组末尾添加元素gm

alert(m);

m.pop();//删除数组最后一个元素gm

alert(m);

数组对象的队列操作:

unshift():数组头添加一个项

shift():删除数组第一个项

代码:

var m=["am","bm","cm","dm","em","fm"];

m.unshift("gm");//在数组第一个元素位置添加元素gm

alert(m);

m.shift();//删除数组第一个元素gm

alert(m);

sort():数组按字符的ASCII码进行排序,修改数组对象

注:即便是数字数组,也将转化为字符串来进行比较排序

代码:

var m=["am","fm","gm","bm","em","dm"];

m.sort();//按字母序排序

alert(m);

concat():在数组尾添加元素,但不修改数组对象

代码:

var m=["am","bm"]

var n=m.concat("cm");//添加一项cm,并且赋予新数组对象

alert(m);//原数组没有被修改

alert(n);//输出新数组对象

splice():在数组的任意位置进行添加,删除或者替换元素,直接修改数组对象 细节:

splice()有三个参数或三个以上参数,前两个是必须的,后面参数是可选的 进行添加:splice(起始项,0,添加项)

进行删除:splice(起始项,要删除的项个数)

进行替换:splice(起始项,替换个数,替换项) 这个其实是添加删除的共同结果 代码:

var m=["am","bm"]

m.splice(1,0,"fm","sm");//在第一项后面添加fm和sm,返回am,fm,sm,bm alert(m);

m.splice(2,1);//删除第二项后面一项(即第三项sm,返回am,fm,bm) alert(m);

m.splice(2,1,"mm");//替换第二项后面一项(即第三项,返回am,fm,mm) alert(m);

JavaScript数组操作函数

join(delimiter): 把数组中各个元素使用分隔符(delimiter)拼成字符串

concat(array1, array2, ...): 合并数组,对原数组不影响,只是返回合并后的新数组

pop(): 删除并返回最后一个元素

push(element1, element2, ...): 在数组末尾追加元素

shift(): 删除并返回第一个元素

unshift(element1, element2, ...): 在数组开始位置添加元素

reverse(): 将数组元素顺序首尾反转

sort(function): 给数组排序

如果不给参数,默认按字符排序(所有元素是数字也不会按数字排序的)

参数必须是一个函数,类似function(a, b) {},在函数中判断a, b的大小,a>b返回正数,a<b返回负数,a=b返回0

slice(start, end): 返回一个新的数组,将start开始,到end结束(不包括end)之间的元素复制到新数组中

splice(start, count, replaceElement1, replaceElement2, ...): 删除或者替换数组元素,从start开始,对count个元素进行删除或替换

如果提供replaceElement参数则进行替换,否则进行删除操作,被替换的元素个数和replaceElements的个数不必相等

返回一个数组,包含被删除或替换掉的元素

判断是否数组的方法

var arrayVar = ["aaa", "bbb", "ccc"];

var nonArrayVar = { length:4, otherAttribute:"attr" };

document.write(arrayVar.constructor==Array);

document.write("<br />");

document.write(nonArrayVar.constructor==Array);

结果是true, false

grep、map

Perl语言带出来的东西,jQuery实现selector时用了这种方式

grep

对数组的grep操作,指类似这样的代码:

Array newArray = grep(condition, oldArray),这个操作将对oldArray数组的每个元素进行遍历,如果当前处理元素符合条件condition,则加入到返回数组中 jQuery中的grep类似这样: function( elems, callback),elems是DOM元素集合,callback是实现selector的一些表达式函数,如果callback返回true则表明当前处理的元素符合selector表达式

篇二:javaScript基础之——数组

javaScript基础之——数组

目录

创建数组的方法 .................................................................................................. 3

数组的内置方法 .................................................................................................. 3

数组首尾位置的数据项添加及删除方法 ........................................................... 3

array.push( value,… ) --- 向数组的尾部添加值 ................................................ 4

array.unshift( value,… ) --- 在数组头部插入一个元素 ...................................... 4

array.pop( ) --- 删除并返回数组的最后一个元素 ............................................. 5

array.shift( ) --- 将元素移出数组.................................................................... 6

重排序方法 ........................................................................................................ 6

array.reverse() --- 颠倒数组中元素的顺序 ...................................................... 7

array.sort( fn ) ---对数组元素进行排序 ........................................................... 7

数组的固定位置的增删改方法 .............................................................................. 8

array.splice(start,deleteCount,value,…) --- 插入、删除或替换数组的元素 .......... 8

可以复制数组的方法 ........................................................................................... 8

array.slice(start,end) --- 返回数组的一部分 .................................................... 9

array.concat(value,…) --- 连接数组 .............................................................. 9

将数组转化为字符串的方法 ............................................................................... 10

array.join(separator) ---将数组元素连接起来以构建一个字符串 ...................... 10

array.toString() ---将数组转换成一个字符串 ................................................. 11

array.toLocaleString() ---把数组转换成局部字符串 ........................................ 11

数组的属性:length.................................................................................... 12

ECMAScript 5 添加的数组方法............................................................................ 12

位置方法 ................................................................................................... 12

迭代方法 --- 不修改原数组 .......................................................................... 13

归并方法 --- 迭代数组所有项,然后构建一个最终返回的值 ............................ 13

数组是复合数据类型(对象类型)的数据,它的数据索引为数字,从0开始,逐一递增,有个length属性,代表数组项的总数。数组的每一项可以存任何类型的数据,并不是数组就只可以存Number类型的数据哦。

当我们用for in 语句 遍历数组的时候,length属性并不会被遍历出来。

创建数组的方法 var arr = new Array( ); //创建一个空数组

var arr = new Array(size); // size-数组的长度,ex.size=3,创建一个有3个元素的数组,元素为undefined

var arr = new Array(element0, element1, ..., elementn); // 用参数指定的值初始化数组,以逗号分隔

var arr = []; //直接量的方式创建一个空数组,和第一个创建数组的方法同效

var arr = [element0, element1, ..., elementn]; // 直接量的方式创建数组,同上面第三个创建方式

数组的内置方法

数组首尾位置的数据项添加及删除方法

array.push()

array.pop()

array.unshift()

array.shift()

//添加的都返回数组的length属性值

//删除的都返回删除项的值

array.push( value,… ) --- 向数组的尾部添加值 参数:value可以是一个或多个(不传参数好像也没报错)

功能:方法push()将把它的参数顺次添加到array的尾部。

返回值:把指定的值添加到数组后的新长度。

是否修改原数组:是!---它直接修改array,而不是创建一个新的数组。

扩展:方法push()和方法pop()用数组提供先进后出栈的功能。

Bug:在JavaScript的Netscape实现中,如果把语言版本明确地设置为1.2,该函数将返回最后添加的值,而不是返回新数组的长度。

array.unshift( value,… ) --- 在数组头部插入一个元素

参数:value是要插入到数组头部的一个或多个值(不传参数好像也没报错)

功能:方法unshift()将把它的参数插入array的头部,并将已经存在的元素顺次地移到较高的下标处,以便留出空间。该方法的第一个参数将成为数组新的元素0,如果还有第二个参数,它将成为新的元素1,以此类推。

返回值:把指定的值添加到数组后的新长度。

是否修改原数组:是!---unshift()直接修改原有的数组,而不是创建一个新的数组。 示例:

var a = []; // a:[]

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

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

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

a.push(6); // a:[33,[4,5],22,1,6] 返回 5

array.pop( ) --- 删除并返回数组的最后一个元素 参数:无

功能:方法pop()将删除array的最后一个元素,把数组长度减1,如果数组已经为空,则pop()不改变数组。

返回值:返回它删除的元素的值。数组已经为空的时候,pop()方法返回undefined。

是否修改原数组:是!---它直接修改array。

扩展:方法push()和方法pop()用数组提供先进后出栈的功能。

示例:

var stack = []; // 栈:[]

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

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

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

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

篇三:JavaScript数组定义

JavaScript数组定义

数组有四种定义的方式

使用构造函数:

var a = new Array();

var b = new Array(8);

var c = new Array("first", "second", "third");

或者数组直接量:

var d = ["first", "second", "third"];

属性

Array只有一个属性,就是length,length表示的是数组所占内存空间的数目,而不仅仅是数组中元素的个数,在刚才定义的数组中,b.length的值为8

<script>

var a = new Array("first", "second", "third")

a[48] = "12"

document.write(a.length)

//显示的结果是49

</script>

数组的length属性是可写的,这是一个非常有意思的属性,我们可以通过这种方法来截取数组

<script>

var a = new Array("first", "second", "third")

delete a[1]

document.write(a.length)

//显示的结果是3,说明即使删除也无法改变数组的长度 var a = new Array("first", "second", "third")

a.length = 1

document.write(a.length)

//显示的结果是1,说明只剩下一个元素了

</script>

方法

这里并没有包括IE和FF并不兼容的一些方法:

toString():把数组转换成一个字符串

toLocaleString():把数组转换成一个字符串

join():把数组转换成一个用符号连接的字符串

shift():将数组头部的一个元素移出

unshift():在数组的头部插入一个元素

pop():从数组尾部删除一个元素

push():把一个元素添加到数组的尾部

concat():给数组添加元素

slice():返回数组的部分

reverse():将数组反向排序

sort():对数组进行排序操作

splice():插入、删除或者替换一个数组元素

toString() 方法,toLocaleString()方法的作用类似,FF下的作用是完全相同的,IE的话如果元素是字符串,会在“,”后面加上一个空格,如果元素是数字,会扩展到两位小数,两者都会改变字符串的length属性,所以考虑到兼容性,尽量不要使用toLocaleString()方法。

<script>

var a = new Array(1, 2, 3, [4, 5, [6, 7]])

var b = a.toString() //b为字符串形式的 "1, 2, 3, 4, 5, 6, 7"

var c = new Array(1, 2, 3, [4, 5, [6, 7]])

var d = c.toLocaleString() //d为字符串形式的 "1, 2, 3, 4, 5, 6, 7" //toString()方法和toLocaleString()方法都可以拆解多维数组 </script>

join()方法将数组中的所有元素转换成字符串,然后连接起来,这刚好和String的split()方法是一个相反的操作。join()默认是使用“,”作为分隔符,当然你也可以在方法中指定分隔符

<script>

var a = new Array("first", "second", "third")

var s = a.join("...")

document.write(s)

//显示的结果是“first...second...third”

</script>

pop()方法可以从数组尾部删除若干个元素,push()方法把一个元素添加到数组的尾部,这两个方法刚好是两个相反的操作。两个都是对原来的数组进行操作,但是要注意push()方法返回的是新的数组的长度,而pop()方法则返回被删去的那个元素。

<script>

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

var b = a.push(4,5,[6,7]) //a为[1, 2, 3, 4, 5, [6, 7]] b为6 注意push()方法不会帮你打开一个数组

var c = new Array(1, 2, 3, 4, "first")

var d = c.pop() //c为[1, 2, 3, 4] d为字符串形式的"first"

</script>

shift() 方法可以从数组头部删除一个元素,unshift()方法把若干元素添加到数组的头部,这两个方法刚好是两个相反的操作。两个都是对原

来的数组进行操作,但是要注意unshift()方法返回的是新的数组的长度,而shift()方法则返回被删去的那个元素。

<script>

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

var b = a.unshift(4,5,[6,7]) //a为[4, 5, [6, 7], 1, 2, 3] b为6 注意unshift()方法不会帮你打开一个数组,还有就是被插入数值的顺序

var c = new Array("first", 1, 2, 3, 4)

var d = c.shift() //c为[1, 2, 3, 4] d为字符串形式的"first"

</script>

concat()方法可以返回一个在原有数组上增添了元素的数组,元素用“,”分隔,元素中如果有数组,将被展开并继续添加,但不支持多维数组形式的展开添加

<script>

var a = new Array("first", "second", "third")

s = a.concat("fourth",["fifth", "sixth"],["seventh", ["eighth", "ninth"]]) document.write(s[7])

// 显示的结果是“eighth, ninth”,说明“eighth, ninth”是以数组的形式被添加了进去,此是s的值为["first", "second", "third", "fourth", "fifth", "sixth", "seventh", ["eighth", "ninth"]]

</script>

slice()方法返回数组的一个片断,或者说是子数组。slice()的参数表示字数组的始末位置,如果只有一个参数,就表示从该处开始一直取到最后,如果参数出现负数,则表示倒数的某个位置。

<script>

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

var b = a.slice(3) //b为[4, 5]

var c = a.slice(-3) //c为[3, 4, 5]

var d = a.slice(1,-1) //d为[2, 3, 4]

var e = a.slice(-3,-1) //e为[3, 4]

</script>

reverse()方法将数组反向排序,他并不创建和返回一个新的数组,而是在原有的数组上进行操作

<script>

var a = new Array("first", "second", "third")

a.reverse()

document.write(a)

//显示的结果是“third,second,first”,这时候数组的顺序已经颠倒了 </script>

sort()方法的作用是对数组进行排序,这是一个非常奇特的方法,我不知道当初创作他的人是出于懒惰还是聪明,这是一个让我印象深刻的

方法。

sort()方法的参数是一个有两个参数,并且有返回值的函数,如果返回的值大于零,则说明前一个参数比后一个参数大,等于零则相等,小于零说明前一个参数比后一个小,而相对小的那个参数将出现在排序的前列。

sort()方法直接在数组上进行操作,同时也返回值,但是两者似乎是等价的。sort()方法默认是用字母的顺序进行排序

<script>

var a = new Array(33, 4, 111, 543)

a.sort(way)

function way(x, y){

if (x % 2 ==0)

return 1;

if (x % 2 !=0)

return -1;

}

//排序的结果是使奇数在前偶数在后

</script>

splice()方法的作用是插入、删除或者替换一个数组元素,他不光会在原有的数组上进行修改,还会返回被处理掉的内容,因此这是一个功能强大,但是不容易使用的方法,splice()方法用前两个参数进行定位,余下的参数表示插入部分。

<script>

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

var b = a.splice(2) //a为[1, 2] b为[3, 4, 5]

var c = new Array(1, 2, 3, 4, 5)

var d = c.splice(2,2) //c为[1, 2, 5] d为[3, 4]

var e = new Array(1, 2, 3, 4, 5)

var f = f.splice(-4,2) //e为[1, 4, 5] f为[2, 3]

var g = new Array(1, 2, 3, 4, 5)

var h = g.splice(-2,-2) //第二个参数表示长度,因此负数在此无效

var i = new Array(1, 2, 3, 4, 5)

var j = i.splice(2,2,"first","second","third") //i为[1, 2, "first", "second", "third", 5] j为[3, 4] 后面部分会自动前后移动,以保持数组的连续性 var k = new Array(1, 2, 3, 4, 5)

var l = k.splice(2,2,["first","second"],"third") //k为[1, 2, ["first", "second"], "third", 5] l为[3, 4] splice()方法不会展开数组,只直接写入 </script>


JavaScript之数组(Array)详解》出自:百味书屋
链接地址:http://www.850500.com/news/72596.html
转载请保留,谢谢!
查看更多相关内容>>JavaScript之数组(Array)详解
相关文章
  • JavaScript之数组(Array)详解

    Javascript数组及其操作Javascript数组及其操作1 如何创建数组2 如何对数组进行操作(添加,删除,读取)3 数组常见方法和属性如何创建一个数组,一般地根据初始化设定简单分为3种...

推荐范文