Во время написания кода вы заметите, что есть вещи, на которые вы натыкаетесь снова и снова, и обычно они выпрашивают это быстрое решение. Для решения многих из этих задач вам даже не нужно устанавливать библиотеку. Это мои лучшие 25, собранные за эти годы.
1. Введите утилиту проверки
JavaScript — это не строго типизированный язык, и лучшим решением для этого является TypeScript, который я рекомендую, но иногда все, что вам нужно — это простая проверка типов, которую JavaScript позволяет вам выполнять с помощью typeof. >» ключевое слово.
Проблема с typeof заключается в том, что если вы используете это для некоторых примитивов и функций, оно отлично работает, но для массива и объектов становится трудно понять разницу, поскольку они оба считаются объектами. ”
Код проверки типов Javascript на Github
2. Проверить на пустое
Иногда вам просто нужно знать, пусто ли что-то, и в зависимости от того, что вы проверяете, вам нужно использовать «разные методы, такие как проверка длины, размера или наличие дочерних элементов. Эта утилита объединяет все это, позволяя вам проверять размер строки, объекта, массива, карты и набора.
3. Получить любой последний элемент списка
Другие языки делают это методом или функцией, которую вы можете вызывать для массива, но для JavaScript вам нужно проделать некоторую работу.
Код получения последнего элемента на Github
4. Генератор случайных чисел с диапазоном
Если иногда вам нужно сгенерировать случайные числа, но вы хотите, чтобы эти числа были в диапазоне, вам нужна эта маленькая утилита.
Код случайного числа на GitHub
5. Генератор случайных идентификаторов
Просто нужен какой-нибудь id? Для этого не нужно устанавливать новую библиотеку, если только вам не нужны более сложные генераторы идентификаторов, такие как UUID. Проверьте эти параметры, которых может быть достаточно, чтобы начать работу. Вы можете начать с текущего времени в миллисекундах или определенного целого числа и приращения, или вы можете сгенерировать идентификатор из буквенно-цифровых символов.
Код генераторов уникальных идентификаторов на Github
6. Создайте диапазон чисел
Одна вещь, которую я люблю в Python, — это функция диапазон, и мне часто нужно кодировать ее на JavaScript. Вот его простая реализация, которая идеально подходит для цикла for…of и всякий раз, когда вам нужны числа в определенном диапазоне.
Код генератора номеров диапазонов на Github
7. Отформатируйте строку JSON и преобразуйте в строку что угодно
Я обнаружил, что сам часто использую это, когда работаю над чем-то с NodeJs для вывода объектов на консоль. JSON.stringify принимает третий параметр, который должен быть количеством пробелов для отступа строки. Второй параметр может быть нулевым, но вы можете использовать его для обработки таких вещей, как функция, Set, Map и Symbol которые метод JSON.stringify не обрабатывает или просто игнорирует.
Javascript Any Object Stringifier Code на Github
8. Выполняйте обещания последовательно
Если у вас есть куча асинхронных или обычных функций, которые возвращают обещание, которое нужно выполнить одно после другого, эта утилита может очень помочь. Он берет список функций или промисов и последовательно разрешает их, используя метод массива reduce.
Код асинхронного секвенсора на GitHub
9. Данные опроса
Если вам когда-либо понадобится проверять наличие обновлений данных, но в вашей системе нет WebSocket, эта утилита позволит вам это сделать. Это отлично подходит для случаев, когда вы загружаете файл и хотите продолжать проверять, завершена ли обработка файла, или вы работаете со сторонним API, таким как dropbox или uber, и хотите продолжать проверять, завершен ли процесс или поездка достигла места назначения.
10. Дождитесь завершения всех обещаний
Это не совсем кодовое решение, но полезно знать о Promise API. Он постоянно развивается, и раньше у меня было кодовое решение для доступных сейчас методов allSettled, race и any», но я рад просто рассказать вам о них, а не делиться реализацией кода. их.
11. Поменять местами значения массива
ES6 упростил замену значений местами в массиве. Не то чтобы это было сложно сделать, но об этом полезно знать.
12. Клавиша условного объекта
Этот трюк — мой любимый, и я часто использую его при работе с состояниями обновления React. Он просто позволяет условно вставить ключ в распространяемый объект, заключая условие в круглые скобки.
13. Используйте переменные в качестве ключа объекта
Еще один удобный способ — для случаев, когда у вас есть строковая переменная и вы хотите использовать ее в качестве ключа в объекте для установки значения.
14. Проверка наличия ключа в объекте
Это может быть проблематично, но это хороший трюк, который поможет вам проверить ключи объекта.
15. Удалить дубликаты массива
Обычно в массиве есть дублирующиеся значения, от которых можно избавиться с помощью структуры данных Set. Он отлично работает со многими типами данных, и у set есть другой способ проверки равенства, который очень помогает. В случаях, когда у вас могут быть разные экземпляры или объекты, вы все равно можете использовать Set, чтобы отслеживать конкретную вещь и отфильтровывать повторяющиеся объекты.
16. Делайте перерыв и продолжение в Array forEach
Мне очень нравится использовать метод массива .forEach», но иногда мне нужно выйти раньше или перейти к следующему циклу, и я не хочу использовать цикл for… для этого. Вы можете воспроизвести поведение оператора continue с ранним возвратом, но если вы хотите воспроизвести поведение break, вам нужно вместо этого использовать метод массива «.some».
17. Деструктуризация с псевдонимом и значениями по умолчанию
Деструктуризация — одна из лучших функций JavaScript, и классная вещь в том, что вы можете установить псевдоним, используя двоеточие, и значения по умолчанию, используя знак равно для свойств.
18. Необязательная цепочка и нулевое объединение
Несколько удивительных и очень ожидаемых функций JavaScript, которые вы должны начать использовать прямо сейчас, чтобы решить часто используемые хаки, когда речь идет о глубокой проверке свойств объекта и работе с нулевыми и неопределенными значениями.
19. Расширить класс функциями
Я всегда говорю людям, что JavaScript-классы — это всего лишь функции-конструкторы и прототипы под капотом. Это не настоящая концепция, как в Java. Один из способов доказать это — просто использовать функцию-конструктор для расширения класса. Он удобен для частных вещей, которые в классе выглядят странно из-за всего этого # и компилируются в меньше кода при использовании с babel или WebPack.
20. Расширьте функции конструктора
Дело в том, что вы можете расширить только один другой класс. С помощью функции-конструктора вы можете составить функцию, используя несколько других функций-конструкторов, что иногда делает ее более гибкой для работы. Это можно сделать с помощью метода .apply или метода .call прототипа функции. Вы даже можете расширять только части функции, пока она является объектом.
21. Зацикливайте что угодно
Иногда вы просто хотите зациклить что-нибудь, Set, Map, Object, Array, String и т. д., если это можно повторять. Эта очень простая служебная функция forEach позволяет сделать именно это. Если обратный вызов возвращает true, он просто выйдет из цикла.
Код ForEach Iterables на Github
22. Сделать аргумент функции обязательным
Это отличный способ убедиться, что функция вызывается с тем, что ей нужно для работы. Вы можете использовать функцию значения аргумента по умолчанию для вызова функции, которая просто выдает ошибку. Если вы вызовете функцию с тем, что ей нужно, значение заменит эту функцию, и ничего не произойдет. Вызов с undefined также имеет тот же эффект.
требуемый код аргумента на Github
23. Создавайте модули или синглтоны
Часто бывает, что вам нужно инициализировать что-то при загрузке, настроить все, что нужно, а затем использовать это везде в приложении, даже не нужно ничего с этим делать. Вы можете использовать силу функции IIFE, чтобы сделать именно это, и это изменит вашу жизнь. Это шаблон модуля, очень полезный для изоляции вещей и предоставления только того, с чем вам нужно будет взаимодействовать.
24. Объект глубокого клонирования
Вот что разработчики часто устанавливают некоторые библиотеки, такие как lodash, чтобы иметь возможность сделать это, но на самом деле это легко сделать в простом JavaScript. Это простая рекурсивная функция, которая, пока это объект, повторно инициализирует его как клон, используя его конструктор, а затем повторяет процесс для всех свойств.
Код глубокого клонирования на Github
25. Объект глубокой заморозки
Если вам нравится неизменяемость, это обязательная утилита, но неизменяемость — это большая тема, поэтому обязательно следите за Перед точкой с запятой здесь, на Среднем и на Youtube, чтобы мы могли решить эти проблемы.
