map的用法和实现原理:
map即映射,将原数组映射返回新数组。
用法:
let arr = [1,2,3];
arr1 = arr.map(item => item * 2); // [2,4,6]
实现原理:
Array.prototype._map = function(callback) {
if (typeof callback !== 'function') throw new TypeError(callback + ' is not a function');
let newArr = [];
for (var i = 0; i < this.length; i ++) {
newArr.push(callback && callback(this[i], i, this));
}
return newArr;
}
filter的用法和实现原理:
filter即过滤,将原数组根据条件过滤返回新数组
用法:
let arr = [2,4,6,8];
let arr1 = arr.filter(function(item) {
return item > 5;
})
console.log(arr1); // [6,8]
实现原理:
Array.prototype._filter = function(callback) {
if (typeof callback !== 'function') throw new TypeError(callback + ' is not a function');
let newArr = [];
for (var i = 0; i < this.length; i ++) {
callback(this[i], i, this) && newArr.push(this[i]);
}
return newArr;
}
find的用法和实现原理:
查询数组第一个符合条件的元素,并返回该元素。
用法:
let arr = [2,4,6,8];
let value = arr.find(function(item) {
return item > 5;
})
console.log(value); // 6;
实现原理:
Array.prototype._find = function(callback) {
if (typeof callback !== 'function') throw new TypeError(callback + ' is not a function');
let currentVal;
for (var i = 0; i < this.length; i ++) {
if (callback(this[i], i, this)) {
currentVal = this[i];
break;
}
}
return currentVal;
}
reduce的用法和实现原理
reduce方法接收一个函数作为累加器,数组中每个值从左到右开始缩减,最终成为一个值。
用法:
let arr = [2,4,6,8];
let value = arr.reduce((prev, curr, index, arr) => {
return prev + curr;
}, 0);
console.log(value); // 20
实现原理:
Array.prototype._reduce = function(callback, initVal) {
if (typeof callback !== 'function') throw new TypeError(callback + ' is not a function');
for (var i = 0; i < this.length; i ++) {
initVal = callback(initVal, this[i], i, this);
}
return initVal;
}
some的用法和实现原理:
只要有一个元素满足条件就返回true。
用法:
let arr = [1,2,3,4];
let value = arr.some(item => item > 3);
console.log(value); // true
实现原理:
Array.prototype._some = function(callback) {
if (typeof callback !== 'function') throw new TypeError(callback + ' is not a function');
let flag = false;
for (var i = 0; i < this.length; i ++) {
if (callback(this[i], i, this)) {
flag = true;
break;
}
}
return flag;
}
every的用法和实现原理:
数组中每一个元素满足条件就返回true。
用法:
let arr = [2,4,6,8];
let value = arr.every(item => item > 2);
console.log(value); // false
实现原理:
Array.prototype._every = function(callback) {
if (typeof callback !== 'function') throw new TypeError(callback + ' is not a function');
let flag = true;
for (var i = 0; i < this.length; i ++) {
if (!callback(this[i], i, this)) {
flag = false;
break;
}
}
return flag;
}
利用reduce实现map:
Array.prototype._map = function(callback) {
if (typeof callback === 'function') {
return this.reduce((prev,curr,index,arr) => {
prev.push(callback(curr,index,arr));
return prev;
},[])
} else {
throw new Error(callback + ' is not function');
}
}
利用reduce实现filter:
Array.prototype._filter = function(callback) {
if (typeof callback !== 'function') throw new TypeError(callback + ' is not function');
return this.reduce((prev, curr, index, arr) => {
callback(curr, index, arr) ? prev.push(curr) : null;
return prev;
},[])
}
利用reduce求最大值和最小值:
let arr = [1,2,3,4,5];
console.log(arr.reduce((prev, curr) => Math.max(prev, curr))); // 5
console.log(arr.reduce((prev, curr) => Math.min(prev, curr))); // 1
利用reduce实现数组去重:
let arr = [1,2,1,2,1,2,3,4,1,3,2,3,5];
let arr2 = arr.reduce((prev,curr) => {
!prev.includes(curr) && prev.push(curr);
return prev;
},[]);
利用reduce扁平化数组:
function fun(arr) {
if (!Array.isArray(arr)) throw new TypeError(arr + ' is not Array');
return arr.reduce((prev, curr) => {
return Array.isArray(curr) ? prev.concat(fun(curr)) : prev.concat(curr) // concat也可以拼接元素,并返回拼接后的数组,push只能返回添加的元素
},[])
}
实现一个flat:
// 递归实现
Array.prototype.flat= function() {
return [].concat(...this.map(item => (Array.isArray(item) ? item.flat() : [item])));
}
// 迭代实现
function flatten(arr) {
let arrs = [...arr];
let newArr = [];
while (arrs.length) {
let item = arrs.shift(); // 这里使用前删
if (Array.isArray(item)) {
arr.unshift(...item); // 这里使用前增
} else {
newArr.push(item); // 这里按顺序添加到新数组中
}
}
return newArr;
}
网友评论