CodeRoll | Frontend
Open in Telegram
OZ — Лучшее для разработчика и дизайнера / IT инструменты, курсы и книги — Веб-разработка на JS, HTML, CSS, React, Vue,Angular Купить рекламу: https://telega.in/c/coderoll Чат: https://t.me/coderoll_chat По всем вопросам пишите сюда - @yankovsky_ads
Show more4 114
Subscribers
-124 hours
-177 days
-4230 days
Posts Archive
4 114
Разбираемся с this в JavaScript раз и навсегда
Бесконечно можно смотреть на три вещи: как горит огонь, как течет вода и то как фронтендеры пишут очередную статью про this.
Но все же такое количество статей существует не просто так, тема действительно для многих запутанная и зачастую даже сами авторы статей неправильно понимают this и соответственно закладывают неправильное понимание этого у читателей. Есть и хорошие статьи, где все описано верно, но в основном чисто с практической точки зрения, без погружения в то “как это работает на самом деле”.
В этой статье я попытаюсь раскрыть эту тему как можно глубже с теоретической точки зрения, исходя из спецификации ECMAScript, а уже на основе этой теории вывести определение значения this на практике.
Ссылка
#статьи
4 114
Мегагайд: культура работы с Git
За время работы в разных компаниях и над разными проектами я поняла, что Git — это не только (и не столько!) знание самой технологии и конкретных команд, но и определённая культура взаимодействия, практики, подходы, договорённости. Всё это помогает участникам команды лучше понимать друг друга и работать быстрее и чётче.
Поговорим как раз об этом — о том, что формирует культуру работы с Git: начнём с конвенций именования коммитов и закончим практиками работы в пуллреквесте. В конце статьи я поделюсь полезными ссылками на интерактивные обучалки, шпаргалки и гайды.
Ссылка
#статьи
4 114
👨💻 Изучаешь Frontend? Я тоже!
idk Frontend - канал, в котором я максимально подробно конспектирую весь мой путь обучения с самого старта.
С меня:
— Сложная теория простым языком;
— Практические примеры и объяснения;
— Крутые викторины по JS и шпаргалки;
— Работа над ошибками.
С тебя:
— Подписка @idk_frontend
Продолжим обучаться вместе! 👋
4 114
Пояснение к ответу
С помощью цикла for..in мы перебираем ключи объекта, в данном случае name и age. Ключи объекта (кроме Symbol) являются строками. В каждом цикле мы устанавливаем значение item равным текущему ключу, по которому он перебирается. Сначала item равен name, и выводится в консоль. Затем item равен age, что также выводится в консоль.
4 114
👨💻 Изучаешь Frontend? Я тоже!
idk Frontend - канал, в котором я максимально подробно конспектирую весь мой путь обучения с самого старта.
С меня:
— Сложная теория простым языком;
— Практические примеры и объяснения;
— Крутые викторины по JS и шпаргалки;
— Работа над ошибками.
С тебя:
— Подписка @idk_frontend
Продолжим обучаться вместе! 👋
4 114
const person = {
name: "John",
age: 30
}
for (const item in person) {
console.log(item)
}4 114
Основы программирования на примере исходного кода MobX
Изучите ключевые концепции программирования, лежащие в основе популярной JavaScript-библиотеки MobX. Понимание этих концепций поможет вам применить лучшие практики программирования в работе.
Ссылка
#статьи
4 114
Пояснение к ответу
Сначала мы объявляем переменную person со значением объекта, содержащего свойство name. Затем мы объявляем переменную members. Мы делаем первый элемент этого массива равным [person]. Объекты взаимодействуют посредством ссылок при установке их равными друг другу. Когда мы назначаем ссылку из одной переменной в другую, создается копия этой ссылки (обратите внимание, что у этих переменных не одинаковые ссылки). Затем мы присваиваем переменной person значение null. Мы изменили только значение person, а не первый элемент массива, поскольку этот элемент имеет другую (скопированную) ссылку на объект. Первый элемент в members по-прежнему содержит ссылку на исходный объект. Когда мы выводим в консоль массив members, первый элемент этого массива содержит значение объекта, который и выводится в консоль.
4 114
let person = { name: "John" }
const members = [person]
person = null
console.log(members)4 114
Пояснение к ответу
Когда мы передаем несколько промисов методу race, он возвращает первый разрешенный (выполненный или отклоненный) промис. В функцию setTimeout мы передаем задержку в 500 мс для первого промиса и в 100 мс - для второго. Это означает, что secondPromise разрешается первым со значением two. Переменная res имеет значение two, которое и выводится в консоль.
4 114
const firstPromise = new Promise((res, rej) => {
setTimeout(res, 500, "one")
})
const secondPromise = new Promise((res, rej) => {
setTimeout(res, 100, "two")
})
Promise.race([firstPromise, secondPromise]).then(res => console.log(res))4 114
Пояснение к ответу
Выполнение обычных функций не может быть остановлено после их запуска. Однако, генераторы можно останавливать в процессе выполнения, а затем продолжать с места остановки. Каждый раз, когда в функции-генераторе встречается ключевое слово yield, функция возвращает значение, указанное после него. Обратите внимание, что в генераторе вместо return используется yield. Сначала мы инициализируем генератор с i равным 10. Мы вызываем генератор, используя метод next. Когда мы в первый раз вызываем генератор, iравняется 10. Движок JavaScriptвстречает первое ключевое слово yieldи возвращает значение i. После этого выполнение функции приостанавливается и 10 выводится в консоль. Затем мы снова вызываем функцию посредством next(). Она запускается с того места, где остановилась, с i равным 10. Движок встречает следующее ключевое слово yield и возвращает i * 2. iравно 10, поэтому возвращается 20.
4 114
function* generator(i) {
yield i
yield i * 2
}
const gen = generator(10)
console.log(gen.next().value)
console.log(gen.next().value)4 114
Пояснение к ответу
null - это false. !null возвращает true. !true возвращает false. "" - это false. !"" возвращает true. !true возвращает false. 1 - это true. !1 возвращает false. !false возвращает true.
