isItLetter
Создайте функцию, которая проверяет, является ли переданный символ буквой.
Примеры:
isItLetter('a') => true, `'a' is a letter`
isItLetter('1') => false, `'1' is not a letter`
👉
@frontend_mind
Создайте функцию, которая проверяет, является ли переданный символ буквой.
Примеры:
isItLetter('a') => true, `'a' is a letter`
isItLetter('1') => false, `'1' is not a letter`
👉
@frontend_mind
Какая разница между композицией и наследованием?
Наследование представляет собой механизм, при котором один класс (подкласс или производный класс) наследует свойства и методы от другого класса (суперкласса или базового класса). Подкласс может расширить или изменить функциональность суперкласса. Это позволяет создавать иерархию классов, где подклассы наследуют общие атрибуты и методы от своих суперклассов.
Композиция представляет собой механизм, при котором объект содержит ссылки на другие объекты, называемые компонентами. Вместо того, чтобы наследовать функциональность, объекты используют функциональность компонентов, которые могут быть созданы независимо друг от друга. Это позволяет создавать объекты, состоящие из множества независимых компонентов, и изменять их поведение, комбинируя различные компоненты.
В идеале, выбор между композицией и наследованием зависит от конкретных требований вашей системы и ее дизайна. Оба подхода имеют свои преимущества и недостатки, и иногда их можно комбинировать для достижения лучших результатов.
👉
@frontend_mind
Наследование представляет собой механизм, при котором один класс (подкласс или производный класс) наследует свойства и методы от другого класса (суперкласса или базового класса). Подкласс может расширить или изменить функциональность суперкласса. Это позволяет создавать иерархию классов, где подклассы наследуют общие атрибуты и методы от своих суперклассов.
Композиция представляет собой механизм, при котором объект содержит ссылки на другие объекты, называемые компонентами. Вместо того, чтобы наследовать функциональность, объекты используют функциональность компонентов, которые могут быть созданы независимо друг от друга. Это позволяет создавать объекты, состоящие из множества независимых компонентов, и изменять их поведение, комбинируя различные компоненты.
В идеале, выбор между композицией и наследованием зависит от конкретных требований вашей системы и ее дизайна. Оба подхода имеют свои преимущества и недостатки, и иногда их можно комбинировать для достижения лучших результатов.
👉
@frontend_mind
Назовите способ изменения opacity для всех строк таблицы кроме той, на которую навёл пользователь.
Anonymous Poll
63%
tbody:hover tr:not(:hover)
13%
tbody:hover:not(:hover)
6%
tbody:not(:hover):hover
19%
tr:not(:hover) tbody:hover
Создание массива из большого количества повторяющихся элементов
Есть несколько разных способов для создания массива с котиками.
Допустим, нам нужно завести котиков в 100 комнат, по одному на комнату, как это сделать? Можно выделить место (память) для котиков, а потом заселить туда котиков:
Array(100).fill("😸") // Чуть более функциональный стиль
Также мы можем выделить 100 комнат, а потом пройти в каждую и руками туда посадить кота. Массив можно создать с помощью деструктуризации [...].
[...Array(100)].map(() => "😸")
Также можно создать массив с помощью функции Array.from, указав способ обработки каждого элемента.
Array.from(Array(100), () => "😸")
В Array.from также можно передать array-like структуру данных, для этого нам нужно передать поле length.
Array.from({ length: 100}, () => '😸')
Можно создать пустой массив, создать цикл и поселить в каждую комнату по её индексу по коту.
const arr = []
for(let i=0; i
@frontend_mind
Есть несколько разных способов для создания массива с котиками.
Допустим, нам нужно завести котиков в 100 комнат, по одному на комнату, как это сделать? Можно выделить место (память) для котиков, а потом заселить туда котиков:
Array(100).fill("😸") // Чуть более функциональный стиль
Также мы можем выделить 100 комнат, а потом пройти в каждую и руками туда посадить кота. Массив можно создать с помощью деструктуризации [...].
[...Array(100)].map(() => "😸")
Также можно создать массив с помощью функции Array.from, указав способ обработки каждого элемента.
Array.from(Array(100), () => "😸")
В Array.from также можно передать array-like структуру данных, для этого нам нужно передать поле length.
Array.from({ length: 100}, () => '😸')
Можно создать пустой массив, создать цикл и поселить в каждую комнату по её индексу по коту.
const arr = []
for(let i=0; i
@frontend_mind
К вопросу о кошмарном качестве книг по программированию. Моя не наглядная книга о наглядном CSS
Сколько раз уже писано‑переписано о том, что современные печатные книги на компьютерную тематику — это на редкость некачественный товар. И всё равно каждый раз я не перестаю удивляться, как же их создатели не стыдятся выпускать, да ещё и продавать за деньги такой редкостный треш.
И дело даже не в кривом переводе. Мы уже давно научились догадываться, что именно «хотел сказать автор» на языке оригинала. Этот этап повсеместного падения качества книг уже пройден. Теперь издательства нацелились на новые антирекорды — соревнуются, кто кого переплюнет по количеству фактических ошибок в своих творениях. Например, по ужасающим косякам в исходных кодах программ. Каждый раз хочется воскликнуть: «Ребята, вы сами‑то хоть один раз перечитали своё творение?!»
👉
@frontend_mind
Сколько раз уже писано‑переписано о том, что современные печатные книги на компьютерную тематику — это на редкость некачественный товар. И всё равно каждый раз я не перестаю удивляться, как же их создатели не стыдятся выпускать, да ещё и продавать за деньги такой редкостный треш.
И дело даже не в кривом переводе. Мы уже давно научились догадываться, что именно «хотел сказать автор» на языке оригинала. Этот этап повсеместного падения качества книг уже пройден. Теперь издательства нацелились на новые антирекорды — соревнуются, кто кого переплюнет по количеству фактических ошибок в своих творениях. Например, по ужасающим косякам в исходных кодах программ. Каждый раз хочется воскликнуть: «Ребята, вы сами‑то хоть один раз перечитали своё творение?!»
👉
@frontend_mind
Какая область видимости у переменных, объявленных с var внутри функции?
Anonymous Poll
39%
Глобальная
8%
Блочная
49%
Функциональная
6%
Модульная
Чем отличаются REST и RESTful API?
REST (Representational State Transfer) — это архитектурный стиль, используемый при проектировании распределенных систем. Он был описан в диссертации Роя Филдинга в 2000 году и является основой для создания RESTful API.
RESTful API — это веб-сервис, который использует протокол HTTP для обмена данными. Он предоставляет возможность получать, создавать, обновлять и удалять данные на удаленном сервере, используя стандартные HTTP-методы (GET, POST, PUT, DELETE и т. д.).
RESTful API использует ресурсы (например, товары, пользователи, заказы) и URI (Uniform Resource Identifier) для доступа к этим ресурсам. Клиент отправляет запросы на сервер, указывая URI и метод HTTP, а сервер возвращает ответ, который может содержать данные в различных форматах (например, JSON или XML).
Принципы RESTful API:
- Клиент-серверная архитектура: сервер и клиент независимы друг от друга, что позволяет развивать их независимо.
- Отсутствие состояния (stateless): каждый запрос клиента должен содержать всю необходимую информацию для его обработки, без сохранения состояния на сервере.
- Кэширование: клиенты могут кэшировать ответы сервера, чтобы уменьшить количество запросов.
- Единообразие интерфейса: единообразный интерфейс между клиентом и сервером упрощает взаимодействие и увеличивает его надежность.
- Слои: клиент не должен знать о слоях на сервере, которые обрабатывают запросы.
👉
@frontend_mind
REST (Representational State Transfer) — это архитектурный стиль, используемый при проектировании распределенных систем. Он был описан в диссертации Роя Филдинга в 2000 году и является основой для создания RESTful API.
RESTful API — это веб-сервис, который использует протокол HTTP для обмена данными. Он предоставляет возможность получать, создавать, обновлять и удалять данные на удаленном сервере, используя стандартные HTTP-методы (GET, POST, PUT, DELETE и т. д.).
RESTful API использует ресурсы (например, товары, пользователи, заказы) и URI (Uniform Resource Identifier) для доступа к этим ресурсам. Клиент отправляет запросы на сервер, указывая URI и метод HTTP, а сервер возвращает ответ, который может содержать данные в различных форматах (например, JSON или XML).
Принципы RESTful API:
- Клиент-серверная архитектура: сервер и клиент независимы друг от друга, что позволяет развивать их независимо.
- Отсутствие состояния (stateless): каждый запрос клиента должен содержать всю необходимую информацию для его обработки, без сохранения состояния на сервере.
- Кэширование: клиенты могут кэшировать ответы сервера, чтобы уменьшить количество запросов.
- Единообразие интерфейса: единообразный интерфейс между клиентом и сервером упрощает взаимодействие и увеличивает его надежность.
- Слои: клиент не должен знать о слоях на сервере, которые обрабатывают запросы.
👉
@frontend_mind
🥱2❤1
Современный JavaScript для нетерпеливых
Язык JavaScript изначально был предназначен для написания небольших объемов кода внутри браузера, но современный JavaScript радикально отличается от своего прародителя. В наши дни программисты на JavaScript активно осваивают функциональный, объектно-ориентированный и асинхронный стили программирования, оставляя в прошлом архаичные конструкции, чреватые ошибками. Данная книга – полное, но при этом лаконичное руководство по версии JavaScript E6 и выше. Вам не потребуется знаний старых версий языка, а сразу предлагается начать с более мощных современных.
👉
@frontend_mind
Язык JavaScript изначально был предназначен для написания небольших объемов кода внутри браузера, но современный JavaScript радикально отличается от своего прародителя. В наши дни программисты на JavaScript активно осваивают функциональный, объектно-ориентированный и асинхронный стили программирования, оставляя в прошлом архаичные конструкции, чреватые ошибками. Данная книга – полное, но при этом лаконичное руководство по версии JavaScript E6 и выше. Вам не потребуется знаний старых версий языка, а сразу предлагается начать с более мощных современных.
👉
@frontend_mind
isItLetter
Создайте функцию, которая проверяет, является ли переданный символ буквой.
Примеры:
isItLetter('a') => true, `'a' is a letter`
isItLetter('1') => false, `'1' is not a letter`
👉
@frontend_mind
Создайте функцию, которая проверяет, является ли переданный символ буквой.
Примеры:
isItLetter('a') => true, `'a' is a letter`
isItLetter('1') => false, `'1' is not a letter`
👉
@frontend_mind
Какие принципы и подходы используются при работе с CSS, чтобы обеспечить масштабируемость и поддерживаемость кода?
1. БЭМ (Блок-Элемент-Модификатор) методология: это позволяет разбить интерфейс на независимые блоки, которые можно переиспользовать в разных частях сайта. Это упрощает поддержку и масштабирование кода.
2. Использование препроцессоров CSS (например, Sass или Less): это позволяет писать более читаемый и удобный для поддержки CSS код. С помощью препроцессоров можно использовать переменные, миксины, наследование и другие функции, которые помогают уменьшить дублирование кода и упростить его поддержку.
3. Использование модульной архитектуры: это позволяет разбить CSS код на модули, которые можно переиспользовать в разных частях сайта. Модульная архитектура помогает уменьшить дублирование кода и упрощает поддержку.
4. Использование семантических классов: это позволяет создавать более читаемый и понятный для других разработчиков CSS код. Использование семантических классов упрощает поддержку и масштабирование кода.
👉
@frontend_mind
1. БЭМ (Блок-Элемент-Модификатор) методология: это позволяет разбить интерфейс на независимые блоки, которые можно переиспользовать в разных частях сайта. Это упрощает поддержку и масштабирование кода.
2. Использование препроцессоров CSS (например, Sass или Less): это позволяет писать более читаемый и удобный для поддержки CSS код. С помощью препроцессоров можно использовать переменные, миксины, наследование и другие функции, которые помогают уменьшить дублирование кода и упростить его поддержку.
3. Использование модульной архитектуры: это позволяет разбить CSS код на модули, которые можно переиспользовать в разных частях сайта. Модульная архитектура помогает уменьшить дублирование кода и упрощает поддержку.
4. Использование семантических классов: это позволяет создавать более читаемый и понятный для других разработчиков CSS код. Использование семантических классов упрощает поддержку и масштабирование кода.
👉
@frontend_mind
Какие свойства CSS можно использовать для создания анимаций и плавных переходов?
Некоторые из наиболее распространенных свойств:
1. transition - позволяет задать плавный переход между двумя состояниями элемента, например, изменение цвета фона при наведении мыши.
2. animation - позволяет создавать сложные анимации с помощью ключевых кадров (keyframes), которые задают различные состояния элемента на разных этапах анимации.
3. transform - позволяет изменять форму, размер и положение элемента, включая повороты, масштабирование, смещение и т.д.
4. filter - позволяет применять различные эффекты к элементам, такие как размытие, насыщенность, яркость и т.д.
5. opacity - позволяет изменять прозрачность элемента.
6. scroll-snap - позволяет создавать плавный скроллинг между различными элементами на странице.
👉
@frontend_mind
Некоторые из наиболее распространенных свойств:
1. transition - позволяет задать плавный переход между двумя состояниями элемента, например, изменение цвета фона при наведении мыши.
2. animation - позволяет создавать сложные анимации с помощью ключевых кадров (keyframes), которые задают различные состояния элемента на разных этапах анимации.
3. transform - позволяет изменять форму, размер и положение элемента, включая повороты, масштабирование, смещение и т.д.
4. filter - позволяет применять различные эффекты к элементам, такие как размытие, насыщенность, яркость и т.д.
5. opacity - позволяет изменять прозрачность элемента.
6. scroll-snap - позволяет создавать плавный скроллинг между различными элементами на странице.
👉
@frontend_mind
Используйте простейшие рабочие решения
Занимаясь проектированием систем ПО, идите самым простым путём из возможных.
Причём эту рекомендацию можно применять на удивление широко. Я искренне верю, что так можно делать всегда. Эта техника подходит для исправления багов, обслуживания имеющихся систем и проектирования новых.
Многие инженеры, продумывая дизайн системы, представляют себе некий её «идеал»: что-то стройное, практически бесконечно масштабируемое, удобно распространяемое и так далее. Я же считаю, что это абсолютно ошибочный подход к проектированию ПО. Напротив, нужно вложить всё это время в глубокий анализ имеющейся системы, а затем реализовать простейшее рабочее решение.
👉
@frontend_mind
Занимаясь проектированием систем ПО, идите самым простым путём из возможных.
Причём эту рекомендацию можно применять на удивление широко. Я искренне верю, что так можно делать всегда. Эта техника подходит для исправления багов, обслуживания имеющихся систем и проектирования новых.
Многие инженеры, продумывая дизайн системы, представляют себе некий её «идеал»: что-то стройное, практически бесконечно масштабируемое, удобно распространяемое и так далее. Я же считаю, что это абсолютно ошибочный подход к проектированию ПО. Напротив, нужно вложить всё это время в глубокий анализ имеющейся системы, а затем реализовать простейшее рабочее решение.
👉
@frontend_mind
Что позволяет делать свойство innerHTML в JavaScript?
Anonymous Poll
7%
Выполнять JavaScript-код внутри элемента напрямую
91%
Вставлять HTML-код внутрь элемента как строку
7%
Удалять все дочерние элементы без замены
3%
Изменять стили элемента без перезагрузки страницы