👋 Привет, друг!

Давайте знакомиться! Меня зовут Маша и я фронтенд разработчик. Работала в таких крупных компаниях как Epam и Yandex, а также в стартапах и веб-студиях. В общем я прошла огонь, воду, «галеры» и бигтехи. 👩‍💻И мне есть, что тебе рассказать. 😏

Тут я делюсь обучающим контентом по фронтенду, своим опытом, историями из жизни и мемами.

Присоединяйся!🤗

⚡️Задача дня

Каков порядок вывода в консоль?

console.log(1);

setTimeout(() => console.log(2), 0);

Promise.resolve().then(() => console.log(3));

console.log(4);

Ответ: 1 4 3 2

Design System, Design Library и UI Kit: В чем разница?

Design System: комплексный набор руководств, принципов и правил, определяющих визуальные и функциональные элементы продукта или бренда. Она включает цветовые схемы, иконографику, библиотеки UI-компонентов, принципы дизайна, стандарты доступности и другие элементы, обеспечивая согласованность и целостность продукта.

Design Library: коллекция повторно используемых UI-компонентов (кнопки, формы, карточки и т.д.), упрощающая работу дизайнеров и разработчиков. Обычно является частью дизайн-системы и ориентирована на практическую реализацию ее руководств.

UI Kit: набор заранее разработанных, автономных элементов пользовательского интерфейса, используемых для создания дизайнов или прототипов. Включает кнопки, поля ввода, иконки и другие виджеты, ускоряя процесс дизайна, особенно в инструментах вроде Figma.

⚡️Задача дня

Что выведет этот код?

function Foo() {}

Foo.prototype.bar = function () {
  return "Hello";
};

const instance = new Foo();

Foo.prototype.bar = function () {
  return "World";
};

console.log(instance.bar());

Ответ: World

#javanoscript

⚡️Задача дня
Что выведет этот код?

console.log(true || false && false);
console.log(false && true || true);
console.log(0 || "Hello" && undefined);

Ответ:
true true undefined

Тема: Логические операторы https://learn.javanoscript.ru/logical-operators

#алгоритмы #leetcode #javanoscript
🎯 Разбираем задачу с собеседования

https://youtu.be/hxXHYcdez34?si=FVWb90ePF4BdDRqW

#javanoscript #собеседования

⚡️Задача дня

Что выведет этот код?

function makeCounter() {
  let count = 0;
  return function () {
    return ++count;
  };
}

const counter1 = makeCounter();
const counter2 = makeCounter();

console.log(counter1());
console.log(counter1());
console.log(counter2());

Ответ:
1
2
1

Тема: Замыкание https://learn.javanoscript.ru/closure

Пятничные мемы😎

#javanoscript #собеседования

⚡️Задача дня

Что выведет этот код?

function foo(a, b) {
  arguments[0] = 5;
  arguments[1] = 10;
  return a + b;
}

console.log(foo(1, 2));

Ответ: 15

Статья по теме: https://learn.javanoscript.ru/rest-parameters-spread-operator#the-arguments-variable

⚡ Задача дня

Что выведет этот код?

function sayHi() {
  console.log(name);
  console.log(age);
  var name = "John";
  let age = 30;
}

sayHi();

Ответ:
undefined
Ошибка ReferenceError

Если возникли трудности, почитайте про области видимости, hoisting и разницу между var, let и const тут:
https://learn.javanoscript.ru/var

#javanoscript #собеседования

⚡ Задача дня

Что выведет этот код?

const arr = [1, 2, 3];

arr.push(4);
arr[0] = 0;

try {
  arr = [5, 6, 7];
} catch (error) {
  console.log(error.message);
}

console.log(arr);

Ответ:
TypeError: Assignment to constant variable.
[0, 2, 3, 4]

Если возникли трудности, почитайте про работу с const и изменение массивов тут:
https://learn.javanoscript.ru/array

#javanoscript #собеседования

⚡ Задача дня

❓ Что выведет этот код?

console.log(1 + "2" + "3");
console.log(1 + +"2" + "3");
console.log(1 + -"1" + "2");
console.log("2" * "3");
console.log("4" / "2");
console.log("4" + "2");

✅ Ответ:
"123"
"33"
"02"
6
2
"42"


Если возникли трудности, почитайте про преобразование типов в JavaScript:
https://learn.javanoscript.ru/type-conversions


Учитесь с удовольствием! 🎉

#javanoscript #собеседования