Полифил это! Плоская, карта, фильтр и уменьшение - жесткий путь
7 августа 2025 г.Хорошо, время исповеди, я уже давно пишет JavaScript, но есть что -то странно приятное в возвращении к основам. Вы знаете, как попытка испечь ваш хлеб с нуля, даже если вы живете рядом с пекарней. Это именно то, о чем этот пост: выпекать наши версии некоторых классических методов массива.
Хотите понять, что такое полифиллы?Я рассмотрел их в своем блоге для звонка, применения и привязки.
Почему? Потому что это весело. Потому что это образовательно. И потому что в следующий раз, когда кто -то бросит на вас техническое интервью, как «Можете ли вы написать свой собственныйreduce«И вы случайно скажете:« Конечно, вы хотите это с комментариями или без? »
Сегодня строили полифиллы для:
flat()map()filter()reduce()
Получите мой передний конец подготовки, бесплатно для первых 50 человекКликните сюда.
Давай катимся.
flat()Блинной стек для массивов
if(!Array.prototype.myFlat){
Array.prototype.myFlat = function(depth){
if(depth < 0) return this;
const flatten = function(arr, depth){
return arr.reduce((acc,ele)=>{
if(Array.isArray(ele) && depth > 0){
acc = acc.concat(flatten(ele,depth -1));
}else{
acc.push(ele);
}
return acc;
},[])
}
return flatten(this,depth);
}
}
const nestedArray = [1, [2, [3, [4, 5]]], 6];
console.log(nestedArray.myFlat()); // Default depth = 1 => [1, 2, [3, [4, 5]], 6]
console.log(nestedArray.myFlat(2)); // Depth = 2 => [1, 2, 3, [4, 5], 6]
console.log(nestedArray.myFlat(3)); // Depth = 3 => [1, 2, 3, 4, 5, 6]
console.log(nestedArray.myFlat(0)); // Depth = 0 => [1, [2, [3, [4, 5]]], 6]
Просто основная сглаживающая функция. Заменит ли это вашу бэкэндскую работу? Нет. Но заставит ли вы чувствовать себя круто? Абсолютно.
map()Потому что иногда массивы нуждаются
if(!Array.prototype.myMap){
Array.prototype.myMap = function(fn, thisArg){
if(this == null) { return new Error("Not an array")};
if(typeof(fn) != 'function') {return new Error("Not an array")}
let result = [];
for(let i=0; i< this.length; i++){
if(i in this){
result.push(fn.call(thisArg,this[i], i, this));
}
}
return result;
}
}
a = [1,2,3,4,5].myMap(function (mem) {
return mem*mem;
})
console.log(a); // [ 1, 4, 9, 16, 25 ]
Простой и чистый. Никаких магических заклинаний.
filter()Только достойные пройдут
if(!Array.prototype.myFilter){
Array.prototype.myFilter = function(fn, thisArg){
if(this == null) { return new Error("Not an array")};
if(typeof(fn) != 'function') {return new Error("Not an array")}
let result = [];
for(let i=0; i< this.length; i++){
if(i in this && fn.call(thisArg,this[i], i, this)){
result.push(this[i]);
}
}
return result;
}
}
b = [1,2,3,4,5].myFilter(function (mem) {
return mem > 1;
})
console.log(b) //[ 2, 3, 4, 5 ]
Дайте ему тестовый запуск со своими собственными странными условиями. Даже отфильтроровать людей, которые не любят кофе; Ваш звонок.
reduce()Уровень босса
if(!Array.prototype.myReduce){
Array.prototype.myReduce = function(callback,initialValue){
if(this == null) {return new Error("Not an Array");}
if(typeof(callback) != 'function') {
return new Error("Not a function");
}
let arr = this;
let len = arr.length;
let hasInitial = arguments.length > 1;
let accumulator = hasInitial ? initialValue : arr[0];
let startIndex = hasInitial ? 0 : 1;
if (len === 0 && !hasInitial) {
throw new Error("Reduce of empty array with no initial value");
}
for (let i = startIndex; i < len; i++) {
if (i in arr) {
accumulator = callback(accumulator, arr[i], i, arr);
}
}
return accumulator;
}
}
let a = [1, 2, 3].myReduce((acc, val) => acc + val, 0);
console.log(a);
Сокращение похоже на тот друг, который сначала кажется пугающим, но как только вы узнаете их, они несут всю команду.
Зачем это?
Возможно, вам никогда не нужно использовать их в производственном приложении. Но знание того, как они работают, помогает вам:
- Поймите основы JavaScript лучше.
- Цените встроенные методы больше.
- Есть что -нибудь классное, чтобы сказать в интервью или притворяться, что отладки в кафе.
Так что продолжайте, свяжитесь с ними, добавьте свой собственный вкус и, возможно, даже продлите еще пару методов просто для удовольствия.
Вот и все, ребята! Надеюсь, вы нашли это полезным. Если вам понравилось, посмотрите больше статей в моем блоге,https://blog.nandan.dev/
Не стесняйтесь комментировать, напишите мне наconnect@nandan.dev, или свяжитесь со мной в Twitter, Instagram или GitHub.
Не забудьте подписаться на мою новостную рассылку для регулярных обновлений по темам JavaScript!
Twitter | Instagram | Github | Website
Оригинал