javascript代码实例教程-JavaScript-基础入门.0009.JavaScript数组类型

发布时间:2019-01-14 发布网站:脚本宝典
脚本宝典收集整理的这篇文章主要介绍了javascript代码实例教程-JavaScript-基础入门.0009.JavaScript数组类型脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。
小宝典致力于为广大程序猿(媛)提供高品质的代码服务,请大家多多光顾小站,小宝典在此谢过。

JavaScript-基础入门.0009.JavaScript数组类型,Array属于引用类型,引用类型是一种数据结构,用于将数据和功能组织在一起,如VAR newArr = new Array(),这行代码创建了Array引用类型的一个新实例,保存在newArr中,使用的构造函数是Array,它只为新对象定义了默认的属性和方法.

创建数组:

说明: 数组每个元素可以保存任何类型,而且可以随着数据的添加自动增长以容纳新增数据

对象属性
length 表示数组长度,支持读写,可以通过设置此属性,来从数组的默认移除项或向数组中添加新项
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 /* *创建数组对象 */ //支持使用Array构造函数 varnewArr=newArray() //支持省略new关键字声明 varnewArr=Array() //支持Array构造函数传参 varnewArr=newArray(10) //支持Array构造函数传项 varnewArr=newArray('李满满',25,'男') //支持字面量形式创建数组 varnewArr=['李满满',25,'男'] console.LOG(newArr) /* *数组对象赋值 */ newArr[0]='刘珍珍' newArr[newArr.length]='新增项' console.log(newArr) /* *多维数组创建 */ varnewArr=[ { name:'李满满', age:25, sex:'男' }, ['李满满',25,'男'], '李满满', '25', '男' ] /* *length-读取或添加元素 */ varnewArr=[1,2,3] console.log(newArr.length) //数组原地被修改 newArr[newArr.length]=4 console.log(newArr)

检测数组:

说明: 由于数组为引用类型,所以再用tyPEof表达式将无法检测到实例对象属性,因为对于引用类型的对象基本返回都是Object,此时我们可使用instanceof表达式来判断


1 2 3 4 5 6 7 8 9 /* *数组类型检测 */ varnewArr=newArray('李满满','男',25) //以new关键字创建的也返回true console.log(newArrinstanceofArray) varnewArr=['李满满','男',25] //以字面量创建的也返回true console.log(newArrinstanceofArray)

转换方法:

方法名 方法说明
toString() 返回由数组中的每个值的字符串拼接而成的一个以逗号分割的字符串,其实调用的是每个元素的toString方法
toLocaleString() 返回由数组中的每个值的字符串拼接而成的一个以逗号分割的字符串,其实调用的是每个元素的toLocaleString方法
valueOf() 返回数组
join(sep) 返回以seq连接数组中各个元素的字符串形式
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 /* *toString/toLocaleString/valueOf */ varnewArr=[ { toString:function(){ return'toString-李满满' }, toLocaleString:function(){ return'toLocaleString-李满满' } }, { toString:function(){ return'toString-刘珍珍' }, toLocaleString:function(){ return'toLocaleString-刘珍珍' } } ] console.log( newArr.toString(), newArr.toLocaleString(), newArr.valueOf() ) /* *join(sep) */ console.log(['李满满','男',25].join(','))

技巧: 数组的toString或toLocaleString方法返回值只能以逗号分割的字符串形式,如果要使用不同分割符连接数组元素,可使用join(sep)方法,此方法只有一个参数分割符,然后返回包含所有元素和分割符的字符串

栈的方法:

说明:栈是一种先进先出的数据结构,也就是说最新被插入的项最早被移除,Js为数组提供了push/pop方法,使其实现类似栈的行为

方法名称 方法说明
push(val1.....valN) 压入栈顶,可接收任意数量的参数,把它们逐个添加到数组末尾,并返回修改后数组的长度
pop() 弹出栈顶,从数组末尾移除最后一个元素,并返回此元素
1 2 3 4 5 varuserInfo=['李满满',25,'男'] varnewLen=userInfo.push('杭州市富阳市') console.log('数组被压入栈后长度改变为:'+newLen) varlastITem=userInfo.pop() console.log('数组弹出最新压入的数据为:'+lastItem)

队列方法:

说明: 队列是一种先进后出的数据结构,也就是说最新被插入的项最晚被移除,Js为数组提供了push/shift/unshift,使其实现类似队列的行为

方法名称 方法说明
push(val1.....valN) 尾部压入,可接收任意数量的参数,把它们逐个添加到数组末尾,并返回修改后数组的长度
shift() 头部弹出,从数组头部移除第一个元素,并返回此元素
unshift(val1.....valN) 头部压入,可接收任意数量的参数,把它们逐个添加到数组头部,并返回修改后数组的长度
1 2 3 4 5 6 7 varuserInfo=['李满满',25,'男'] varnewLen=userInfo.push('杭州市富阳市') console.log('数组被压入队列后长度改变为:'+newLen) varshitfItem=userInfo.shift() console.log('数组从队列头部移除的元素是:'+shitfItem) varnewLen=userInfo.unshift('李满满') console.log('向数组头部插入元素后的长度:'+newLen)

排序方法:

方法名称 方法说明
reverse() 数组反转,反转数组项的顺序
sort([cmp]) 数组排序,默认调用每项的toString()转型函数,然后比较得到的字符串升序排序,同时还支持自定义比较器,比较函数需要大于返回1,小于返回-1,等于返回0
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 /* *reverse */ varnumArr=[1,2,3,4,5] console.log( //倒序排列,原数组被修改,返回排序后的数组 numArr.reverse(), //正序排序,原数组被修改,返回排序后的数组 numArr.sort() ) /* *定义比较器 */ varnumArr=['1f','11f','2f','22f'] //定义比较器 functioncmp(x,y){ varxVal=parseint(x) varyVal=parseInt(y) returnxVal>yVal?1:(xVal==yVal?0:-1) } //传入比较器 alert(numArr.sort(cmp))

操作方法:

方法名称 方法说明
concat([arr|val1...valN]) 基于当前数组中的所有项创建一个新数组,参数支持数组或单值或空,如果为空则只是复制当前数组并返回副本
slice(start, end) 基于当前数组的一个或多个项创建一个新数组,返回起始和结束位置之间的项,但不包括结束位置的项,而且start/end支持负数
splice(start, count[,val1...valN]) 基于当前数组添加,删除,替换元素创建一个新数组,start为起始位置,count=0,在start位置插入vals,count!=0 and未传vals则删除count个元素,否则替换原来元素
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 /* *concat([arr|val1...valN]) */ varuserInfo=["李满满",25,'男'] varnewInfo=userInfo.concat(['武汉']) console.log(newInfo) varnewInfo=userInfo.concat('武汉','18814818764') console.log(newInfo) /* *slice(start,end) */ varnewInfo=userInfo.slice(0,3) console.log(newInfo) //非常金典的用法是写评级组件 varrate=3 document.write("★★★★★☆☆☆☆☆".slice(5-rate,10-rate)) /* *splice(start,count,val1...valN) */ //删除元素 vardeletedItems=userInfo.splice(0,2) console.log(deletedItems) console.log(userInfo) //插入元素 userInfo.splice(0,0,'李满满',25) userInfo.splice(0,1,'刘珍珍') console.log(userInfo)

位置方法:

方法名称 方法说明
indexOf(val[,start]) 从数组开头查找第一个val,如果找到返回val的第一个字符索引,否则返回-1
lastIndexOf(val[,start]) 从数组开头查找最后一个val,如果找到返回val的第一个字符索引,否则返回-1
1 2 3 4 5 6 /* *indexOf(val[,start]) *lastIndexOf(val[,start]) */ console.log(userInfo[userInfo.indexOf('刘珍珍')]) console.log(userInfo[userInfo.lastIndexOf('刘珍珍')])

迭代方法:

方法名称 方法说明
every(func) 对数组中的每一项运行给定函数,如果每项都返回true则返回true,返回新数组,func必须包含三个参数item,index,array
filter(func) 对数组中的每一项运行给定函数,返回该函数会返回true的项组成的数组,返回新数组,func必须包含三个参数item,index,array
foreach(func) 对数组中的每一项运行给定函数,没有返回值,func必须包含三个参数item,index,array
map(func) 对数组中的每一项运行给定函数,返回每次调用的结果组成的数组,func必须包含三个参数item,index,array
some(func) 对数组中的每一项运行给定函数,如果该函数对任意一项返回true则返回true,func必须包含三个参数item,index,array
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 /* *every(func) *some(func) * */ varnewArr=[1,2,3,4,5,4,3,2,1] console.log( newArr.every(function(item,index,array){returnitem>1}), newArr.some(function(item,index,array){returnitem>1}) ) /* *filter(func) *map(func) */ varnewArr=[1,2,3,4,5,4,3,2,1] console.log( newArr.filter(function(item,index,array){returnitem>2}), newArr.map(function(item,index,array){returnitem-1}) )

注意: 对于数组的迭代类方法,必须传递三个参数当前项(item),当前项位置(index),数组对象(array)

缩小方法:

方法名称 方法说明
reduce(func[,start]) 从第一个元素遍历到最后一个元素分别调用func,start为缩小基础初始值,func必须接受4个参数,前一个值,当前值,项的索引,数组对象
reduceRight(func[,start]) 从最后一个元素遍历到第一个元素分别调用func,start为缩小基础初始值,func必须接受4个参数,前一个值,当前值,项的索引,数组对象
1 2 3 4 5 6 7 8 9 10 11 12 /* *reduce(func[,start]) *reduceRight(func[,start]) */ varnewArr=[1,2,3,4,5,4,3,2,1] varsum=function(PRe,cur,index,array){ returnpre+cur } console.log( newArr.reduce(sum), newArr.reduceRight(sum) )

 

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

脚本宝典总结

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

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

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