За фронтенд - JavaScript, HTML, CSS. Страница 4

​​5 способов, которыми senior разработчики разрушают карьеру junior разработчиков Многие старшие разработчики ведут себя так, что это может сильно разочаровать, особенно программистов, которые только начинают свою карьеру. Иногда такое поведение может быть непреднамеренным. Старшие могут не знать, как их безответственные действия негативно сказываются на младших разработчиках. Вот пять способов, которыми старшие разработчики влияют на моральный дух младших разработчиков и замедляют их карьерный рост. Каждый инженер-программист должен знать об этих действиях, чтобы не совершать подобных ошибок со своими джуниорами. #карьера

​​5 советов, как овладеть искусством чистого кода Хорошие программисты пишут скучный код. Великие программисты пишут очень скучный код Что такое чистый код? Проще говоря , чистый код относится к кодовой базе, которую легко читать и понимать. Некоторые характерные особенности Clean Code : - Снижает когнитивную нагрузку читателя - Содержит интуитивно - Понятные переменные и функции - Следует лучшим практикам кодирования #полезно

🙌🏻@za_frontend

Использовать строку шаблона Конкатенация строк выполняется легко и просто, но иногда это может привести к проблемам и ошибкам. let name = 'John';let position = 'Tech Lead'; let isTechLead = bit => bit === 'T' ? 'Tech Lead' : 'Developer'; let messageConcat = 'Mr. ' + name + ' is a ' + isTechLead('T'); console.log(messageConcat); // Mr. Jogn is a Tech Lead Литералы шаблонов позволяют встраивать выражения. Чтобы использовать этот метод, вам нужно знать уникальный синтаксис, в котором строка должна быть заключена в обратную кавычку (``). Строка шаблона может содержать заполнители для динамических значений. Они отмечены знаком доллара и фигурными скобками — ${}. let name = 'John';let position = 'Tech Lead'; let isTechLead = bit => bit === 'T' ? 'Tech Lead' : 'Developer'; let messageTemplateStr = `Mr. ${name} is a ${isTechLead('T')}`; console.log(messageTemplateStr); // Mr. Jogn is a Tech Lead P.S - Сохрани, чтобы не потерять. Не забудь поделиться 💻 #ПолезныйJS

Проверьте, действительна ли дата Используйте следующий фрагмент, чтобы проверить, является ли данная дата действительной или нет. const isDateValid = (...val) => !Number.isNaN(новая дата(...val).valueOf()); isDateValid("17 декабря 1995 г., 03:24:00"); // Результат: правда P.S - Сохрани, чтобы не потерять. Не забудь поделиться 💻 #ПолезныйJS

Алгоритм сортировки: Что такое сортировка? - Это алгоритм, который упорядочивает элементы в списке. Важные алгоритмы сортировки: Пузырьковая сортировка. Пузырьковая сортировка — это самый простой алгоритм сортировки, который работает путем многократной замены соседних элементов, если они не в порядке. Сортировка слиянием: Сортировка слиянием — это метод сортировки, использующий стратегию « разделяй и властвуй ». Быстрая сортировка:Quicksort — это популярный алгоритм сортировки, который в среднем выполняет n log n сравнений при сортировке массива из n элементов. Это более эффективный и быстрый алгоритм сортировки. Сортировка кучей. Сортировка кучей работает путем визуализации элементов массива как особого типа полного двоичного дерева, известного как куча. P.S - Сохрани, чтобы не потерять. Не забудь поделиться 💻 #Алгоритмы

​​Прекратите использовать условные операторы везде в JavaScript, вместо этого используйте литерал объекта Условные операторы (If-Else, Switch) можно легко заменить объектными литералами. Они делают код лучше. Объектный литерал — один из самых популярных и широко используемых шаблонов для определения объектов в JavaScript.  Это набор пар ключ-значение. JavaScript, будучи мощным, добавляет некоторые дополнительные функции к простым объектам через литералы объектов. const obj = {    first_name: 'Java',    last_name: 'Script'  } // Пример объектного литерала Как мы можем использовать объектный литерал в качестве замены условным операторам? Давайте рассмотрим пример сценария, чтобы понять это. Пользователь вводит животное, нам нужно вернуть имя его детеныша (как называется). Посмотрите на следующий код: if(animal.toLowerCase()==='cat'){   return 'Kitten' } else if(animal.toLowerCase()=='cattle'){    return 'Calf' } else if(animal.toLowerCase()==='cheetah'){    return 'Cub'; } else if(animal.toLowerCase()==='dog'){    return 'Pup'; } else{   return "я не знаю это" } switch(animal.toLowerCase()){   case 'cat': return 'Kitten'   case 'cattle': return 'Calf'   case 'cheetah': return 'Cub'   case 'dog': return 'Pup'   default: return "я не знаю это" } Как мы видим, приведенные выше коды имеют много строк. Независимо от того, напишем ли мы его с помощью if-else или регистра switch, хотя регистр case уменьшает избыточность 'animal.toLowerCase()'. const babyAnimal = {   cat:'Kitten',   cattle:'Calf',   cheetah:'Cub',   dog:'Pup' } return babyAnimal[animal.toLowerCase()] ?? "я не знаю это" Я думаю, что очень приятно использовать это везде, где это возможно. Есть мысли по этому поводу? #js

🙌🏻@za_frontend

Сделать строку заглавной Javascript не имеет встроенной функции капитализации, поэтому для этой цели мы можем использовать следующий код. const capitalize = str => str.charAt(0).toUpperCase() + str.slice(1) capitalize("подпишитесь, чтобы узнать больше") // Результат: Подпишитесь, чтобы узнать больше P.S - Сохрани, чтобы не потерять. Не забудь поделиться 💻 #ПолезныйJS

🙌🏻@za_frontend

Алгоритм поиска: Что такое поиск? - Это алгоритм, который находит элемент в наборе данных. Важные алгоритмы поиска- -Двоичный поиск: Двоичный поиск использует стратегию « разделяй и властвуй », в которой отсортированный список делится на две половины, а элемент сравнивается со средним элементом списка. Если совпадение найдено, возвращается местоположение среднего элемента. -Поиск в ширину (BFS): поиск в ширину — это алгоритм обхода графа, который начинается с корневого узла и исследует все соседние узлы. -Поиск в глубину (DFS): Алгоритм поиска в глубину (DFS) начинается с первого узла графа и продолжает идти все глубже и глубже, пока мы не найдем целевой узел или узел без дочерних элементов. P.S - Сохрани, чтобы не потерять. Не забудь поделиться 💻 #Алгоритмы

Перемешать массив Перетасовка массива очень проста с помощью методов .sort и .random const shuffleArray = (arr) => arr.sort(() => 0.5 - Math.random()); console.log(shuffleArray([1, 2, 3, 4])); // Результат: [ 1, 4, 3, 2 ] P.S - Сохрани, чтобы не потерять. Не забудь поделиться 💻 #ПолезныйJS

🙌🏻@za_frontend

​​Как выучить Javascript : некоторые ключевые моменты, на которые стоит обратить внимание Программирование на JavaScript не сложно освоить. Но если это ваш первый язык программирования, то привыкание к программированию может занять некоторое время.  Язык JavaScript — один из самых удобных языков программирования. На самом деле, есть несколько доступных инструментов, которые помогут вам быстро изучить его. #js #полезно

​​Full-Stack JS — это безумие… Rails лучше? «Подходит ли Rails для разработки полного стека?» это вопрос, который я вижу много. Спрашивающий, как правило, является разработчиком JS с полным стеком, который перегружен выбором фреймворков. В этом посте мы увидим, что отличает Rails от JS с полным стеком, чтобы решить, лучше ли Rails. #js

​​Скрытые элементы В CSS есть два обычных метода скрытия элементов. Видимость элемента можно переключать с помощью style.visibility. Если вы хотите удалить элемент из всего потока рендеринга, используйте свойство style.display. const hideElement = (элемент, removeFromFlow = false) => { removeFromFlow ? (element.style.display = none) : (element.style.visibility = hidden); }; Если вы не удалите элементы из потока рендеринга и просто скроете видимость, элементы все равно будут отображаться и занимать пространство просмотра. При рендеринге длинных списков используйте свойство style.display, чтобы скрыть элементы, которые не находятся в видимой области, в сочетании с API-интерфейсом IntersectionObserver, описанным выше, может значительно повысить производительность рендеринга. #полезно #js

​​Работа с Fetch API в JavaScript Иногда нам может понадобиться общаться с другими веб-серверами. И в этот момент одним из методов, который вступает в игру, является Fetch API . По своей сути Fetch API — это современный интерфейс, который позволяет нам отправлять HTTP -запросы из веб-браузеров на серверы. Fetch API расположен под объектом окна и использует структуру промисов , поставляемую с ES6. Если вы работали с объектами XMLHttpRequest (XHR) или ajax() , Fetch API выполняет операции с этими объектами более простым и асинхронным способом. #js