JS(ES5) 实现数组方法（迭代类型：evey、some、map、filter）的重构

小鱼儿 2022-09-09 09:30 112阅读 0赞

重构前要理解这些方法的要干嘛、能干嘛，还有明白传入每个参数有什么用。

数组调用evey、some、map、filter方法中，传入的第一个参数是回调函数（必填），第二个参数是一个对象（可填、可不填），作用是改变第一个参数里的回调函数this指向为这个对象。

### **1.重构方法之every** ###

Array.prototype.myEvery = function (fun, obj) {
        for (var i = 0; i < this.length; i++) {
            if (!(obj ? fun.bind(obj)(this[i], i, this) : fun(this[i], i, this))) {
                return false;
            }
        }
        return true;
    }
    var arr = [1, 2, 3, 4, 5]
    var result = arr.myEvery(function (item, index, arr) {
        console.log(this);   // 输出 { name: 'zhangsan' }
        // 如果没填第二个参数（{ name: 'zhangsan' }） 在node环境下输出 global,浏览器环境输出 window
        // 如果填了第二个参数 this就会指向这个对象 即当前为{ name: 'zhangsan' }
        return item > 0;
    }, { name: 'zhangsan' })//这里填了第二个参数，改变了第一个参数回调函数的this指向
    console.log(result);  //  输出 true  因为数组每个元素都大于0

### **2.重构方法之some** ###

Array.prototype.mySome = function (fun, obj) {
        for (var i = 0; i < this.length; i++) {
            if (obj ? fun.bind(obj)(this[i], i, this) : fun(this[i], i, this)) {
                return true;
            }
        }
        return false;
    }
    var arr = [1, 2, 3, 4, 5]
    var result = arr.mySome(function (item, index, arr) {
        console.log(this);  //输出 { name: 'zhangsan' }
        return item > 5;
    }, { name: 'zhangsan' })
    console.log(result);    //输出 false  因为数组中没有元素大于5

### **3.重构方法之map** ###

Array.prototype.myMap = function (fun, obj) {
        var result = []
        for (var i = 0; i < this.length; i++) {
            result[i] = obj ? fun.bind(obj)(this[i], i, this) : fun(this[i], i, this)
        }
        return result
    }
    var arr = [1, 2, 3, 4, 5];
    var result = arr.myMap(function (item, index, arr) {
        console.log(this);  //输出  { name: 'zhangsan' }
        return item * 2;
    }, { name: 'zhangsan' })
    console.log(result);    //输出  [ 2, 4, 6, 8, 10 ]

### **4.重构方法之filter** ###

Array.prototype.myFilter = function (fun, obj) {
        var result = []
        for (var i = 0; i < this.length; i++) {
            if (obj ? fun.bind(obj)(this[i], i, this) : fun(this[i], i, this)) {
                result.push(this[i])
            }
        }
        return result;
    }
    var arr = [1, 2, 3, 4, 5];
    var result = arr.myFilter(function (item, index, arr) {
        console.log(this);   // 输出 { name: 'zhangsna' }
        return item > 2;
    }, { name: 'zhangsna' })
    console.log(result);     //输出 [ 3, 4, 5 ]