Обращайте внимание на то, что возвращают методы JS!

Обращайте внимание на то, что возвращают методы JS!

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

Что навело меня на эту мысль, так это то, что штатный разработчик клиента сказал, что «невозможно» сделать неизменяемый константный массив или объект. Полная чушь, если вы завернете объявление в Object.freeze с константным присваиванием.

Я был немного шокирован этим парнем, который писал JavaScript пятнадцать лет и никогда даже не слышал об Object.freeze.

JavaScript. Быстрый старт

Изучите основы JavaScript на практическом примере по созданию веб-приложения

Узнать подробнее

Вам нужен массив, значения которого ничто не может изменить, вот и все! То же самое можно сделать, применяя Object.freeze для всего, что вы объявляете. Применяя Object.freeze при объявлении массива или объекта вместе с const, вы получаете неудаляемый результат с неизменной областью действия! Волшебная часть заключается в том, что Object.freeze возвращает объект, который вы ему передаете!

То же самое можно сказать о Node.appendChild и о том, чем он может быть лучше Element.append. Первый возвращает добавленный вами узел, что может быть весьма полезно, поскольку означает, что вам не нужно тратить лишнее объявление/строку при создании нового узла, присоединяемого к чему-либо.

Например, допустим, у вас есть переменная «mySection», указывающая на тег раздела, и вы хотите создать H2 с текстом «My Title» внутри него непосредственно в DOM.

Выглядит прикольно, но поскольку Node.appendChild возвращает только что созданный объект элемента H2, мы можем присвоить заголовок. Если использовать это с чем-то вроде Object.assign, все может быть еще более интересным. Но это не значит, что у Element.append нет своих преимуществ:

Самое забавное заключается во всех сумасшедших расточительных методах, которые React и другие системы, подобные ему, имеют под капотом, чтобы воспроизвести это, потому что они не могут использовать возвращаемые значения многих свойств. Когда я говорю, что подобные фреймворки копируют существующую функциональность, я имею в виду именно именно это! Взгляните на «createElement», который превращает JSX в клиентскую часть, или на различные процедуры «make».

Моя текущая версия намного проще, чем раньше:

JavaScript. Быстрый старт

Изучите основы JavaScript на практическом примере по созданию веб-приложения

Узнать подробнее

Когда я мог бы просто написать:

Все потому, что возвращается Object.assign. Кстати, вы, ребята, думаете, что я суров к фреймворкам, вы должны услышать, как я критикую свою собственную работу. Вы должны регулярно все сносить, иначе никогда не научитесь! В любом случае, не все, что вы делаете, должно включать дополнительные переменные! Я подозреваю, что то, что я всегда писал JavaScript таким образом, является причиной того, почему у меня никогда не было проблем с областью действия, которые сводят с ума многих программистов. Кроме того, я начал напрямую писать DOM вместо того, чтобы копаться в медленном и, возможно, небезопасном innerHTML намного раньше, чем другие разработчики.

На самом деле немного раздражает, что Element.append не возвращает того что мы добавляем. Это было бы (могло бы быть) действительно полезным, если бы возвращался массив элементов. Что-то типа:

Как видите, это было бы немного полезнее, чем версия Element.append.

Заключение

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

Да, и для нытиков, которые твердят что «if и switch — это зло» и жалуются, как много «лишнего» в коде, вы знаете, что разработчики Python смеются над вами, верно?

Автор: Jason Knight

Источник: medium.com

Редакция: Команда webformyself.

Читайте нас в Telegram, VK, Яндекс.Дзен

JavaScript. Быстрый старт

Изучите основы JavaScript на практическом примере по созданию веб-приложения

Узнать подробнее

JavaScript. Быстрый старт

Изучите основы JavaScript на практическом примере по созданию веб-приложения

Смотреть

Метки:

Похожие статьи:

Комментарии Вконтакте:

Комментирование закрыто.