数组、ES5数组方法

一、数组

A、创建数组

(1) 构造函数

传入一个数字参数,则会创建一个长度为参数的数组,如果传入多个,则创建一个数组,参数作为初始化数据加到数组中

var a1 = new Array(5);
console.log(a1.length);//5
console.log(a1); //[] ,数组是空的

var a2 = new Array(5,6);
console.log(a2.length);//2
console.log(a2); //[5,6]

(2) 字面量

 var b = [1, 2, 'hello'];

但是使用字面量方式,无论传入几个参数,都会把参数当作初始化内容

var a1 = [5];
console.log(a1.length);//1
console.log(a1); //[5]

var a2 = [5,6];
console.log(a2.length);//2
console.log(a2); //[5,6]

使用带初始化参数的方式创建数组的时候,最好最后不要带多余的”,”,在不同的浏览器下对此处理方式不一样

var a1 = [1,2,3,]
console.log(a1.length)
console.log(a1)

这段脚本在现代浏览器上运行结果和我们设想一样,长度是3,但是在低版本IE下确实长度为4的数组,最后一条数据是undefined

B、元素添加、删除

(1) 基本方法

向数组内添加元素方法,直接使用索引就可以(index没必要连续)

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

数组也是对象,索引只是特殊的属性,所以我们可以使用删除对象属性的方法,使用delete 删除数组元素

delete a[2];
console.log(a[2]); //undefined

这样和直接把a[2]赋值为undefined类似,不会改变数组长度,也不会改变其他数据的index和value对应关系

(2) 栈方法

上面例子发现了,尤其是其删除方法,并不是我们希望的表现形式,我们很多时候希望删除中间一个元素后,后面元素的index都自动减一,数组length同时减一,就好像在一个堆栈中拿去的一个,数组已经帮我们做好了这种操作方式,poppush能够让我们使用堆栈那样先入后出使用数组

var a = [1, 2, 3];
a.push(4);
console.log(a);//[1, 2, 3, 4]
console.log(a.length);//4
console.log(a.pop());//4
console.log(a); //[1, 2, 3]
console.log(a.length);//3

(3) 队列方法

既然栈方法都实现了,先入先出的队列怎么能少,shift方法可以删除数组index最小元素,并使后面元素index都减一,length也减一,这样使用shift/push就可以模拟队列了,当然与shift方法对应的有一个unshift方法,用于向数组头部添加一个元素

var a=[1, 2, 3];
a.unshift(4);
console.log(a);//[4, 1, 2, 3]
console.log(a.length);//4
console.log(a.shift());//4
console.log(a); //[1, 2, 3]
console.log(a.length);//3

C、常用命令

(1) push-----------数组最后添加一个元素

var arr = [1,2,3]
arr.push('ok')   //给数组最后添加一个元素
//[1, 2, 3, "ok"] 

(2) pop------------数组最后一位踢出来

arr.pop() //把数组最后一位踢出来
//[1, 2, 3]

(3) pop------------数组最后一位踢出来

arr.shift() //把数组第一位踢出来
//[2, 3]

(4) unshift------------在数组第一位添加一个元素

arr.unshift('haha') //在数组第一位添加一个元素
//["haha", 2, 3]

(5) join------------用某个符号连接数组所有的值,生成字符串

arr.join('-') //连接
//"2-3"

(6) splice------------从数组的第一位开始,替换掉一位

arr.splice(1,1,'hello','one','two') //从数组的第一位开始,替换掉一位
//[2, "hello", "one", "two"]

(7) sort------------排序

arr.sort()  //排序
//[2, "hello", "one", "two"]

(8) reverse------------逆序即倒序

arr.reverse() //逆序即倒序
//["two", "one", "hello", 2]

(9) concat------------拼接数组

arr.concat('super') //拼接
//["two", "one", "hello", 2, "super"]

D、ES5 数组拓展

(1) Array.isArray(obj)

Array对象的一个静态函数,用来判断一个对象是不是数组

var a = [];
var b = new Date();
console.log(Array.isArray(a)); //true
console.log(Array.isArray(b)); //false

(2) indexOf(element)

查找数组内指定元素的位置,查找到第一个返回其索引,没有返回-1

var arr = [1,2,3,4,5]
console.log(arr.indexOf(3)) //2
console.log(arr.indexOf(9)) //-1

(3) forEach(element,index,array)

遍历数组,参数为一个回调函数,回调函数有三个参数:

1、当前元素
2、当前元素索引
3、整个数组

var arr = [1,2,3,4,5]
arr.forEach(function(e,index){
   arr[index] = e + 1      
})
console.log(arr) //[2, 3, 4, 5, 6]

(4) map (function(element))

与forEach类似,遍历数组,回调函数返回值组成一个新数组返回,新数组索引结构和原数组一致,原数组不变

var arr = [1,2,3,4,5]
console.log(arr.map(function(e){
   return e*e // [1, 4, 9, 16, 25]
}))
console.log(arr) //[1, 2, 3, 4, 5]

注:在空数组上调用,every返回true,some 返回false

(5) every (function(element,index,array))

所有函数的每个回调函数都返回true时才会返回true,当遇到false时终止执行,返回false

var arr = [1,2,3,4,5]
arr.every(function(val){
    return val>0?true:false
})//true

(6) some (function(element,index,array))

只要有一个回调函数返回true时终止执行并返回true,否则返回false

var arr = [1,2,3,4,5]
arr.some(function(val){
   return val>0?true:false
})//true

(7) filter(function(element))

返回一个子集,回调函数用于逻辑判断是否返回,返回true则把当前元素加入到返回数组中,false则不加
数组只包含返回true的值,索引缺失的不包括,原数组保持不变

var arr = [1,2,3,4,5,6]
console.log(arr.filter(function(val){
    return val > 3
})) // [4, 5, 6]
console.log(arr) // [1,2,3,4,5,6]

(8) reduce(function(v1,v2),value)

遍历数组,调用回调函数,将数组元素组合成一个值,从索引最小值开始,方法有两个参数

1、回调函数:把两个值合为一个,返回结果
2、value : 一个初始值,可选

var arr = [1,2,3,4,5,6]
arr.reduce(function(v1,v2){
    return v1 + v2
}) //21
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 215,076评论 6 497
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 91,658评论 3 389
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 160,732评论 0 350
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 57,493评论 1 288
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 66,591评论 6 386
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 50,598评论 1 293
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,601评论 3 415
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 38,348评论 0 270
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,797评论 1 307
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,114评论 2 330
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,278评论 1 344
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,953评论 5 339
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 40,585评论 3 322
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,202评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,442评论 1 268
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 47,180评论 2 367
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 44,139评论 2 352

推荐阅读更多精彩内容