美文网首页
数组、ES5数组方法

数组、ES5数组方法

作者: 5吖 | 来源:发表于2018-10-26 22:15 被阅读0次

    一、数组

    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
    

    相关文章

      网友评论

          本文标题:数组、ES5数组方法

          本文链接:https://www.haomeiwen.com/subject/wwxrtqtx.html