Какой будет вывод?
Anonymous Quiz
29%
"Lydia"
29%
"Sarah"
32%
Error: cannot redeclare Person
10%
SyntaxError
👍8
February 18, 2024
Пояснение к предыдущему посту
Мы можем установить классы равными другим классам/конструкторам функций. В этом случае мы устанавливаем Person равным AnotherPerson. Свойство name этого конструктора - Sarah, поэтому свойство name для нового экземпляра класса Person member - это Sarah.
🔥8👍2👎1
February 18, 2024
Анимация в браузерах и как с ней работать
Многие разработчики умеют создавать красивые и плавные анимации, но далеко не все понимают, как на самом деле они работают и что происходит «под капотом» браузера в момент их отрисовки и запуска. Вместе с тем, работа с анимацией без знания основных нюансов нередко заканчивается появлением лагов и чрезмерным потреблением ресурсов.
Ссылка
#статьи
Многие разработчики умеют создавать красивые и плавные анимации, но далеко не все понимают, как на самом деле они работают и что происходит «под капотом» браузера в момент их отрисовки и запуска. Вместе с тем, работа с анимацией без знания основных нюансов нередко заканчивается появлением лагов и чрезмерным потреблением ресурсов.
Ссылка
#статьи
👍9🔥2👏1
February 18, 2024
const info = {
[Symbol('a')]: 'b'
}
console.log(info)
console.log(Object.keys(info))
🤯7
February 19, 2024
Какой будет вывод?
Anonymous Quiz
33%
{Symbol('a'): 'b'} and ["{Symbol('a')"]
15%
{} and []
29%
{ a: "b" } and ["a"]
23%
{Symbol('a'): 'b'} and []
February 19, 2024
Пояснение к предыдущему посту
Symbol не является перечисляемый. Метод Object.keys возвращает все перечисляемые свойства ключа для объекта. Symbol не просматривается таким образом, и возвращается пустой массив. При регистрации всего объекта будут видны все свойства, даже не перечисляемые.
Это одно из многих качеств символа: помимо представления совершенно уникального значения (которое предотвращает случайное столкновение имен в объектах, например, при работе с 2 библиотеками, которые хотят добавить свойства к одному и тому же объекту), вы также можете "скрыть" свойства объектов таким образом (хотя и не полностью. Вы можете получить доступ к символам, используя метод Object.getOwnPropertySymbols()).
Это одно из многих качеств символа: помимо представления совершенно уникального значения (которое предотвращает случайное столкновение имен в объектах, например, при работе с 2 библиотеками, которые хотят добавить свойства к одному и тому же объекту), вы также можете "скрыть" свойства объектов таким образом (хотя и не полностью. Вы можете получить доступ к символам, используя метод Object.getOwnPropertySymbols()).
👍9🔥2
February 19, 2024
Не стоит недооценивать HTML
«HTML – это просто», «Разрабатывать фронтенд проще, чем бэкенд», «После реализации бэкенда обновление UI не должно составлять труда», – за время работы в сфере веб-разработки вокруг меня то и дело звучали эти и другие аналогичные утверждения.
И очень часто они вызывали у меня грусть.
Дело в том, что бо́льшую часть времени я проводила за написанием фронтенда, включая работу с HTML, CSS и JavaScript (по факту в основном TypeScript). Когда кто-нибудь говорит мне о «простоте» моей работы, я начинаю думать, что мои навыки не представляют высокой ценности, и меня может легко заменить любой разработчик…
В статье же я решила описать свои размышления, которые рождались в течение последних двух лет во время работы с людьми из разных команд с разным опытом в HTML-разработке и фронтенд-технологиях в целом. Здесь я озвучу несколько основных своих вопросов «Почему?», сопроводив их возможными ответами.
Ссылка
#html
«HTML – это просто», «Разрабатывать фронтенд проще, чем бэкенд», «После реализации бэкенда обновление UI не должно составлять труда», – за время работы в сфере веб-разработки вокруг меня то и дело звучали эти и другие аналогичные утверждения.
И очень часто они вызывали у меня грусть.
Дело в том, что бо́льшую часть времени я проводила за написанием фронтенда, включая работу с HTML, CSS и JavaScript (по факту в основном TypeScript). Когда кто-нибудь говорит мне о «простоте» моей работы, я начинаю думать, что мои навыки не представляют высокой ценности, и меня может легко заменить любой разработчик…
В статье же я решила описать свои размышления, которые рождались в течение последних двух лет во время работы с людьми из разных команд с разным опытом в HTML-разработке и фронтенд-технологиях в целом. Здесь я озвучу несколько основных своих вопросов «Почему?», сопроводив их возможными ответами.
Ссылка
#html
👍11🔥1😱1
February 19, 2024
const getList = ([x, ...y]) => [x, y]
const getUser = user => { name: user.name, age: user.age }
const list = [1, 2, 3, 4]
const user = { name: "Lydia", age: 21 }
console.log(getList(list))
console.log(getUser(user))
👍6
February 20, 2024
February 20, 2024
Пояснение к предыдущему посту
Функция getList получает массив в качестве аргумента. Между скобками функции getList мы сразу же деструктурируем этот массив. Вы можете увидеть это как:
[x, ...y] = [1, 2, 3, 4]
С помощью оставшихся параметров ... y мы помещаем все "оставшиеся" аргументы в массив. Остальные аргументы - это 2, 3 и 4 в этом случае. Значение y является массивом, содержащим все остальные параметры. В этом случае значение x равно 1, поэтому, мы видим в логе [x, y], [1, [2, 3, 4]].
Функция getUser получает объект. В стрелочных функциях нам не нужно писать фигурные скобки, если мы просто возвращаем одно значение. Однако, если вы хотите мгновенно вернуть object из стрелочной функции, вы должны написать его между круглыми скобками, иначе все, что находится между двумя фигурными скобками, будет интерпретироваться как оператор блока. В этом случае код между фигурными скобками не является допустимым кодом JavaScript, поэтому выдается SyntaxError.
Следующая функция вернула бы объект:
const getUser = user => ({ name: ||user.name||, age: user.age })
[x, ...y] = [1, 2, 3, 4]
С помощью оставшихся параметров ... y мы помещаем все "оставшиеся" аргументы в массив. Остальные аргументы - это 2, 3 и 4 в этом случае. Значение y является массивом, содержащим все остальные параметры. В этом случае значение x равно 1, поэтому, мы видим в логе [x, y], [1, [2, 3, 4]].
Функция getUser получает объект. В стрелочных функциях нам не нужно писать фигурные скобки, если мы просто возвращаем одно значение. Однако, если вы хотите мгновенно вернуть object из стрелочной функции, вы должны написать его между круглыми скобками, иначе все, что находится между двумя фигурными скобками, будет интерпретироваться как оператор блока. В этом случае код между фигурными скобками не является допустимым кодом JavaScript, поэтому выдается SyntaxError.
Следующая функция вернула бы объект:
const getUser = user => ({ name:
👍10
February 20, 2024
Ты наконец-то поймешь асинхронность в JS
Сегодня мы поговорим о том, что такое асинхронность в JavaScript и как она работает. Это одна из тех вещей, которые кажутся сложными, но на самом деле довольно просты, как только разберешься.
Асинхронный код в JavaScript выполняется в одном потоке, но не синхронно с основным потоком выполнения. Вместо того, чтобы блокировать выполнение основного кода, асинхронные операции обрабатываются в фоновом режиме. Это позволяет приложению продолжать свою работу без задержек, даже когда выполняются длительные операции, такие как запросы к серверу или обработка файлов. Таким образом, JavaScript обеспечивает отзывчивость приложений, не используя многопоточность, а полагаясь на механизмы асинхронного выполнения.
Ссылка
#js
Сегодня мы поговорим о том, что такое асинхронность в JavaScript и как она работает. Это одна из тех вещей, которые кажутся сложными, но на самом деле довольно просты, как только разберешься.
Асинхронный код в JavaScript выполняется в одном потоке, но не синхронно с основным потоком выполнения. Вместо того, чтобы блокировать выполнение основного кода, асинхронные операции обрабатываются в фоновом режиме. Это позволяет приложению продолжать свою работу без задержек, даже когда выполняются длительные операции, такие как запросы к серверу или обработка файлов. Таким образом, JavaScript обеспечивает отзывчивость приложений, не используя многопоточность, а полагаясь на механизмы асинхронного выполнения.
Ссылка
#js
👍8👎1🤯1😱1
February 20, 2024
February 21, 2024
February 21, 2024
Пояснение к предыдущему посту
Переменная name содержит значение строки, которая не является функцией, поэтому не может вызываться.
Ошибки типа выдаются, когда значение не соответствует ожидаемому типу. JavaScript ожидал, что name будет функцией, так как мы пытаемся вызвать ее. Однако это была строка, поэтому выдается ошибка TypeError: name не является функцией!
Синтаксические ошибки генерируются, когда вы написали что-то, что не является допустимым JavaScript, например, когда вы написали слово return как retrun. ReferenceErrors генерируется, когда JavaScript не может найти ссылку на значение, к которому вы пытаетесь получить доступ.
Ошибки типа выдаются, когда значение не соответствует ожидаемому типу. JavaScript ожидал, что name будет функцией, так как мы пытаемся вызвать ее. Однако это была строка, поэтому выдается ошибка TypeError: name не является функцией!
Синтаксические ошибки генерируются, когда вы написали что-то, что не является допустимым JavaScript, например, когда вы написали слово return как retrun. ReferenceErrors генерируется, когда JavaScript не может найти ссылку на значение, к которому вы пытаетесь получить доступ.
🔥11👍2❤1
February 21, 2024
Шпаргалка для алгособеса — алгоритмическая сложность, структуры данных, методы сортировки и Дейкстра
Так уж повелось, что любой уважающий себя работодатель перенимает передовые^✻ методики FAANG — по этой причине практически во всех IT-собесах есть она: секция алгоритмов. Кто-то ей рад, кто-то не очень, но секция есть и уходить пока не планирует. Поэтому нужно закатать рукава и достойно встретить суровую реальность.
При изучении алгоритмов расслабьтесь и получайте удовольствие, ведь есть ненулевая вероятность, что вам понадобятся полученные знания вне собеса. Кто знает, может однажды умение быстро обходить двоичное дерево поможет спасти вам мир (как и знание регулярок)
Ссылка
#статьи
Так уж повелось, что любой уважающий себя работодатель перенимает передовые^✻ методики FAANG — по этой причине практически во всех IT-собесах есть она: секция алгоритмов. Кто-то ей рад, кто-то не очень, но секция есть и уходить пока не планирует. Поэтому нужно закатать рукава и достойно встретить суровую реальность.
При изучении алгоритмов расслабьтесь и получайте удовольствие, ведь есть ненулевая вероятность, что вам понадобятся полученные знания вне собеса. Кто знает, может однажды умение быстро обходить двоичное дерево поможет спасти вам мир (как и знание регулярок)
Ссылка
#статьи
👍5🔥2🤯2👎1👏1
February 21, 2024
const output = `${[] && 'Im'}possible!
You should${'' && `n't`} see a therapist after so much JavaScript lol`
🤯6😁1
February 22, 2024
Какое значение будет на выходе?
Anonymous Quiz
18%
possible! You should see a therapist after so much JavaScript lol
49%
Impossible! You should see a therapist after so much JavaScript lol
11%
possible! You shouldn't see a therapist after so much JavaScript lol
22%
Impossible! You shouldn't see a therapist after so much JavaScript lol
February 22, 2024
Пояснение к предыдущему посту
[] - истинное значение. С оператором && будет возвращено правое значение, если левое значение является истинным значением. В этом случае левое значение [] является истинным значением, поэтому возвращается 'Im'.
"" - ложное значение. Если левое значение ложно, ничего не возвращается. n't не возвращается.
"" - ложное значение. Если левое значение ложно, ничего не возвращается. n't не возвращается.
🔥8
February 22, 2024
1/n: Задачи leetcode JS — «Max Consecutive Ones» (Найти максимальное количество последовательных единиц)
Я столкнулся с тем, что на собеседованиях в некоторые ИТ-компании на Frontend JavaScript требуется решать задачи, и я решил сделать серию статей на тему, как я решил их тем или иным образом. Перед вами — первый текст из этой серии.
Для решения будем использовать язык программирования TypeScript.
Ссылка
#js
Я столкнулся с тем, что на собеседованиях в некоторые ИТ-компании на Frontend JavaScript требуется решать задачи, и я решил сделать серию статей на тему, как я решил их тем или иным образом. Перед вами — первый текст из этой серии.
Для решения будем использовать язык программирования TypeScript.
Ссылка
#js
👍4👎2
February 22, 2024
const one = (false || {} || null)
const two = (null || false || '')
const three = ([] || 0 || true)
console.log(one, two, three)
👍7🤯1
February 23, 2024
Какое значение будет на выходе?
Anonymous Quiz
14%
false null []
14%
null "" true
53%
{} "" []
18%
null null true
February 23, 2024