Фрагменты JavaScript вам нужно знать прямо сейчас 🔥 - #1

JavaScript – один из самых популярных языков, которые вы можете выучить. Как многие люди говорят: «Если вы собираетесь выучить только один язык программирования, перейдите на JavaScript».

Если это звучит убедительно, я начинаю серию, в которой я даю 10 фрагментов JavaScript каждую среду в течение 5 недель. Этот мой твит изначально вдохновил меня на создание этой серии, отбросьте как и следуйте за мной.

Вот список из 10 полезных фрагментов, которые вы можете изучить и использовать немедленно.

Давайте начнем!

1⃣ все

Этот фрагмент возвращает True, если функция предиката возвращает True для всех элементов в коллекции и false в противном случае. Вы можете опустить второй аргумент «fn», если хотите использовать Boolean в качестве значения по умолчанию.

const all = (arr, fn = Boolean) => arr.every(fn);

all([4, 2, 3], x => x > 1); // true
all([1, 2, 3]); // true

2⃣ Arraytocsv

Этот фрагмент преобразует элементы в строки с разделенными запятыми значениями.

const arrayToCSV = (arr, delimiter = ',') =>
  arr.map(v => v.map(x => `"${x}"`).join(delimiter)).join('\n');

arrayToCSV([['a', 'b'], ['c', 'd']]); // '"a","b"\n"c","d"'
arrayToCSV([['a', 'b'], ['c', 'd']], ';'); // '"a";"b"\n"c";"d"'

3⃣ arraytohtmllist

Этот фрагмент преобразует элементы массива в теги списка и добавляет их в список данного идентификатора.

const arrayToHtmlList = (arr, listID) =>
  (el => (
    (el = document.querySelector('#' + listID)),
    (el.innerHTML += arr.map(item => `${item}`).join(''))
  ))();

arrayToHtmlList(['item 1', 'item 2'], 'myListID');

4⃣ бифуркат

Этот фрагмент разбивает значения на две группы, а затем помещает правдивый элемент фильтра в первую группу, а во второй группе в противном случае.

Вы можете использовать array.prototype.reduce () и array.prototype.push () для добавления элементов в группы на основе фильтра.

const bifurcate = (arr, filter) =>
  arr.reduce((acc, val, i) => (acc[filter[i] ? 0 : 1].push(val), acc), [[], []]);
bifurcate(['beep', 'boop', 'foo', 'bar'], [true, true, false, true]); 
// [ ['beep', 'boop', 'bar'], ['foo'] ]

5⃣ Bytesize

Этот фрагмент возвращает длину строки в байтах.

const byteSize = str => new Blob([str]).size;

byteSize('😀'); // 4
byteSize('Hello World'); // 11

6⃣ капитализируйте

Этот фрагмент заработает первую букву строки.

const capitalize = ([first, ...rest]) =>
  first.toUpperCase() + rest.join('');

capitalize('fooBar'); // 'FooBar'
capitalize('fooBar', true); // 'Foobar'

7⃣ DayOfyear

Этот фрагмент получает день года от DateObject.

const dayOfYear = date =>
  Math.floor((date - new Date(date.getFullYear(), 0, 0)) / 1000 / 60 / 60 / 24);

dayOfYear(new Date()); // 272

8⃣ декапитализируется

Этот фрагмент превращает первую букву струны в нижний регистр.

const decapitalize = ([first, ...rest]) =>
  first.toLowerCase() + rest.join('')

decapitalize('FooBar'); // 'fooBar'
decapitalize('FooBar'); // 'fooBar'

9⃣ Countoccurrences

Этот фрагмент подсчитывает возникновение значения в массиве.

const countOccurrences = (arr, val) => arr.reduce((a, v) => (v === val ? a + 1 : a), 0);
countOccurrences([1, 1, 2, 1, 2, 3], 1); // 3

🔟 По умолчанию. Этот фрагмент назначает значения по умолчанию для всех свойств в неопределенном объекте.

const defaults = (obj, ...defs) => Object.assign({}, obj, ...defs.reverse(), obj);

defaults({ a: 1 }, { b: 2 }, { b: 6 }, { a: 3 }); // { a: 1, b: 2 }

До следующей среды, Абхирадж

Оригинал: “https://dev.to/abhirajb/javascript-snippets-you-need-to-know-right-now-2mo6”

Давайте начнем!

Читайте ещё по теме: