javascript 的 Array原型方法實現原理

這個是兼容node和瀏覽器環境的,不須要能夠刪掉node

try {
        _this = _this || window;
    } catch (e) {
        _this = {};
    }
複製代碼

reverse

function myReverse(arr) {
    var times = (arr.length / 2) | 0;
    for (var i = 0; i < times; i++) {
        [arr[i], arr[arr.length - 1 - i]] = [arr[arr.length - 1 - i], arr[i]]
    }
}

複製代碼

forEach

Array.prototype.myForEach = function (fn, _this) {
    var length = this.length;
    
    //兼容node 和 chrome
    try {
        _this = _this || window;
    } catch (e) {
        _this = {};
    }
    
    if (fn) {
        for (var i = 0; i < length; i++) {
            fn.apply(_this, [this[i], i, this]);
        }
    }
}
複製代碼

filter

Array.prototype.myFilter = function (fn, _this) {
    var arr = [];
    var length = this.length;
    
    try {
        _this = _this || window;
    } catch (e) {
        _this = {};
    }

    if (fn) {
        for (var i = 0; i < length; i++) {
            fn.apply(_this, [this[i], i, this]) && arr.push(this[i])
        }
    }
    return arr;
}

var arr = [1, 2, 3, 4, 5];
var newArr = arr.myFilter((ele, index, self) => {
    return ele > 3 ? true : false
})
console.log(newArr)
複製代碼

map

Array.prototype.myFilter = function (fn, _this) {
    var arr = [];
    var length = this.length;
    try {
        _this = _this || window;
    } catch (e) {
        _this = {};
    }

    if (fn) {
        for (var i = 0; i < length; i++) {
            fn.apply(_this, [this[i], i, this]) && arr.push(this[i])
        }
    }
    return arr;
}

var arr = [1, 2, 3, 4, 5];
var newArr = arr.myFilter((ele, index, self) => {
    return ele > 3 ? true : false
})
console.log(newArr)
複製代碼

every

判斷是否數組中的每個元素都符合條件, 若是都符合條件,返回true, 若是不符合,返回falsechrome

Array.prototype.every = function (fn, _this) {
    var length = this.length;
    try {
        _this = _this || window;
    } catch (e) {
        _this = {};
    }
    
    if (fn) {
        for (var i = 0; i < length; i++) {
            var returnValue = fn.apply(_this, [this[i], i, this]);
            if (!returnValue) {
                return false;
            }
        }
    }
    return true;
}

var arr = [2, 3, 45, 6, 7, 8, 9];
var flag = arr.every((ele, index, self) => {
    return ele < 100
})
console.log(flag)
複製代碼

some

數組中是否有一個符合條件, 若是有的話, 返回true, 不然返回false數組

Array.prototype.mySome = function (fn, _this) {
    var length = this.length;

    try {
        _this = _this || window;
    } catch (e) {
        _this = {};
    }
    if (fn) {
        for (var i = 0; i < length; i++) {
            var returnValue = fn.apply(_this, [this[i], i, this]);
            if (returnValue) {
                return true;
            }
        }
    }
    return false;
}

var arr = [2, 3, 45, 6, 7, 8, 9];
var flag = arr.mySome((ele, index, self) => {
    return ele < 3
})
console.log(flag)
複製代碼

reduce 接力傳遞

使用時要有返回值瀏覽器

Array.prototype.myReduce = function (fn, prevValue, _this) {
    var length = this.length;

    try {
        _this = _this || window;
    } catch (e) {
        _this = {};
    }

    if (prevValue) {
        for (var i = 0; i < length; i++) {
            prevValue = fn.apply(_this, [prevValue, this[i], i, this]);
        }
    } else if (!prevValue) {
        prevValue = this[0];
        for (var i = 1; i < length; i++) {
            prevValue = fn.apply(_this, [prevValue, this[i], i, this]);
        }
    }
    return prevValue;
}

var arr = [7, 8, 9];
var sum = arr.myReduce((prevValue, currentValue, index, self) => {
    return prevValue += currentValue
}, 6)
console.log(sum);
複製代碼

reduceRight 反向接力傳遞

Array.prototype.myReduceRight = function (fn, prevValue, _this) {
    var length = this.length;

    try {
        _this = _this || window;
    } catch (e) {
        _this = {};
    }

    if (prevValue) {
        for (var i = length - 1; i >= 0; i--) {
            prevValue = fn.apply(_this, [prevValue, this[i], i, this]);
        }
    } else if (!prevValue) {
        prevValue = this[length - 1];
        for (var i = length - 2; i >= 0; i--) {
            prevValue = fn.apply(_this, [prevValue, this[i], i, this]);
        }
    }
    return prevValue;
}

var arr = [1,2,3];
var sum = arr.myReduceRight((prevValue, currentValue, index, self) => {
    return prevValue += currentValue
}, 5)
console.log(sum)
複製代碼

Array上面的所有方法:bash

//鏈接數組, 返回值是新的鏈接好的數組, 不會改變原數組
concat: ƒ concat() 

//填充相同的元素
fill: ƒ fill()

//查找到最近的符合條件的
find: ƒ find()

//查找到最近的符合條件的元素的索引
findIndex: ƒ findIndex()
[3,2].findIndex((ele)=>ele>1) // 1

//淺層扁平化
flat: ƒ flat()
[1,[2,[3]]].flat() // [1, 2, Array(1)]

// 是否含有
includes: ƒ includes()

// 從後向前查找
lastIndexOf: ƒ lastIndexOf()

//截取並返回新數組,不會改變原數組
slice: ƒ slice()

// 改變原數組, 實現增刪,返回被截取掉的部分
splice: ƒ splice()

複製代碼
相關文章
相關標籤/搜索