ES5常用的数组方法总结

·  阅读 199

这是我参与8月更文挑战的第1天,活动详情查看:8月更文挑战

博主相关个人技术博客、微信公众号、视频号、设计作品集

1、push 往数组最后添加数组项改变原数组

  • return返回添加后的数据个数length
  • 需要传参 ( 不传则认为是空 数组不添加) 可以传参多个
let arr = [1,2,3,4,5,6]; 
arr.push(7);  //return 7 
console.log(arr);  // [1,2,3,4,5,6,7] 
arr.push("l","o","v","e");  //[1,2,3,4,5,6,7,"l","o","v","e"]
复制代码

2、 pop 删除数组最后一项

  • return返回 移除的这条 数据 
  • 不需要传参 ( 只删最后一条) 一次删一个
let arr = [1,2,3,4,5,6,7]; 
console.log( arr.pop() ); // 7 返回移除的数据 7 
console.log(arr); // [1, 2, 3, 4, 5, 6] 7被删除了
复制代码

3、unshift 往数组最前添加数组项 ( 数据 )

  • return 返回添加后的数据个数length
  • 需要传参 可以传参多个
let arr = [1,2,3,4,5,6,7]; 
arr.unshift("l","o","v","e"); //return 11 
console.log(arr); // ["l","o","v","e",1, 2, 3, 4, 5, 6, 7]
复制代码

4、shift 删除数组最前一项

  • return返回 移除的这条 数据
  • 不需要传参 ( 反正只删最前面一条 不管你是谁 ) 一次删一个
let arr = [1,2,3,4,5,6,7]; 
arr.shift(); // return 1 
console.lig(arr); // [2,3,4,5,6,7]
复制代码

5、slice 切割数组通过下标截取数组 (不改变原数组)

  • 参数 (下标/索引值)左闭右开 
  • 只有一个参数默认这个下标开始一直到结束
let arr = [1,2,3,4,5,6,7];
let arr1 = arr.slice(4,6);  //4 5 6 右开所以6取不到 
console.log(arr1);  // [5,6] 对应下标 4 5
复制代码

 6、splice( index ,num ,new...) 替换

  • 第一个参数 index => 开始替换的下标 必选
  • 第二个参数 num => 从左至右 替换的个数 必选
  • 后面的参数 new =>替代的新的数据 可选
let arr = [1,2,3,4,5,6,7]; 
let arr1 = arr.splice(2,3,"l","o","v","e"); 
console.log(arr1); // [3,4,5,] 返回的被剪下来的数组 
console.log(arr);  // [1, 2, "l","o","v","e", 6, 7]
复制代码

可替代以上5种方法 

//push 后增 
arr.splice(arr.length,0,"l") //从最后一个开始删 删0个 后面不拼接上去 

//pop 后减 
arr.splice(arr.length-1,1) //从第一个开始删 删一个 后面不拼接上去 

//unshift 前增 
arr.splice(0,0,"l")  //从第一个开始删 删0个 

//shift 前减 
arr.splice(0,1) 

//slice 切割 比如slice(3,5) 左闭右开 实际切3 4 
arr.splice(3,2)
复制代码

7、concat 数组拼接 返回拼接后的数组

  • 要拼接的主体放前面 , 拼接的数组 放到方法里面
  • 可拼接多个数组 返回新的数组,需要变量接收
let arr = ["l"]; 
let arr1 = ["o"] 
let arr2 = ["v"] 
let arr3 = arr.concat(arr1, arr2); 
// arr3 = arr.concat(["o"], ["v"])
// arr3 = arr.concat("o", "v")
console.log(arr3) 

复制代码

8、join 数组变字符串 必备

  • ​ "" 空代替 ,
  • ​ "+" 加代替 ,
  • ​ " " 空格代替 ,
let arr = [1,2,3,4,5,"l"] 
let str = arr.join() //"1,2,3,4,5,l" 
let str1 = arr.join("") // "12345l" 
let str2 = arr.join("+") // "1+2+3+4+5+l" 
let str3 = arr.join(" ") // "1 2 3 4 5 l"
复制代码

9、sort 排序  修改原数组内数据排序

// 以首字符编码顺序排序 
let arr = [9,5,3,1,7,8,4] 
arr.sort() 
console.log(arr) //[1, 3, 4, 5, 7, 8, 9]
复制代码
  • value > 0 不换顺序
  • 正序 ( 冒泡排序 )
  • a - b 由小及大 升序
let arr = [9,5,3,1,7,8,4]; 
arr.sort(function(a, b){ 
    return a - b; 
}) 
console.log(arr); // [1, 3, 4, 5, 7, 8, 9]
复制代码
  • 倒序 ( 冒泡排序 )
  • b - a 由大及小 降序
let arr = [9,5,3,1,7,8,4]; 
arr.sort(function(a, b){ 
    return b - a; 
}) 
console.log(arr) // [9, 8, 7, 5, 4, 3, 1]
复制代码
  • json 对象数组排序
    var data = [{
            name: "海外事业部",
            value: 0.58
        }, {
            name: "内销",
            value: 0.36
        }, {
            name: "互联网中心",
            value: 0.78
    }]; 

//     function compare(a,b){
//         return b.value-a.value;
//     }

    //es6写法
    let compare = (a,b) => b.value-a.value;
    data.sort(compare);
    console.log(data);
复制代码
分类:
前端
标签:
收藏成功!
已添加到「」, 点击更改