js高阶day03

改变this指向

// call():使用一个指定的 `this` 值调用一个函数

        // (简单理解为调用函数的方式，但是它可以改变函数的 this 指向)

// ①call会立即调用函数

 // ②参数传递的方式是以逗号隔开

 // ③可以改变this指向

function sum(a, b) {
            console.log(this);
            console.log(a + b);
            console.log(this.age + a + b);
        }
sum.call(obj, 200, 200);

// ①apply会立即调用函数

// ②传入参数是以数组形式

// ③改变this指向

function sum(a, b) {
            console.log(this);
            // console.log(a + b);
            console.log(this.age + a + b);
        }
sum.apply(obj, [65, 78])

// 在这一行bind只是把sum函数内部的this指向改变了

        // 并没有直接调用sum

// ①bind不会立即调用 需要手动调用

// ②传入参数以逗号隔开

// ③改变this指向

function sum(a, b) {
            console.log(this);
            // console.log(a + b);
            console.log(this.age + a + b);
        }
var rel = sum.bind(obj, 45, 60);
        console.log(rel);

定时器传参

var k = 100;
        setTimeout("fun(k)", 2000);

        function fun(i) {
            console.log(k);
        }

        setTimeout(function () {
        }, 1000)

        // for (var i = 0; i < 10; i++) {
        //     console.log(i);
        // }

        // 解决定时器不能传参的问题
        // 在外部封装函数 写在定时器方法里面进行调用
        // 注意：要用引号将函数包括

js高阶中数组的常用的操作方法

● arr.forEach(function(){}):遍历数组

var arr = [1, 2, 3, 5, 6, 7, 89];

        // 遍历数组
        var rel = arr.forEach(function (value, index, arr) {
            // value当前元素
            // index元素的索引
            // arr当前数组
            console.log(value + "-----" + index);
            console.log(arr);

            return "操作元素" + value
        })
        console.log(rel);
        // undefined
        // forEach没有返回值

        // function fun() {
        //     arguments.forEach(function (v) {
        //         console.log(v);
        //     })
        // }
        // fun(1, 2, 3, 4, 5, 65, 6, 7)

● arr.map(function(){}):对数组遍历并操作数组元素,返回操作后元素组成的新数组

 var arr = [1, 2, 3, 5, 6, 7, 89];

        // 遍历数组
        var rel = arr.map(function (value, index, arr) {
            // value当前元素
            // index元素的索引
            // arr当前数组
            console.log(value + "-----" + index);
            console.log(arr);

            return "操作元素" + value
        })
        console.log(rel);
        console.log(arr);
        // map 具有返回值
        // 注意：map() 不会对空数组进行检测, map() 不会改变原始数组。

● arr.filter(function({}));对数组元素进行过滤,返回符合元素组成的新数组

 // filter 过滤 方法创建一个数组，将满足条件的元素添加到新数组中返回
        var rel = arr.filter(function (value, index, arr) {
            // value当前元素
            // index元素的索引
            // arr当前数组
            console.log(value);

            // 具有返回值
            return value > 50
        })

● arr.find(function){})方法返回符合查找条件的第一个数组元素的值。

var arr = [56, 32, 78, 11, 23, 103, 45, 103];
        // find() 方法返回通过测试（函数内判断）的数组的第一个元素的值。
        // find() 方法为数组中的每个元素都调用一次函数执行：
        // 如果没有符合条件的元素返回 undefined
        var rel = arr.find(function (v) {
            console.log("执行");
            return v > 100
        })
        console.log(rel);

● arr.some(function){}):对数组的元素进行判断是否有符合的元素

var arr = [56, 32, 78, 11, 23, 103, 45, 103];
        // some 查找数组中是否有满足条件的元素 ,如果数组中有元素满足条件返回 true，否则返回 false。
        var rel = arr.some(function (v) {

            return v > 100
        })
        console.log(rel);

● arr.every(function){}):对数组的元素进行判断是否全部符合

 var arr = [56, 32, 78, 11, 23, 103, 45, 103];
        // every() 方法用于检测数组所有元素是否都符合指定条件（通过函数提供）。
        var rel = arr.every(function (v) {
            console.log("zhixing");
            return v < 100
            // 如果数组中检测到有一个元素不满足，则整个表达式返回false，且剩余的元素不会再进行检测。
            // 所有元素都满足条件 才会返回true
        })
        console.log(rel);

● arr.reduce(function(total,value,index,array){},initialValue)：方法接收一个函数作为累加器，数组中的每个值（从左到右）开始缩减，最终计算为一个值。

 // reduce方法接收一个函数作为累加器，数组中的每个值（从左到右）开始缩减，最终计算为一个值。
        // array.reduce(function (total, value, index, array) {
        // - total 必需。初始值, 或者计算结束后的返回值。
        //   value 必需。当前元素 
        //   index 可选。当前元素的索引 
        //   array可选。当前元素所属的数组对象。 
        // - initialValue 作为第一次调用 `callback`函数时的第一个参数的值。 如果没有提供初始值，则将使用数组中的第一个元素。
        // }, initialValue)


        // 求和
        var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9];
        var rel1 = arr.reduce(function (total, value) {
            // console.log(total);
            // console.log(value);
            return total + value
        })
        console.log(rel1);


        // 求最大值
        var arr2 = [45, 67, 12, 2, 103, 44, 33];
        var rel2 = arr2.reduce(function (total, value) {
            // if (total < value) {
            //     total = value;
            // }
            return Math.max(total, value);
        })
        console.log(rel2);



        // 数组去重
        // splice  push()
        var arr3 = [44, 65, 44, 12, 3, 2, 5, 2, 16];
        var rel3 = arr3.reduce(function (total, value, index) {
            // []
            if (!total.includes(value)) {
                total.push(value);
            }
            return total;
        }, [])
        console.log(rel3);


        arr3.sort(function (a, b) {
            return a - b;
        })
        console.log(arr3);