Эта неделя была наполнена «жизнью», которая мешала моему путешествию по программированию. Но это не значит, что я перестал заставлять себя учиться и практиковаться. Это просто означало, что я должен был помнить о своих стратегиях синдрома самозванца и тайм-менеджменте.
Таким образом, этот пост короткий и лаконичный, в нем рассматриваются некоторые концепции, связанные с объектно-ориентированным программированием в JavaScript, и всеми любимый синтаксис «новой стрелки» (также известный как толстые стрелки). Как всегда, включено больше ссылок на сторонние ресурсы, которые углубляются!
Зачем изучать объектно-ориентированное программирование?
На этой неделе был ускоренный курс по объектно-ориентированному программированию. Итак, я работал над созданием классов в JavaScript, которые отличаются от классов HTML. Но идея наследования, которую мы используем при стилизации HTML-классов в CSS, аналогична. Классы в JavaScript следуют той же структуре генеалогического дерева, что и в HTML. Классы JavaScript помогают нам создавать объекты, упорядочивать их и писать более эффективный код, особенно когда мы пытаемся высушить его!
Как только объектно-ориентированное программирование, замыкания и реструктуризация станут более второстепенными, я буду чувствовать себя намного увереннее при изучении React, но до этого еще далеко. Сначала нужно изучить больше JavaScript!
Случай использования новой стрелки =› синтаксиса функции
Синтаксис новой стрелки (иногда называемой толстой стрелкой) полезен, поскольку позволяет нам писать более короткие функции.
ДО: hello = function(){ return «Привет, друзья!»};
ПОСЛЕ: привет = () =› {return «привет, друзья!»};
Но что еще более примечательно, новый синтаксис стрелочной функции работает с «этим» по-другому. Со стрелочными функциями нет привязки «это».
В обычных функциях ключевое слово this представляет объект, вызывающий функцию (например, документ, кнопку и т. д.). Но при использовании стрелочных функций ключевое слово this всегда представляет объект, определяющий стрелочную функцию.
Приведенное выше объяснение основано на Школах W3.
Классический вопрос на собеседовании: объясните разницу в использовании foo между function foo() {} и const foo = function() {}
А) Функция foo(){}
Б) Константа foo = функция (){}
A: оператор функции поднимается наверх.
B: с помощью const мы можем объявить переменную (foo), а const дает ей блочную область видимости, которая останавливает полный подъем наверх и гарантирует, что ее нельзя будет повторно объявить.
Какие преимущества дает использование синтаксиса стрелки для метода в конструкторе?
Для объектно-ориентированного программирования синтаксис стрелки имеет решающее значение. При использовании стрелочных функций новая функция не определяет свое собственное значение «это». Используя стрелочные функции, «это» привязывается к вновь созданному объекту и, следовательно, приводит к более чистому коду и большей ремонтопригодности в объектно-ориентированном программировании.
Что такое деструктурирование объекта или массива?
Деструктуризация в JavaScript позволяет нам извлекать данные из массивов, объектов, карт и наборов в их собственные переменные. Это позволяет нам извлекать свойства из объекта или элементов из массива (или нескольких одновременно). Вместо создания нескольких переменных мы деструктурируем их в одну строку кода.
Пример:
Const user = {первый: «Рэйчел», последний: «Смит», округ: «Трэвис», город: «Остин»};
Const {первый, последний} = пользователь;
Документация и примеры: https://wesbos.com/destructuring-objects
Что такое закрытие и как мы можем его использовать?
Замыкание дает доступ к области видимости внешней функции из внутренней функции. В JavaScript замыкания создаются каждый раз, когда создается функция, во время создания функции. Это означает, что когда мы проводим модульное тестирование в node.js, то, если мы правильно пишем тесты, замыкания могут помочь. Потому что, по сути, замыкание — это назначенная функция (или, в случае модульного тестирования, возвращаемая как значение) и связанная с ней область.
Полезные ресурсы по закрытию в JavaScript:
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Closures
Я надеюсь, что это поможет всем, кто работает над изучением основ объектно-ориентированного программирования или готовится к этим страшным вопросам на собеседовании!
Ваш друг в коде,
Рэйчел