Какие есть типы данных в JavaScript ?
1️⃣ String (Строка): Представляет собой последовательность символов и используется для работы с текстом. Пример:
2️⃣ Number (Число): Означает числовое значение, которое может быть целым или дробным. Примеры:
3️⃣ BigInt: Используется для представления целых чисел произвольной длины, превышающих пределы
4️⃣ Boolean (Логический тип): Представляет два значения:
5️⃣ undefined: Обозначает отсутствие значения. Переменная, которой не было присвоено значение, автоматически получает значение
6️⃣ null: Также обозначает отсутствие значения, но, в отличие от
7️⃣ Symbol: Представляет уникальный и неизменяемый идентификатор, часто используемый для создания уникальных ключей объектов. Каждый созданный
8️⃣ Object (Объектный тип данных): Объекты в JavaScript представляют собой набор пар
"Hello, world!".52, 3.14. Также включает специальные значения, такие как Infinity, -Infinity и NaN (Not-a-Number, результат некорректной математической операции).Number. Пример: 9009999554440991n.true (истина) и false (ложь), используемые для выполнения логических операций.undefined.undefined, присваивается переменной явно, чтобы указать на отсутствие значения.Symbol уникален и не совпадает с другими Symbol."ключ-значение", где ключами могут быть строки или символы (Symbols), а значениями могут быть любые типы данных, включая другие объекты. Они позволяет хранить коллекции различных значений и более сложные структуры данных. Обьектами являются массивы [], функции function fn() {} , даты let now = new Date() и сами обьекты {}Please open Telegram to view this post
VIEW IN TELEGRAM
👍2
💪 Вчера получил оффер на 4к$ 💵
❓ ❓ Вопросы с собеседования ❓ ❓
1. Чем отличаются
2. Чем отличается
3. При каком запросе происходит кеширование?
4. Что такое
5. Что такое
6. Что такое
7. Специфичность селекторов
8. Чей вес селектора больше
9. Этапы рендера в react приложении?
10. Бандл приложение. Чем формируется? Для чего нужен?
11. Способы оптимизации бандла
12. Расскажите про ваш опыт настройки сборщика приложений
13. Что такое микро-фронтенды?
14. JavaScript однопоточный или многопоточный?
15. Есть ли возможность сделать дополнительный поток? Вебворкеры.
16. Что позволяет писать асинхронный код в JS?
17. Что такое микро и макротаски?
18. Какие проблемы можем получить с большим количеством замыканий?
19. Сборщик мусора в JS
20. Концепция жизненного цикла в классовых компонентах
21. Как называется метод аналога
22. Как использовать
23. Как использовать
24. Как использовать
25. В чем отличие
26. Контролируемые и неконтролируемые компоненты. Расскажите отличие
27.
28. Для чего придумали стейт-менеджеры (
29. Какую проблему решает
»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»
30. Кейс: приходит джуниор или миддл с оценкой задачи в 50 часов. Ваши действия?
31. Расскажите ваш опыт управления командой
»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»
1. Чем отличаются
http от https?2. Чем отличается
get запрос от post?3. При каком запросе происходит кеширование?
4. Что такое
preflight запрос?5. Что такое
CORS? Кто прописывает доступность CORS?6. Что такое
css-in-js? Приведи примеры. Особенности css-in-js?7. Специфичность селекторов
8. Чей вес селектора больше
inline-style или !important?9. Этапы рендера в react приложении?
10. Бандл приложение. Чем формируется? Для чего нужен?
11. Способы оптимизации бандла
12. Расскажите про ваш опыт настройки сборщика приложений
13. Что такое микро-фронтенды?
14. JavaScript однопоточный или многопоточный?
15. Есть ли возможность сделать дополнительный поток? Вебворкеры.
16. Что позволяет писать асинхронный код в JS?
17. Что такое микро и макротаски?
18. Какие проблемы можем получить с большим количеством замыканий?
19. Сборщик мусора в JS
20. Концепция жизненного цикла в классовых компонентах
21. Как называется метод аналога
PureComponent?22. Как использовать
useCallback?23. Как использовать
useMemo?24. Как использовать
useEffect?25. В чем отличие
useEffect от useLayoutEffect?26. Контролируемые и неконтролируемые компоненты. Расскажите отличие
27.
useRef что это такое и как его использовать?28. Для чего придумали стейт-менеджеры (
redux, mobx и тд) 29. Какую проблему решает
redux?»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»
30. Кейс: приходит джуниор или миддл с оценкой задачи в 50 часов. Ваши действия?
31. Расскажите ваш опыт управления командой
»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»»
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥9
Зарплаты фронтенд разработчиков
(в РФ)
👼 Junior:
👨🏫 Middle:
👨💻 Middle+:
🥷 Senior:
🧔♂️ Team lead:
(в РФ)
👼 Junior:
30 000 - 120 000👨🏫 Middle:
100 000 - 250 000👨💻 Middle+:
170 000 - 300 000🥷 Senior:
280 000 - 450 000 🧔♂️ Team lead:
350 000 - 700 000⚡6
Как я поднял оффер с 350 до 420 в 2021 или о важности переговоров
Несколько лет назад я брал менторинг у очень опытного лида. Он мне советовал множество различных книг по карьере и ИТ. Одна из них Договориться можно обо всем! Как добиваться максимума в любых переговорах. Прочитав ее, благополучно забыл на несколько месяцев.
Через несколько месяцев начал проходить собеседования и меня очень заинтересовала позиция в крупной европейской компании(Компания А), успешно прошел собес и получил оффер, но по деньгам хотелось больше. Тут я вспомнил пару глав из книги о переговорах и смысл там был: нужно всегда торговаться и не бояться этого делать, называть максимальную цифру изначально и потом уже сводить к средней.
Параллельно прошел другой собес в банк (но там я не хотел работать). Получил оффер в 380 (+ премия) ~= 400 и пошел торговаться с компанией А. Мой сообщение было примерно такое:
Итого:оффер на 420 + квартальная премия
Несколько лет назад я брал менторинг у очень опытного лида. Он мне советовал множество различных книг по карьере и ИТ. Одна из них Договориться можно обо всем! Как добиваться максимума в любых переговорах. Прочитав ее, благополучно забыл на несколько месяцев.
Через несколько месяцев начал проходить собеседования и меня очень заинтересовала позиция в крупной европейской компании(Компания А), успешно прошел собес и получил оффер, но по деньгам хотелось больше. Тут я вспомнил пару глав из книги о переговорах и смысл там был: нужно всегда торговаться и не бояться этого делать, называть максимальную цифру изначально и потом уже сводить к средней.
Параллельно прошел другой собес в банк (но там я не хотел работать). Получил оффер в 380 (+ премия) ~= 400 и пошел торговаться с компанией А. Мой сообщение было примерно такое:
Мне очень понравился ваш проект и команда, я бы хотел с вами работать, но мне параллельно прислали оффер на 420(!). Очень с вами хочется работать, но по деньгам тоже не хочется проигрывать. Можем обсудить это и приблизиться к этой сумме?
Итого:
Литрес
Договориться можно обо всем! Как добиваться максимума в любых переговорах — Гэвин Кеннеди Альпина Паблишер Альпина Диджитал | Литрес
Добровольные уступки, сделанные одной стороной, не смягчают другую сторону – они делают ее позицию еще более жесткой!Вы стоите на пороге важной сделки, просите повышения или пытаетесь договориться с …
🔥6👏1
JavaScript: использование методов массивов в реальной жизни и необходимость их изучения.
( ч1. добавление/удаление элементов )
push:
частый кейс
необходимость изучения: 100%
pop:
нечастый кейс
необходимость изучения: 20%
shift:
гиперредкий кейс
необходимость изучения 0%
unshift:
гиперредкий кейс
необходимость изучения 0%
splice:
гиперредкий кейс
необходимость изучения 0%
slice:
частый кейс
необходимость изучения 100%
concat:
нечастый кейс
необходимость изучения 20%
( ч1. добавление/удаление элементов )
push:
push(…items)– добавляет элементы в конец массивачастый кейс
необходимость изучения: 100%
pop:
pop() – удаляет элемент из конца массиванечастый кейс
необходимость изучения: 20%
shift:
shift() – извлекает элемент из начала массивагиперредкий кейс
необходимость изучения 0%
unshift:
unshift(...items) – добавляет элементы в началогиперредкий кейс
необходимость изучения 0%
splice:
splice(start[, deleteCount, elem1, ..., elemN]) – добавляет, удаляет и заменяет элементыгиперредкий кейс
необходимость изучения 0%
slice:
slice([start], [end]) – возвращает новый массив, в который копирует все элементы с индекса start до end, тоже самое что и splice, но в разы прощечастый кейс
необходимость изучения 100%
concat:
concat(arg1, arg2...) – создаёт новый массив, в который копирует данные из других массивов и дополнительные значения, на текущий момент можно заменить оператором [...spread]нечастый кейс
необходимость изучения 20%
👍5❤1💯1
Никогда не проходи тестовое задание (бесплатно)
За свою многолетнюю карьеру делал 15-20 тестовых. Абсолютно неблагодарная работа. Практически никогда не было позитивного фидбека. Ревьювер кода всегда смотрит со своей колокольни и не всегда она будет смотреть в вашу пользу. У каждого свое понимание «чистого» кода.
Тестовое занимает больше часа - в топку! Если компания не готова потратить время на тебя, почему ты должен тратить время на нее? В нормальных компаниях время на устройство вместе с соискателем делится примерно 50/50.
Последний раз делал тестовое пару лет назад на сеньорскую позицию с хорошими деньгами и условиями.
При просмотре тестового с лидом той компании оказалось, что для него норм писать костыли по проекту, писать на реакте классовые и функциональные компоненты одновременно чтобы использовать методы из обоих типов, лезть в
«по-хорошему надо бы, но мне удобнее так»
после этого меня побрили.
За свою многолетнюю карьеру делал 15-20 тестовых. Абсолютно неблагодарная работа. Практически никогда не было позитивного фидбека. Ревьювер кода всегда смотрит со своей колокольни и не всегда она будет смотреть в вашу пользу. У каждого свое понимание «чистого» кода.
Тестовое занимает больше часа - в топку! Если компания не готова потратить время на тебя, почему ты должен тратить время на нее? В нормальных компаниях время на устройство вместе с соискателем делится примерно 50/50.
Последний раз делал тестовое пару лет назад на сеньорскую позицию с хорошими деньгами и условиями.
При просмотре тестового с лидом той компании оказалось, что для него норм писать костыли по проекту, писать на реакте классовые и функциональные компоненты одновременно чтобы использовать методы из обоих типов, лезть в
instance компонета и менять там значения. На мои возражения соблюдения консистентности и кода без костылей человек сказал: «по-хорошему надо бы, но мне удобнее так»
после этого меня побрили.
👍6
Тестирование фронтенда
Пирамида тестирования на фронте выглядит так:
E2E тестирование: Сквозное (end-to-end) тестирование, позволяет тестировать функционал приложения. Прокликивать отдельные фичи, запускать процессы и тд. Обычно для их написания использует Cypress или Selenium. Для тестирования добавляет отдельные атрибуты для элементов. Пример:
Integration тестирование: Интеграционное тестирование, позволяет тестировать работу всего приложения через взаимодействие с
Unit тестирование: Юнит тестирование, самое популярный вид тестов тестирование. Позволяет тестировать модули или определенные блоки. Конкретно на фронте тестирование классов, утилилок или компонентов. Чаще всего для юнит тестирования используют jest, react-testing-library.
Полезные статьи по тестированию:
Тестирование фронтенда: большой гайд
Трофей тестирования фронтенда
Какие инструменты и подходы использовать для тестирования фронтенда — рассказывают эксперты
7 основных тенденций в тестировании Web Front-End
#javascript #react #jest #cypress #selenium #unittest #e2e
Пирамида тестирования на фронте выглядит так:
e2e
integration
unitE2E тестирование: Сквозное (end-to-end) тестирование, позволяет тестировать функционал приложения. Прокликивать отдельные фичи, запускать процессы и тд. Обычно для их написания использует Cypress или Selenium. Для тестирования добавляет отдельные атрибуты для элементов. Пример:
<input data-test-id="search-input" />Integration тестирование: Интеграционное тестирование, позволяет тестировать работу всего приложения через взаимодействие с
UI, совместимость с другими модулями(если например приложение разбито на микрофронты или использует общение с другими приложениями). Обычно для их написания используют тот же Cypress или самописные решения.Unit тестирование: Юнит тестирование, самое популярный вид тестов тестирование. Позволяет тестировать модули или определенные блоки. Конкретно на фронте тестирование классов, утилилок или компонентов. Чаще всего для юнит тестирования используют jest, react-testing-library.
Полезные статьи по тестированию:
Тестирование фронтенда: большой гайд
Трофей тестирования фронтенда
Какие инструменты и подходы использовать для тестирования фронтенда — рассказывают эксперты
7 основных тенденций в тестировании Web Front-End
#javascript #react #jest #cypress #selenium #unittest #e2e
🤨3
JavaScript: использование методов массивов в реальной жизни и необходимость их изучения.
( ч2. перебор, поиск, трансформация элементов )
forEach:
нечастый кейс
необходимость изучения: 30%
includes:
частый кейс
необходимость изучения: 100%
indexOf:
частый кейс
необходимость изучения 50%
find:
частый кейс
необходимость изучения 100%
filter:
частый кейс
необходимость изучения 100%
map:
частый кейс
необходимость изучения 100%
sort:
частый кейс
необходимость изучения 100%
( ч2. перебор, поиск, трансформация элементов )
forEach:
forEach((item, index, array) => )– позволяет запускать функцию для каждого элемента массиванечастый кейс
необходимость изучения: 30%
includes:
includes(item, from) – ищет item начиная с индекса from и возвращает true, если поиск успешенчастый кейс
необходимость изучения: 100%
indexOf:
indexOf(item, from) – ищет item начиная с индекса from и возвращает номер индекса, на котором был найден искомый элемент, в противном случае -1частый кейс
необходимость изучения 50%
find:
find((item, index, array) =>) – если true - возвращается текущий элемент и перебор прерывается, если все итерации оказались ложными, возвращается undefinedчастый кейс
необходимость изучения 100%
filter:
filter((item, index, array) =>) – проходит циклом по массиву и выдает результат из элементов соответствующих условиючастый кейс
необходимость изучения 100%
map:
map((item, index, array) => ) – вызывает функцию для каждого элемента массива и возвращает массив результатов выполнения этой функциичастый кейс
необходимость изучения 100%
sort:
sort((a,b) – возвращает отсортированный массив, но обычно возвращаемое значение игнорируется, так как изменяется самчастый кейс
необходимость изучения 100%
👍7
JavaScript. Как создать дополнительный поток?
Anonymous Quiz
3%
setTimeout
70%
Worker
9%
Mutation Observer
18%
Promise
👍3
На 95% собеседований вас спросят о нем. Event Loop.
Event Loop (событийный цикл) - главнейший механизм в JS.
JS -
Что блокирует интерфейс?
- циклы while, for
- тяжелые вычисления
- cинхронные операции без механизмов ассинхроности (
Полезные статьи:
Эволюция асинхронного JavaScript
What is non-blocking IO?
Асинхронное программирование в однопоточных средах JavaScript
Event Loop (событийный цикл) - главнейший механизм в JS.
JS -
однопоточный язык и некоторыми операциями можно заблокировать интерфейс пользователя. Соотвественно чтобы писать user-friendly приложение нужно делать его без блокеров IO (ввода вывода). Т.к. есть операции, которые мы не можем выполнить прямо сейчас, а когда-то потом. Для этого существует Event Loop и асинхронные инструменты Promise, async await и тд. Что блокирует интерфейс?
- циклы while, for
- тяжелые вычисления
- cинхронные операции без механизмов ассинхроности (
setTimeout, requestAnimationFrame и тд)Полезные статьи:
Эволюция асинхронного JavaScript
What is non-blocking IO?
Асинхронное программирование в однопоточных средах JavaScript
Frontender Magazine
Эволюция асинхронного JavaScript
До async-функций уже рукой подать, однако путь к ним был достаточно долгим.
Кажется, ещё недавно мы просто писали коллбеки, и вот уже одна за другой появились спецификация Promise/A+, генераторы, а теперь ещё и async-функции. Давайте оглянемся назад и вспомним…
Кажется, ещё недавно мы просто писали коллбеки, и вот уже одна за другой появились спецификация Promise/A+, генераторы, а теперь ещё и async-функции. Давайте оглянемся назад и вспомним…
👍5
🤷♂️В 90% случаев качественного повышение в зп в рамках одной компании не случится. Может добавят 5-10% раз в полгода-год в лучшем случае.
👩💻Лет 5 назад забирал документы у эйчаров с одной из работ. Параллельно слушал о чем они говорили: "Вася хочет повышение до 200, а у него 160. Надо посчитать сколько будет переплата за год и будет ли это больше какого-то коэффицента. Если больше, то не поднимаем зп".
Самый верный способ качественно увеличить зп на
Please open Telegram to view this post
VIEW IN TELEGRAM
💯5
🍁Осень - лучшее время для поиска работы
На моей памяти самые крутые интересные денежные вакансии приходились на последний квартал года.
❓ Почему так? Проекты горят, нужно выполнить KPI до конца, менеджерам показать что-то чтобы выбить бюджет или получить бонус. Бюджет на расширение штата закладывают как раз в сентябре.
🌿 В прошлом году искал работу весной: зп небольшие предлагают до 300, вакансий мало. Также в прошлом году: куча вакансий, зп предлагают по 400-450 / 5-6k$
❗️ Так что советую присматриваться к новым вакансиям в это время года.
На моей памяти самые крутые интересные денежные вакансии приходились на последний квартал года.
🌿 В прошлом году искал работу весной: зп небольшие предлагают до 300, вакансий мало. Также в прошлом году: куча вакансий, зп предлагают по 400-450 / 5-6k$
Please open Telegram to view this post
VIEW IN TELEGRAM
👍7
Переменные:
- примитивы и непримитивы
- ссылочное копирование
- обьекты
- массивы
- стрелочные функции
- методы массивов
- методы обьектов
Работа с функциями и контекстом:
- this
- привязка контекст + переадресация вызова
- лексическое окружение
- замыкание, область видимости
- глобальный объект
Асинхронность:
- event loop
- promise
- async/await
Please open Telegram to view this post
VIEW IN TELEGRAM
👍7👻2
Костя 8Бит | Fullstack AI
🍁Осень - лучшее время для поиска работы На моей памяти самые крутые интересные денежные вакансии приходились на последний квартал года. ❓ Почему так? Проекты горят, нужно выполнить KPI до конца, менеджерам показать что-то чтобы выбить бюджет или получить…
Осень началась, появились вкусные вакансии)
🤩5🌚2👻2
🚀 С нуля до оффера на 185 за 3 недели!
Мой ученик получил оффер на позицию Middle Frontend Developer с первого собеседования. Зарплата 185к₽.
Что было:
• Полгода самостоятельного обучения
• Пробелы в JS
• Страх собеседований
Что сделали за 3 недели:
✅ Закрыли пробелы в JavaScript
✅ Обсудили легенду и доработали
✅ Провели 4 моков собеседований
Результат: оффер в продуктовую компанию с первой попытки! Не без удачи конечно🍀
Мой ученик получил оффер на позицию Middle Frontend Developer с первого собеседования. Зарплата 185к₽.
Что было:
• Полгода самостоятельного обучения
• Пробелы в JS
• Страх собеседований
Что сделали за 3 недели:
✅ Закрыли пробелы в JavaScript
✅ Обсудили легенду и доработали
✅ Провели 4 моков собеседований
Результат: оффер в продуктовую компанию с первой попытки! Не без удачи конечно
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥10❤2🤩2👻1🙉1