Вам просто нужно немного более внимательно взглянуть на цифры, чтобы понять, насколько велик JavaScript. Может быть, вам даже не нужно баловаться с цифрами, потому что вы уже знаете.

Неважно, как вы на это смотрите, язык никуда не делся, так как это язык программирования для большинства разработчиков (согласно RedMonk), и, по оценкам, около 12,4 миллиона разработчиков используют его по всему миру. вместе с CoffeScript и TypeScript.

Это означает, что миллионы экспертов полагаются на JavaScript в качестве своей основной «рабочей лошадки», охватывая сообщество фрилансеров и являясь опорой большинства агентств по разработке и цифровым технологиям.

Таким образом, информации о языке в Интернете также слишком много, и те, кто не знаком с JS, могут найти выдающиеся ресурсы для изучения всех тонкостей языка. Кроме того, эти источники могут быть полезны и тем, кто лучше владеет языком.

При этом даже для продвинутых JS-разработчиков всегда есть место для совершенствования. И чтобы помочь вам узнать что-то новое, вот десять отличных лайфхаков, которые вы должны интегрировать в свой повседневный рабочий процесс, если хотите оптимизировать свой JS-код. С их помощью вы сможете писать более чистый код, оптимизировать время разработки и экономить ресурсы в процессе.

Использование ярлыков для условий

Вы, наверное, знаете, что JS позволяет вам использовать определенные ярлыки, чтобы очистить ваш код и сделать его более легким для глаз. Иногда вы можете использовать && и || вместо if и else.

При этом давайте посмотрим на пример первого оператора:

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

Преобразование в наибольшее целое с помощью оператора ~~

Если вы используете Math.floor, чтобы вернуться к наибольшему целому числу, которое равно или меньше заданного числа в вашем уравнении, занимает большую часть ваших ресурсов, вы можете выбрать более эффективный способ с ~~ оператор. Это также сократит строку.

Посмотрите этот пример:

Использование array.length для очистки или изменения размера массива

Часто вы оказываетесь в ситуации, когда вам нужно либо очистить массив, либо изменить его размер. Вы можете сделать это, используя Array.length.

Вот пример:

При этом вы также можете выбрать аналогичный маршрут, если хотите удалить все значения определенного массива:

Управление массивами без перегрузки сервера

Во время слияния массивов разработчики обычно сильно нагружают серверы, особенно в случаях, когда наборы данных довольно велики. К счастью, вы можете использовать этот хак, чтобы упростить задачу и поддерживать уровень производительности на оптимальном уровне. Просто используйте функции Array.concat() и Array.push.apply(arr1, arr2) в зависимости от размера ваших массивов.

Для более мелких используйте:

Для больших наборов данных вы не должны использовать упомянутый выше хак, так как он будет потреблять много вашей памяти и неизбежно приведет к падению производительности.

Итак, чтобы обойти это, просто интегрируйте второй хак, который мы выделили выше:

Использование фильтров с массивами

Массивы фильтрации могут пригодиться, когда вам нужно работать с несколькими соответствующими столбцами данных. В этих случаях вы можете просто исключить или включить данные по любой характеристике, описывающей конкретную группу в вашем массиве.

Итак, для фильтрации массивов просто используйте функцию filter():

У вас также есть возможность использовать filter() и Boolean вместе, чтобы удалить все нулевые или неопределенные значения из ваших массивов.

Вот пример:

Извлечение уникальных значений

В случаях, когда у вас есть наборы данных с повторяющимися значениями и вам нужно создать уникальные значения одного и того же набора, вы можете выбрать для этого синтаксис распространения… и тип объекта Set. Комбо. Используйте этот подход как для слов, так и для чисел.

Использование ярлыка функции замены

Как вы, возможно, знаете, функция String.replace() заменяет строку только заранее заданной строкой. Если у вас большой набор данных и вам нужно использовать эту функцию несколько раз, все может довольно быстро разочароваться.

Чтобы упростить и упростить задачу, добавив /g в конце регулярного выражения, функция будет продолжать работать и заменять все совпадающие условия без остановки.

Вот пример из той же базы кода, что и выше:

Кэширование значений

Когда вам приходится иметь дело с большими массивами и вы постоянно запрашиваете элементы по идентификатору с именем класса или по имени (getElementById(), getElementsByClassName()), то JS обычно проходит через массив в цикле с каждым запросом. Это займет много ресурсов, но вы можете повысить производительность, если кэшируете значения, если знаете, какие указанные выборки вы используете регулярно.

Проверка объектов на значения

Когда вам приходится иметь дело с несколькими объектами, могут возникнуть трудности, если вы пытаетесь отслеживать объекты, которые имеют фактические значения, и другие, которые вы действительно можете удалить.

Вот удобный прием, который поможет вам проверить, имеют ли ваши объекты значение или они пусты (функция Object.keys()).

Object.keys(objectName).length // если он возвращает 0, то объект пуст, иначе он отображает количество значений

Минификация файлов JS

Скорость — это название игры в мире веб-разработки, и большие файлы JavaScript могут негативно повлиять на реакцию вашей страницы и скорость загрузки. Когда вы пишете свой код, вы всегда должны искать способы исключить ненужные строки, мертвый код и ненужные комментарии. С файлами меньшего размера это не такая уж большая проблема, но когда они накапливаются, эти проблемы могут стать довольно неприятными.

Итак, чтобы очистить свой код и уменьшить размер файлов, вы можете использовать несколько полезных инструментов, таких как Google Closure Compiler или Microsoft Ajax Minifier, чтобы оптимизировать свой код и повысить общую производительность вашего веб-приложения за счет уменьшения размера вашего файла. файлы и устранение мертвого кода.

Честно говоря, это не совсем хаки в буквальном смысле, они по-прежнему являются отличными инструментами, которые можно использовать, если вы хотите получить максимальную отдачу от JS.

Это все люди!

Итак, это наши 10 лучших лайфхаков для оптимизации вашего JS-кода и быстрого улучшения навыков программирования! Надеемся, что эти небольшие приемы помогут вам стать лучшим экспертом и очень помогут вам в оптимизации вашего рабочего процесса.

Первоначально опубликовано на https://www.popwebdesign.net 3 февраля 2021 г.