На данный момент Lodash является наиболее зависимым пакетом npm , но если вы используете ES6, он может вам и не понадобиться.
В этой статье мы рассмотрим использование собственных методов сбора данных с функциями стрелок и другими новыми функциями ES6, чтобы помочь нам обойти многие популярные варианты использования.
1. Карта, фильтр, уменьшить
Эти методы сбора делают преобразование данных быстрым и практически универсальным. Мы можем связать их с функциями стрелок, чтобы помочь нам написать краткие альтернативы реализациям, предлагаемым Lodash:
_.map([1, 2, 3], function(n) { return n * 3; });
// [3, 6, 9]
_.reduce([1, 2, 3], function(total, n) { return total + n; }, 0);
// 6
_.filter([1, 2, 3], function(n) { return n <= 2; });
// [1, 2]
// becomes
[1, 2, 3].map(n => n * 3);
[1, 2, 3].reduce((total, n) => total + n);
[1, 2, 3].filter(n => n <= 2);
Здесь это не останавливается. Если мы используем современный браузер, мы также можем использовать find , some , each и reduRight .
2. Голова и хвост
Разрушающий синтаксис позволяет нам получить начало и конец списка без вспомогательных функций:
_.head([1, 2, 3]);
// 1
_.tail([1, 2, 3]);
// [2, 3]
// becomes
const [head, ...tail] = [1, 2, 3];
Также возможно получить начальные элементы и последний элемент аналогичным образом:
_.initial([1, 2, 3]);
// -> [1, 2]
_.last([1, 2, 3]);
// 3
// becomes
const [last, ...initial] = [1, 2, 3].reverse();
Если вас раздражает, что реверс изменяет структуру данных, то вы можете использовать оператор распространения, чтобы клонировать массив перед вызовом реверса:
const xs = [1, 2, 3];
const [last, ...initial] = [...xs].reverse();
3. Отдых и распространение
Остальные и расширенные функции позволяют нам определять и вызывать функции, которые принимают переменное число аргументов. ES6 представил специальные синтаксисы для обеих этих операций:
var say = _.rest(function(what, names) {
var last = _.last(names);
var initial = _.initial(names);
var finalSeparator = (_.size(names) > 1 ? ', & ' : '');
return what + ' ' + initial.join(', ') +
finalSeparator + _.last(names);
});
say('hello', 'fred', 'barney', 'pebbles');
// "hello fred, barney, & pebbles"
// becomes
const say = (what, ...names) => {
const [last, ...initial] = names.reverse();
const finalSeparator = (names.length > 1 ? ', &' : '');
return `${what} ${initial.join(', ')} ${finalSeparator} ${last}`;
};
say('hello', 'fred', 'barney', 'pebbles');
// "hello fred, barney, & pebbles"
4. Карри
Без языка более высокого уровня, такого как [TypeScript] [5] или [Flow] [6], мы не можем дать нашим сигнатурам типа функций, что делает каррирование довольно трудным. Когда мы получаем функции карри, трудно узнать, сколько аргументов уже было предоставлено, и что нам нужно будет предоставить дальше. С помощью функций со стрелками мы можем явно определять функции карри, облегчая их понимание для других программистов:
function add(a, b) {
return a + b;
}
var curriedAdd = _.curry(add);
var add2 = curriedAdd(2);
add2(1);
// 3
// becomes
const add = a => b => a + b;
const add2 = add(2);
add2(1);
// 3
Эти явно каррированные функции стрелок особенно важны для отладки:
var lodashAdd = _.curry(function(a, b) {
return a + b;
});
var add3 = lodashAdd(3);
console.log(add3.length)
// 0
console.log(add3);
// function (a, b) {
// /* [wrapped with _.curry & _.partial] */
// return a + b;
// }
// becomes
const es6Add = a => b => a + b;
const add3 = es6Add(3);
console.log(add3.length);
// 1
console.log(add3);
// function b => a + b
Если мы используем функциональную библиотеку, такую как lodash / fp или ramda , мы также можем использовать стрелки, чтобы убрать необходимость в стиле авто-карри:
_.map(_.prop('name'))(people);
// becomes
people.map(person => person.name);
5. Частичное
Как и при каррировании, мы можем использовать функции стрелок, чтобы сделать частичное применение простым и понятным:
var greet = function(greeting, name) {
return greeting + ' ' + name;
};
var sayHelloTo = _.partial(greet, 'hello');
sayHelloTo('fred');
// "hello fred"
// becomes
const sayHelloTo = name => greet('hello', name);
sayHelloTo('fred');
// "hello fred"
Также возможно использовать параметры отдыха с оператором распространения, чтобы частично применить функции с переменными координатами:
const sayHelloTo = (name, ...args) => greet('hello', name, ...args);
sayHelloTo('fred', 1, 2, 3);
// "hello fred"
6. Операторы
Lodash поставляется с рядом функций, которые переопределяют синтаксические операторы как функции, чтобы их можно было передавать в методы сбора.