en
Feedback
Фронтенд Гайд

Фронтенд Гайд

Open in Telegram

Канал для фронтендеров, много полезных лайфхаков, фичей, макетов, тестов! Все представлено в виде готового кода, бери и юзай в своем проекте. 6ad1a2aabe82d4fbb0d6

Show more
6 283
Subscribers
No data24 hours
-127 days
-7130 days
Posts Archive
Javascript вопрос: Может ли использоваться деструктуризация в объявлении функции в блоке перечисления аргументов (то есть, в круглых скобках, перед телом функции)?
Anonymous voting

Что такое merge и rebase, в чем отличие друг от друга ? Спросят с вероятностью 7% merge и rebase — это два способа интеграции изменений из одной ветки в другую в системе контроля версий Git. Оба метода имеют свои особенности и подходят для разных сценариев. Merge (слияние) Объединяет изменения из одной ветки в другую, создавая новый коммит слияния (merge commit). Этот метод сохраняет историю всех коммитов, включая все ветвления и слияния. 1️⃣Предположим, у вас есть две ветки: main и feature. 2️⃣В ветке feature вы сделали несколько коммитов. 3️⃣Вы хотите объединить изменения из feature в main.
git checkout main
git merge feature
В результате получается история, включающая коммит слияния:
A---B---C---F---G (main)
     \       /
      D---E (feature)
Где F и G — коммиты в ветке main, а D и E — коммиты в ветке feature. Коммит G — это коммит слияния, который объединяет изменения из feature в main. Rebase (перебазирование) Перемещает или переписывает базу текущей ветки на указанную базу другой ветки. Это переписывает историю коммитов, создавая новые коммиты для каждого из оригинальных коммитов. 1️⃣Предположим, у вас есть две ветки: main и feature. 1️⃣В ветке feature вы сделали несколько коммитов. 3️⃣Вы хотите перенести изменения из feature на текущий конец main.
git checkout feature
git rebase main
В результате история переписывается, как если бы коммиты из feature были сделаны на основе самой свежей версии main:
A---B---C---F---G (main)
                 
D'---E' (feature)
Где D' и E' — это новые коммиты, созданные при перебазировании, основанные на последних изменениях из main. Основные отличия 1️⃣История коммитов: ✅Merge: Сохраняет всю историю, включая коммиты слияния. История показывает, когда и как происходили слияния веток. ✅Rebase: Переписывает историю, делая её линейной. История показывает, как если бы все изменения были сделаны последовательно, без ветвлений. 2️⃣Коммиты слияния: ✅Merge: Создает новый коммит слияния, который объединяет изменения из двух веток. ✅Rebase: Не создает коммит слияния. Перебазирование "переносит" коммиты одной ветки на другую. 3️⃣Конфликты: ✅Merge: Конфликты решаются один раз при слиянии. ✅Rebase: Конфликты могут возникнуть на каждом коммите, и их нужно решать поэтапно. 4️⃣Применение: ✅Merge: Хорош для сохранения полного контекста истории разработки, особенно в командной работе. ✅Rebase: Хорош для поддержания чистой, линейной истории, особенно перед слиянием ветки в основную ветку, например, main или master. Когда использоватьИспользуйте merge, когда вы хотите сохранить всю историю разработки, включая все ветвления и слияния. Это полезно для командной работы, где важно видеть весь контекст изменений. ✅Используйте rebase, когда вы хотите поддерживать чистую и линейную историю. Это особенно полезно для интеграции изменений в основную ветку перед созданием pull request'ов, чтобы история коммитов была более понятной. Merge объединяет изменения из одной ветки в другую, создавая новый коммит слияния и сохраняя всю историю. Rebase переписывает историю, делая её линейной, перемещая коммиты из одной ветки на базу другой.

photo content

Javascript вопрос: Возможно ли сделать так, чтобы функция сама по себе (без внешних переменных или функций) хранила количество ее вызовов?
Anonymous voting

⚡️ Noisy Risograph Gradient Celestial Body - Генератор градиентов, выполненный с помощью SCSS и JavaScript

Курс графического дизайна с нуля. Бесплатное обучение! Выбери свое направление в дизайне: графический дизайн, веб-дизайн, UX/
Курс графического дизайна с нуля. Бесплатное обучение! Выбери свое направление в дизайне: графический дизайн, веб-дизайн, UX/UI-дизайн. И изучи бесплатно основы дизайна с личным наставником! 3 работы в портфолио. Узнать больше #реклама 16+ yudaevschool24.online О рекламодателе

Javascript вопрос: Какой оператор позволяет проверить, принадлежит ли объект к определенному классу (либо наследующему от указанного класса)?
Anonymous voting

photo content

SCSS Washing machine Стиральная машинка на HTML и SCSS.

🧭 Анимированный компас вышел из строя и не может найти, где находится страница.

🌲 Хорошая идея для пет-проекта — 3D-модель дерева, которую можно изменять при помощи разных параметров

🤔 Какой HTML элемент используется для задания контактной информации для автора/владельца документа?
Anonymous voting

photo content

HTML. С помощью какого атрибута тега input можно указать типы файлов, которые пользователь сможет загрузить?
Anonymous voting

Как сравнить объекты в js ? Спросят с вероятностью 7% Сравнение объектов требует особого внимания, поскольку объекты являются ссылочными типами данных. Это значит, что при сравнении объектов вы фактически сравниваете их ссылки в памяти, а не их содержимое. Вот несколько способов сравнения объектов: 1️⃣Сравнение ссылок на объекты При сравнении объектов с использованием оператора равенства (== или ===), сравниваются их ссылки, а не содержимое.
const obj1 = { a: 1 };
const obj2 = { a: 1 };
const obj3 = obj1;

console.log(obj1 === obj2); // false
console.log(obj1 === obj3); // true
2️⃣Глубокое сравнение объектов Для сравнения содержимого объектов необходимо проверять каждое свойство. Один из способов — написать рекурсивную функцию для глубокого сравнения.
function deepEqual(obj1, obj2) {
  if (obj1 === obj2) {
    return true;
  }

  if (obj1 == null || typeof obj1 !== 'object' ||
      obj2 == null || typeof obj2 !== 'object') {
    return false;
  }

  const keys1 = Object.keys(obj1);
  const keys2 = Object.keys(obj2);

  if (keys1.length !== keys2.length) {
    return false;
  }

  for (let key of keys1) {
    if (!keys2.includes(key) || !deepEqual(obj1[key], obj2[key])) {
      return false;
    }
  }

  return true;
}

const obj1 = { a: 1, b: { c: 2 } };
const obj2 = { a: 1, b: { c: 2 } };
const obj3 = { a: 1, b: { c: 3 } };

console.log(deepEqual(obj1, obj2)); // true
console.log(deepEqual(obj1, obj3)); // false
3️⃣Использование библиотек Существуют библиотеки, которые предоставляют функции для глубокого сравнения объектов, например, lodash или deep-equal.
const _ = require('lodash');

const obj1 = { a: 1, b: { c: 2 } };
const obj2 = { a: 1, b: { c: 2 } };
const obj3 = { a: 1, b: { c: 3 } };

console.log(.isEqual(obj1, obj2)); // true
console.log(.isEqual(obj1, obj3)); // false
4️⃣Проверка свойств с учетом порядка и типов Для простых случаев можно использовать сериализацию объектов с помощью JSON.stringify, однако этот метод имеет ограничения и может не работать с более сложными структурами (например, с функциями, undefined, или символами).
const obj1 = { a: 1, b: { c: 2 } };
const obj2 = { a: 1, b: { c: 2 } };
const obj3 = { a: 1, b: { c: 3 } };

console.log(JSON.stringify(obj1) === JSON.stringify(obj2)); // true
console.log(JSON.stringify(obj1) === JSON.stringify(obj3)); // false
Для сравнения объектов можно использовать:Сравнение ссылок с ===, если нужно проверить, указывают ли переменные на один и тот же объект. ✅Глубокое сравнение с помощью рекурсивной функции или библиотек (например, lodash), чтобы проверить равенство содержимого объектов. ✅Сериализация с JSON.stringify для простых случаев, хотя этот метод имеет ограничения и может не работать с более сложными структурами.

🤔 Что такое CSS Grid?
Anonymous voting

photo content

Javascript вопрос: Что вернет код ниже? typeof new Number(0)
Anonymous voting

Создание формы входа, при помощи HTML и CSS

🖥 POLINE — отличная библиотека TypeScript для генерации палитры цветовnpm install poline Название "POLINE" связано с сутью генератора — проведением линии в полярных координатах.