前端初学者笔记（三）JS部分数组API重构

 重构原型中的函数，需要了解原型函数中的功能。

1.调用方式 ；2.参数 怎样改变原数组 ；3.功能 ；4.返回值

//重构push
Array.prototype.myPush = function () {
    var len = this.length;
    //arguments.length - this.length == 将要压入的元素数量（长度）
    for (var i = len; i < len + arguments.length; i++) {
        this[i] = arguments[i - len]
    }
    return this.length //返回压入元素后的数组长度
}

push()，将参数压入数组尾端并返回数组长度。

//重构Pop
Array.prototype.myPop = function () {
    var last;
    if (this.length == 0) {
        return undefined;
    } else {
        last = this[this.length - 1] //获得数组的最后一个元素
        this.length--; //弹出最后一个元素后长度减1 也相当于删除了最后一个元素
    }
    return last
}

pop()，弹出数组最后一个元素，并将其返回。

//重构shift()
Array.prototype.myShift = function () {
    if (this.length == 0) {
        return undefined;
    }
    var firstElement = this[0]; //获取数组首元素
    for (var i = 1; i < this.length; i++) {
        this[i - 1] = this[i]; //数组元素全部前移一位
    }
    this.length = this.length - 1; //删除首位元素
    return firstElement;//返回首位元素
}

shift()，移除数组第一个元素并将其返回。

Array.prototype.myUnshift = function () {
    var sum = this.length + arguments.length; //添加后的新数组长度=当前数组长度+传参长度
    for (var i = sum; i > 0; i--) {
        if (i > arguments.length) { //如果新数组的长度大于传进来参数的长度
            this[i - 1] = this[i - 1 - arguments.length] //原数组的元素后移n位
        } else {
            this[i - 1] = arguments[i - 1] //传进来的参数压进数组前arguments位
        }
    }
    return this.length
}

unshift()，将参数作为首位元素添加进数组，原数组索引下标全部后移。并返回数组长度。

Array.prototype.myForEach = function (fn) {//调用时写的回调函数作为参数传入
    for (var i = 0; i < this.length; i++) {
        fn(this[i], i, this)  //依据数组循环执行传入的函数
        // 每一项  下标 数组本身
    }
}

forEach()，无返回（undefined），对数组的每一项遍历，可在回调函数中进行对每一项的筛查等操作。回调函数要作为参数传入。

function myMax() {
    return Math.max.apply(Math, this);
}
Array.prototype.max = myMax;//重写数组原型链

max()，返回数组最大值

以下的函数由于有第二个对象参数，因此在重构函数时，要设第二个参数obj，并判断是否有obj的实参，通过三元表达式判断，若有还需要用第一个参数的函数fn去调用bind方法修改this指向。让this指向到obj这个对象（没有obj时，即没有第二个参数时指向global(node.js)/window(html)）

Array.prototype.myEvery = function (fn, obj) {
    for (var i = 0; i < this.length; i++) {
        if (!(obj ? fn.bind(obj)(this[i]) : fn(this[i]))) {  //判断有没有第二个参数obj,有则用bind修改this指向
            return false; //短路原则 有一项不符合条件时返回false
            //this[i]即item 每一项
        }
    }
    return true
}

every()，对数组中的每一项根据回调函数中的条件进行判断，若有一项不符合则直接返回false。

some()，和every()类似，当数组中有一项符合条件即可返回true，因此将if中的取反去掉，并将两个return的false和true反转即可。

Array.prototype.mySome = function (fn, obj) {
    for (var i = 0; i < this.length; i++) {
        if ((obj ? fn.bind(obj)(this[i]) : fn(this[i]))) {  //判断有没有第二个参数obj,有则用bind修改this指向
            return true; //短路原则 有一项符合条件时就返回true
        }
    }
    return false
}

map()，对数组中的每一项进行回调函数里的加工，并返回一个加工后的新数组。

Array.prototype.myMap = function (fn, obj) {
    var res = [];
    for (var i = 0; i < this.length; i++) {
        res.push(obj ? fn.bind(obj)(this[i]) : fn(this[i])) //把每一项经过fn处理后 推入新数组里
    }
    return res
}

fiilter(), 根据回调函数里的条件对数组里的每一项进行筛选，并返回一个筛选后的新数组

Array.prototype.myFilter = function (fn, obj) {
    var res = [];
    for (var i = 0; i < this.length; i++) {
        if ((obj ? fn.bind(obj)(this[i]) : fn(this[i]))) {
            res.push(this[i]) //满足fn的条件就将每一项（this[i]）推入新数组
        }
    }
    return res;
}