数组常用的操作(方法)

1.常用方法

push pop unshift shift splice concat

<script>
    // push pop unshift shift splice concat

    let list = ["css","jquery","html","javascript"];

// list.push("Vue"); //往数组后面追加一个元素
// console.log(list);

// let ret =  list.pop(); //删除数组最后一个元素
// console.log(list);
// console.log(ret); //返回删除的那个一值

// let ret = list.unshift("Vue"); //往数组最前面添加一个元素  返回数组的长度
// console.log(ret);

// let ret = list.shift();//删除数组的第一项元素  返回删除的那一项
// console.log(ret);

// let ret = list.splice(要操作元素的下标,要删除元素的个数,要添加的元素);
// let ret = list.splice(2,1,10,20,30);
// console.log(list);

// let ret = list.concat([10,20,30]);  //合并数组 , 返回新数组 不会改变原来的数组
// console.log(list); //原来的数组
// console.log(ret); //新数组

let  ret = [...list,...[10,20,30]];  // ... es6的写法  合并数组
console.log(ret);

</script>

2.reduce、filter、map 遍历数组的三个方法 (重点)

<script>
    let list = [1, 2, 3];

// let ret = list.reduce((pre,current)=>{
//     let total = pre + current; //没遍历一次元素就执行一次这个方法 pre是上一次遍历返回的值 current是当前遍历的值
//     return total;  //返回元素的和
// },0);
// console.log(ret);  //6

//遍历每一个元素，把符合return后面的这个条件的元素找出来，整理成新的数组，赋给ret2
// let ret2 = list.filter(current=>{
//     return current>2; //return后面是过滤的条件
// });
// console.log(ret2);

// 遍历每一个元素，对每一个元素进行操作，并返回到新的数组中
let ret3 = list.map(current => {
    return { id: current }; //return 后面可以返回自己定义的数据形式
});
console.log(ret3);
</script>

3.数组去重

indexOf()注意事项：indexOf()方法返回在数组中可以找到一个给定元素的第一个索引，如果不存在，则返回-1

<script>
    // var arr = [1, 1, 2, 5, 4, 4, 5];

    // console.log([...new Set(arr)]); //这两个是es6的写法
    // console.log(Array.from(new Set(arr)));
	 
    // 使用indexOf 属性
    // var new_arr = [];
    // for(let i =0;i<arr.length;i++){
    //     if(new_arr.indexOf(arr[i])==-1){
    //         new_arr.push(arr[i]);
    //     }
    // }
    // console.log(new_arr);

    // 第三种去重方式有bug 不推荐使用  如果数组有多个0  NaN undefined "" null 会隐士转换为false 再取反为true   会出现去重失败问题
    // var new_arr = [];
    // var obj = {};
    // for (let j = 0; j < arr.length; j++) {
    //     if (!obj[arr[j]]) {
    //         obj[arr[j]] = arr[j];
    //         new_arr.push(arr[j]);
    //     }
    // }
    // console.log(new_arr);
    // console.log(obj);

    // 使用过滤器去重
    var arr = [1,2,3,1,6,2,3];
//[1,2,3]   使用filter过滤器去重
let new_arr = arr.filter((current, index, self) => {
    //current 是旧数组的当前元素 index是旧数组当前元素的下标，self 是旧数组 arr
    return self.indexOf(current) === index;  //比较值为false，说明有重复元素
    // 注意：当indexOf找到重复元素的时候会返回该元素第一次出现的下标，而不是返回重复元素的当前下标
}); 
</script>