现已上线！2025 年 Telegram 研究 — 年度关键洞察 
CodeRoll | Frontend
前往频道在 Telegram
OZ — Лучшее для разработчика и дизайнера / IT инструменты, курсы и книги — Веб-разработка на JS, HTML, CSS, React, Vue,Angular Купить рекламу: https://telega.in/c/coderoll Чат: https://t.me/coderoll_chat По всем вопросам пишите сюда - @yankovsky_ads
显示更多4 234
订阅者
无数据24 小时
-77 天
-5230 天
帖子存档
4 234
const promise1 = Promise.resolve('First')
const promise2 = Promise.resolve('Second')
const promise3 = Promise.reject('Third')
const promise4 = Promise.resolve('Fourth')
const runPromises = async () => {
const res1 = await Promise.all([promise1, promise2])
const res2 = await Promise.all([promise3, promise4])
return [res1, res2]
}
runPromises()
.then(res => console.log(res))
.catch(err => console.log(err))4 234
Стоит ли становиться Fullstack разработчиком
Сегодня я кратко (или не очень) изложу свои мысли о том, стоит ли быть fullstack разработчиком, какие плюсы и минусы у такого пути развития и для кого такое направление выгодно.
Ссылка
#статьи
4 234
Почему реактивность без VDOM (с реальным DOM) лучше, чем реактивность с VDOM?
В этой статье я хотел бы поделиться своими мыслями о том, почему виртуального DOM можно избежать при создании реактивности сегодня. Я работаю со всем этим уже около полутора лет, создавая фреймворк Cample.js, и у меня есть некоторые соображения по этому поводу.
Ссылка
#framework
4 234
Пояснение к ответу
Функция updateEmail представляет собой стрелочную функцию и не привязана к объекту пользователя. Это означает, что ключевое слово this не относится к объекту user, а в данном случае относится к глобальной области видимости. Значение email в объекте user не обновляется. При регистрации значения ||user.email|| возвращается исходное значение ||my@email.com||.
4 234
const user = {
email: "my@email.com",
updateEmail: email => {
this.email = email
}
}
user.updateEmail("new@email.com")
console.log(user.email)4 234
Лонгрид о JavaScript
JavaScript — ужасный язык программирования. По сравнению с другими распространёнными языками он выглядит генетическим уродом. Дело даже не в отсутствии многопоточности, или статической типизации, или того, что node-modules для простого проекта занимают сотни мегабайт, а в том, что в JavaScript столько стилей и подходов, что семь человек одну и ту же несложную задачу могут написать на нём семью различными способами. Каждый из них с трудом будет понимать, что написал другой, и тихо материться. Причем, так напишут и новички, и опытные программисты, которые просто привыкли писать по‑своему или захотели выпендриться.
Ссылка
#статьи
4 234
Пояснение к предыдущему посту
Ключи объекта преобразуются в строки.
Поскольку значение dog является объектом, animals[dog] на самом деле означает, что мы создаем новое свойство под названием "object Object", равное новому объекту. animals["object Object"] теперь равно { emoji: "🐶", name: "Mara"}.
cat также является объектом, что означает, что animals[cat] на самом деле означает, что мы перезаписываем значение animals["object Object"] новыми свойствами кота.
Регистрация animals[dog], или фактически animals["object Object"], поскольку преобразование объекта dog в строку приводит к "object Object", возвращает { emoji: "🐈", name: " Сара"}.
4 234
const animals = {};
let dog = { emoji: '🐶' }
let cat = { emoji: '🐈' }
animals[dog] = { ...dog, name: "Mara" }
animals[cat] = { ...cat, name: "Sara" }
console.log(animals[dog])4 234
Воплощённые типы
Хочу представить вам подход к определению типов, позволяющий сделать ваш код чище и понятнее. Я называю это «Воплощённые типы» («Embodied types»).
Воплощённый тип - тип, для которого определена переменная с одинаковым именем и в которой содержится объект с утилитами для этого типа.
Ссылка
#статьи
4 234
Пора переходить на микрофронтенд? Опыт «Инферит Клаудмастер»
В этой статье вы узнаете о:
факторах, сформировавших тренд на уход фронтенд-разработки от монолита к микрофронтенду,
процессах со стороны команды разработки при переходе на микрофронтенд,
кейсе платформы “Инферит Кладумастер”: почему для нашей команды микрофронтенд с плагином Module Federation стал полезным решением,
признаках того, что пора переходить на микрофронтенд.
Ссылка
#статьи
4 234
Пояснение к ответу
Функция updateUser обновляет значения свойств email и password у пользователя, если их значения переданы в функцию, после чего функция возвращает объект user. Возвращаемое значение функции updateUser — это объект user, что означает, что значение updatedUser является ссылкой на тот же объект user, на который указывает user. updatedUser === user равно true.
4 234
const user = {
email: "e@mail.com",
password: "12345"
}
const updateUser = ({ email, password }) => {
if (email) {
Object.assign(user, { email })
}
if (password) {
user.password = password
}
return user
}
const updatedUser = updateUser({ email: "new@email.com" })
console.log(updatedUser === user)4 234
Создание интерактивных анимаций с помощью React Spring
Эта статья посвящена React Spring — библиотеке анимации на основе JavaScript. Мы рассмотрим её фичи, включая различные хуки и компоненты, и то, как использовать их в приложениях.
Ссылка
#статьи
4 234
Всем привет! Напоминаю, что сегодня начинается фестиваль по трудоустройству для фронтендеров.
В рамках него вы можете:
— получить персональный фидбэк и советы по вашему резюме
— решить тестовое задание и получить разбор вашего решения
— пройти тестовое собеседование
На стримах вы сможете посмотреть, что спрашивают, как разбирают ответы участников, получить знания и стать увереннее в себе.
Сегодня вечером можно прийти посмотреть первый эфир и прокачать свое резюме по ссылке — будет полезно и интересно 🥸
4 234
Пояснение к предыдущему посту
Мы устанавливаем переменную calc равной новому экземпляру класса Calc. Затем мы создаем экземпляр нового экземпляра Calc и вызываем метод увеличения для этого экземпляра. Поскольку свойство count находится в конструкторе класса Calc, свойство count не используется в прототипе Calc. Это означает, что значение count не было обновлено для экземпляра, на который указывает calc, count по-прежнему равен 0.
4 234
class Calc {
constructor() {
this.count = 0
}
increase() {
this.count ++
}
}
const calc = new Calc()
new Calc().increase()
console.log(calc.count)