splice与slice实现数组的增删改查

let arr = [1, 2, 3, 4];
console.log(arr.slice(1, 3)); //从第一个开始截到3 得到的就是一个2 和 3 不会改变原数组
console.log(arr.slice(0, 3)); //从0开始截到3 得到的就是一个1 和 2 和 3 不会改变原数组
console.log(arr.slice());  //如果不穿参数 得到的是整个数组
console.log(arr);

let arr = [1, 2, 3, 4];
// console.log(arr.splice(1, 2)); //从数组下标1开始 截取1后面2个 返回截取的数组[2, 3] 会改变原数组
// console.log(arr); //[1, 4]
let hd = arr.splice(1, 2, '123'); //从数组下标1开始  截取1后面的2个 再从1后面增加一个123 会改变原数组
// console.log(arr); //[1, '123', 4]

数据出栈与入栈及填充操作

let arr = [1, 2, 3];
// let hd = arr.pop(); //删除最后一个 返回删除的数字 改变原数组
// let hd = arr.unshift(0); // 往数组前面增加一个 返回增加的数组 改变原数组
// let hd = arr.shift(); //删除数组中第一个 返回 删除的值 改变原数组
let hd = arr.push(0); //往数组后面增加一个 返回增加的数组 改变原数组

解构赋值 可以理解为把结构里面的值批量赋值给变量

    //数组解构赋值
    let arr = ['孙悟空', '猪八戒'];
    let [swk, zbj] = arr;
    console.log(swk); //孙悟空
    console.log(zbj); //猪八戒

    //对象解构赋值
    let obj = {name: '孙悟空', age: '1000'};
    let {name, age} = obj;
    console.log(name); //孙悟空
    console.log(age); //1000

let [, arr] = ['name1', 'name2']
console.log(arr); //name2

let [arr, ...arrAll] = ['name1', 'name2', 'name3', 'name4']
console.log(arr); //name1
console.log(arrAll); //['name2', 'name3', 'name4'

展开运算符 展开放在变量位置 是把内容全部吸过来 放在值的位置 就表示 全部展开

  //一般拼接数组方法
    let arr = [1, 2, 3];
    let hd = [4, 5, 6];
    for (let item of hd) {
        arr.push(item);
    }
    console.log(arr); //[1, 2, 3, 4, 5, 6]

//展开符拼接数组
 let arr = [1, 2, 3];
 let hd = [4, 5, 6];
 arr = [...arr, ...hd];
 console.log(arr); //[1, 2, 3, 4, 5, 6]

   //函数展开语法 当函数参数不确定时候 可以用展开语法接受参数
    function show(...args) {
        console.log(args); //[1, 2, 3, 4] 返回的是一个数组
    }
    console.log(show(1, 2, 3, 4));

数组的拆分与合并

    let arr = '孙悟空, 猪八戒';
    let hd = arr.split(','); //以逗号形式拆分 字符串 并返回一个数组;
    console.log(hd); // ["孙悟空", " 猪八戒"]
    console.log(hd.join(',')) //孙悟空, 猪八戒 （以逗号的形式 合并 返回字符串）

查找元素的基本操作

es5 之前查找元素 indexOf() 从左侧查找数组 返回查找数组的索引值，如果数组中不包含查找的数字 返回-1

 let arr = [1, 2 , 3 , 2];
 console.log(arr.indexOf(2)) // 1（返回arr数组中2的位置）
 console.log(arr.indexOf(-2)) // -1 (数组中没有-2这个值)
 console.log(arr.indexOf(2, 2)) // 3 (参数1：查找2   参数2：从数组第二个开始查找)

lastIndexOf（）从右侧查找数组 返回查找数组的索引值，如果数组中不包含查找的数字 返回-1

 let arr = [1, 2 , 4, 5, 3 , 2];
 console.log(arr.lastIndexOf(2)) // 返回3 （因为从右侧开始查找，输入从右边 要查找的 位置）
 console.log(arr.lastIndexOf(2, 3)) // 1 （参数1：查找2 参数2：从数组最后一个数三位开始查找 2)

一般开发中要找数组中是否包含某个数

  let arr = [1, 2 , 3];
  if(arr.indexOf(2) !== -1){
    console.log('找到了');
  }

新版的es6中 有一个includes() 接受一个参数查找数组中是否有要查找的值 返回的是一个布尔值

 let arr = [1, 2 , 3];
 console.log(arr.includes(2)) //true
 console.log(arr.includes(5)) //false
 if(arr.includes(2)){
   console.log('找到了');
 }

高效的find与findIndex新增方法

   // find 最主要的查找用法 查找引用类型 （引用类型比较 比较的是内存地址 ）
   let lessons = [{name: 'js'}, {name: 'php'}, {name: 'css'}];
   let status = lessons.find(item => item.name == 'php'); //就进查找 数组中是否有值 有的话 返回当前值，没有就返回undefined
   let status1 = lessons.find(item => item.name == 'java'); //undefined
   let index = lessons.findIndex(item => item.name == 'php'); //就进查找 数组中是否有值 有的话 返回索引值，没有就返回undefined
   console.log(status); //{name: "php"}
   console.log(status1); // undefined
   console.log(index); // 1

//自定义find写法

    function find (array, callback) {
        for (let item of array){
            if (callback(item)) return item;
        }
        return undefined;
    }

    let arr = [1, 2, 3, 4];
    console.log(find(arr, function (item) {
        return item === 3
    }));

sort排序

    //sort排序
    let arr = [10, 8, 6, 5, 2, 1];
    arr = arr.sort(function (a, b) {
        // -1 从小到大 1 正数从大到小
        // 10 - 8 =
        return a - b;
    });
    arr = arr.sort((a,b) => a - b);
    console.log(arr);

//冒泡排序
// 1、比较相邻的两个元素，如果前一个比后一个大，则交换位置。
// 2、比较完第一轮的时候，最后一个元素是最大的元素。
// 3、这时候最后一个元素是最大的，所以最后一个元素就不需要参与比较大小。
function sort(array) {
    for (let n in array) {
        for (let m in array){
            let tep = [];
            if (array[n] > array[m]){
                tep = array[n];
                array[n] = array[m]
                array[m] = tep;
            }
        }
    }
    return array;
}

console.log(sort([1, 9, 8]));

数组循环操作

//循环操作中引用类型使用技巧
    let arr = [{n: 1}, {n: 2}];
    let arr1 = [1, 2, 3];
    //for of 只能改变引用类型
    for (let value of arr) {
        value.n ++;
    }
    for (let value1 of arr1) {
        value1 ++; // 不会改变值类型的数组
    }
    console.log(arr); // [{n: 2}, {n: 3}]
  console.log(arr1); // [1, 2, 3]

forEach

   let arr = [
        {name : 'JavaScript'},
        {name : 'PHP'},
        {name : 'Python'}
    ]
    arr.forEach((item, index, array) => {
        //item 第一个参数是遍历的数组内容，
        // index 第二个参数是对应的数组索引，
        // array 第三个参数是数组本身
        console.log(item, index, array);
    })

every (返回一个布尔值)

const user = [
        {name: '李四', js: 89},
        {name: '张三', js: 99},
        {name: '马六', js: 55},
    ];
    /**
     * （every() 方法用于检测数组所有元素是否都符合指定条件。一项不符合 就返回false，全部符合就返回true）
     * item 是每一项的 数组
     * index 数组索引值
     * arr 原数组
     * **/
    const res = user.every((item, index, arr) => {
        return item.js >= 60; //false
    });

    if (res) {
        console.log('成绩不合格')
    } else {
        console.log('成绩全部合格')
    }

some (返回一个布尔值)

    //some 当一个为真 就返回真
    const user = [
        {name: '李四', js: 89},
        {name: '张三', js: 99},
        {name: '马六', js: 55},
    ];
    let res = user.some(item => {
        return item.js > 60;
    });
    console.log(res); //true

filter (可以筛选出想要的值，返回一个数组)

    let lessons = [{name: 'js'}, {name: 'php'}, {name: 'css'}];
    //求出数组中包含的css项
    let res = lessons.filter(item => {
        return item.name === 'css'
    });
    console.log(res);