masha_codeca – Telegram
masha_codeca
129 subscribers
12 photos
16 videos
1 file
62 links
👋 Привет, друг!
Давайте знакомиться! Меня зовут Маша и я фронтенд разработчик. Работала в таких крупных компаниях как Epam и Yandex, а также в стартапах и веб-студиях. В общем я прошла огонь, воду, «галеры» и бигтехи. 👩‍💻И мне есть, что тебе рассказать. 😏
Download Telegram
😁1🤣1
#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
#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 #собеседования
masha_codeca pinned «👋 Привет, друг! Давайте знакомиться! Меня зовут Маша и я фронтенд разработчик. Работала в таких крупных компаниях как Epam и Yandex, а также в стартапах и веб-студиях. В общем я прошла огонь, воду, «галеры» и бигтехи. 👩‍💻И мне есть, что тебе рассказать. 😏»
Channel photo updated
Задача дня

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


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 #собеседования
Доступность (accessibility): 5 простых советов для улучшения интерфейсов 🔼

Доступность (accessibility) помогает сделать сайт удобным для людей с ограниченными возможностями: людей с особенностями зрения, слуха, моторики. 🧑‍🦽🧑‍🦯

Поэтому в современной разработке интерфейсов этот вопрос часто всплывает на собеседованиях, особенно в зарубежных компаниях. 🌍

Вот 5 лёгких шагов, которые помогут сделать твои интерфейсы доступнее:

1️⃣ Используй семантический HTML 🏗

Структурируй страницу с помощью <header>, <nav>, <main>, <footer>.

А заголовки выстраивай логически: <h1> → <h2> → <h3>. Это упрощает навигацию для экранных читалок. 🛠️

2️⃣ Добавляй описания 🖼️

Для изображений: добавь понятный alt. Если картинка декоративная, оставь alt="".

Для кнопок: используй aria-label. Например:

<button aria-label="Открыть меню">☰</button>


3️⃣ Обеспечь навигацию с клавиатуры ⌨️

Убедись, что пользователи могут перемещаться по сайту с помощью Tab.

Для кастомных элементов добавляй tabindex="0". 🔑

4️⃣ Добавь фокусные состояния 🎯

Не убирай outline у кнопок и ссылок — это важно для клавиатурной навигации. Но можешь его кастомизировать:


button:focus {
outline: 2px solid #005fcc;
}


5️⃣ Проверь масштабируемость 🔍

Твой текст должен оставаться читабельным при увеличении масштаба до 200%. Используй относительные единицы (rem, em), чтобы всё выглядело гармонично.

И не забывай тестировать! 🧪
Пройди по сайту только с клавиатурой. Проверь его через Lighthouse, Axe или экранные читалки (VoiceOver, NVDA). 🎧

Доступность — это забота о пользователях и шаг к профессионализму. Сделай свои интерфейсы удобнее для всех! 💪💻

#accessibility #html #frontend
Please open Telegram to view this post
VIEW IN TELEGRAM
Задача дня

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


const obj = {
a: 1,
b: function() {
return this.a;
}
};

const fn = obj.b;
console.log(obj.b());
console.log(fn());


Ответ:
1
undefined

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

Разбирайтесь в теме, вы супер! 💪😊

#javanoscript #собеседования
1
Какой бы мощный и функциональный ни был бекенд, без удобного и привлекательного фронта пользователь не сможет оценить все его преимущества ☝🏻
Задача дня

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


console.log(typeof null);
console.log(null == undefined);
console.log(null === undefined);
console.log(null > 0);
console.log(null >= 0);


Ответ:
"object"
true
false
false
true

Если возникли трудности, почитайте про null, undefined и сравнения в JavaScript:
https://learn.javanoscript.ru/comparison

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

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


setTimeout(() => console.log("Timeout"), 0);

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

console.log("Sync");


Ответ:
"Sync"
"Promise"
"Timeout"

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

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

Что произойдет, если в HTML будет такой код?


<div>
<p>Параграф 1</p>
<p>Параграф 2</p>
<p>Параграф 3</p>
</div>
<noscript>
const div = document.querySelector('div');
console.log(div.innerHTML);
</noscript>


Ответ:
<p>Параграф 1</p><p>Параграф 2</p><p>Параграф 3</p>

Если возникли трудности, почитай про свойство innerHTML:
https://learn.javanoscript.ru/dom-nodes

Ты на верном пути, продолжай! 💡

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

Какой цвет будет у текста, если есть такие стили?


p {
color: blue !important;
}

.container p {
color: red;
}

p.special {
color: green;
}


<div class="container">
<p class="special">Привет!</p>
</div>


Ответ:
Синий

Если возникли трудности, почитай про !important и приоритеты в CSS:
https://developer.mozilla.org/ru/docs/Web/CSS/Specificity

Ты молодец, продолжай развиваться! 🌟💻

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

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


const promise = new Promise((resolve, reject) => {
console.log("Промис создан");
resolve("Успех!");
});

promise.then((result) => console.log(result));
console.log("Код завершён");


Ответ
Промис создан
Код завершён
Успех!

Если возникли трудности, читай про эту тему здесь:
https://learn.javanoscript.ru/promise-basics

Промисы — мощная вещь, главное понять, как они работают. Ты справишься! 🚀

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

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


const numbers = [1, 2, 3, 4, 5];
const sum = numbers.reduce((acc, curr) => acc + curr, 0);

console.log(sum);


Ответ
15

Если возникли трудности, читай про эту тему здесь:
https://learn.javanoscript.ru/array-methods#reduce-reduceright

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

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


try {
const num = 10 / 0;
if (!isFinite(num)) {
throw new Error("Деление на ноль!");
}
} catch (error) {
console.log(error.message);
} finally {
console.log("Операция завершена");
}


Ответ
Деление на ноль!
Операция завершена

Если возникли трудности, читай про эту тему здесь:
https://learn.javanoscript.ru/try-catch

Ошибки — это не страшно, если знаешь, как с ними справляться! 💪

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