JavaScript test
9.6K subscribers
3.1K photos
16 videos
4.8K links
Javascript и все что с ним связано

Ссылка: @Portal_v_IT

Сотрудничество: @oleginc
Download Telegram
❗️Что будет на выходе:

function task1() {
console.log('A');
setTimeout(() => console.log('B'), 0);
Promise.resolve().then(() => console.log('C'));
Promise.resolve().then(() => setTimeout(() => console.log('D'), 0));
Promise.resolve().then(() => console.log('E'));
setTimeout(() => console.log('F'), 0);
console.log('G');
}

task1();

Ответ: A G C E B F D


JavaScript test | #JavaScript & Max
❗️Что будет на выходе:

const obj = {
x: 10,
foo() {
setTimeout(function() {
console.log(this.x);
}, 1000);
}
};
obj.foo();

Ответ: undefined

JavaScript test | #JavaScript & Max
❗️Что будет на выходе:

function highlight(strings, ...values) {
return strings.reduce((result, str, i) => {
const value = values[i] ? `<span>${values[i]}</span>` : '';
return result + str + value;
}, '');
}

const language = 'JavaScript';
const years = 10;

const result = highlight`I have been coding in ${language} for ${years} years`;
console.log(result);

Ответ: I have been coding in <span>JavaScript</span> for <span>10</span> years


JavaScript test | #JavaScript & Max
❗️Что будет на выходе:

function* generator1() {
yield 1;
yield 2;
}

function* generator2() {
yield* generator1();
yield 3;
}

const gen = generator2();
console.log(gen.next().value);
console.log(gen.next().value);
console.log(gen.next().value);

Ответ: 1, 2, 3

JavaScript test | #JavaScript & Max
👍1
❗️Что будет на выходе:

const createMathOps = (base) => {
return {
add: (x) => base + x,
multiply: (x) => base * x
};
};

const createAdvancedMathOps = (base) => {
const basicOps = createMathOps(base);
return {
...basicOps,
square: () => basicOps.multiply(base),
addThenSquare: (x) => {
const added = basicOps.add(x);
return added * added;
}
};
};

const calculator = createAdvancedMathOps(5);
console.log(calculator.addThenSquare(3));

Ответ: 64

JavaScript test | #JavaScript & Max
👍1
❗️Что будет на выходе:

function* infiniteGenerator() {
let i = 0;
while (true) {
yield i++;
}
}

const weakMap = new WeakMap();
const gen = infiniteGenerator();

weakMap.set(gen, gen.next().value);

const result = weakMap.get(gen) + gen.next().value;

console.log(result);

Ответ: 1


JavaScript test | #JavaScript & Max
👍1
❗️Что будет на выходе:

function highlight(strings, ...values) {
return strings.reduce((result, str, i) => {
const value = values[i] ? `<span>${values[i]}</span>` : '';
return result + str + value;
}, '');
}

const language = 'JavaScript';
const years = 10;

const result = highlight`I have been coding in ${language} for ${years} years`;
console.log(result);

Ответ: I have been coding in <span>JavaScript</span> for <span>10</span> years


JavaScript test | #JavaScript & Max
👍1
❗️Что будет на выходе:

function analyze(...items) {
const [first, ...rest] = items;
const { length } = [...rest, 'bonus'];
const result = {
...first,
count: length,
};

console.log(result);
}

analyze({ id: 42, name: 'Item' }, 'a', 'b');

Ответ: { id: 42, name: 'Item', count: 3 }

JavaScript test | #JavaScript & Max
👍1
❗️Что будет на выходе:

function highlight(strings, ...values) {
return strings.reduce((result, str, i) => {
const value = values[i] ? `<span>${values[i]}</span>` : '';
return result + str + value;
}, '');
}

const language = 'JavaScript';
const years = 10;

const result = highlight`I have been coding in ${language} for ${years} years`;
console.log(result);

Ответ: I have been coding in <span>JavaScript</span> for <span>10</span> years


🖥 JavaScript test // чат
Please open Telegram to view this post
VIEW IN TELEGRAM
👍1
❗️Что будет на выходе:

const memoryLeak = () => {
const cache = new Map();
const weakCache = new WeakMap();

const objKey = { id: 123 };
const data = { name: 'User data', value: 42 };

cache.set(objKey, data);
weakCache.set(objKey, data);

// Simulate removing reference to key
const result = { map: cache.has(objKey), weakMap: weakCache.has(objKey) };
// objKey = null; // This would be an error, as const can't be reassigned

return result;
};

console.log(memoryLeak());

Ответ: { map: true, weakMap: true }

🖥 JavaScript test // чат
Please open Telegram to view this post
VIEW IN TELEGRAM
👍1
Проверяем, открыта ли страница по HTTPS!

Безопасное соединение — важное условие для работы многих Web API. Большинство таких API требуют secure context — то есть HTTPS или http://localhost.

Проверить протокол можно так:
const isSecure = window.location.protocol === "https:";
console.log("Безопасное соединение:", isSecure);


Если нужно принудительно перенаправить пользователя на HTTPS:
if (window.location.protocol !== "https:") {
const { host, pathname, search, hash } = window.location;
window.location.replace(`https://${host}${pathname}${search}${hash}`);
}


Также можно быстро вывести текущий адрес страницы:
console.log("Текущий адрес:", window.location.href);


Такой пример полезен для практики работы с объектом location, управления навигацией и понимания поведения редиректов в браузере

🖥 JavaScript test // чат
Please open Telegram to view this post
VIEW IN TELEGRAM
👍2
Локальное хранилище браузера с использованием объекта localStorage

В примере мы используем объект localStorage, доступный в браузере, чтобы сохранить данные, такие как имя пользователя и адрес электронной почты. Мы используем метод setItem() для сохранения данных и метод getItem() для получения данных. Мы также демонстрируем, как можно удалить данные из локального хранилища с помощью метода removeItem().

🖥 JavaScript test // чат
Please open Telegram to view this post
VIEW IN TELEGRAM
👍2
Хотите узнать, когда элемент появляется в зоне видимости?

Используйте IntersectionObserver, он срабатывает, когда элемент попадает в viewport:
const observer = new IntersectionObserver(([entry]) => {
if (entry.isIntersecting) console.log('👀 Элемент виден');
});


Достаточно подключить наблюдение:
observer.observe(document.querySelector('#target'));


Теперь при появлении блока на экране в консоль выведется сообщение.

Можно остановить наблюдение, когда элемент уже показан:
observer.unobserve(document.querySelector('#target'));


IntersectionObserver работает асинхронно и не блокирует основной поток.

🖥 JavaScript test // чат
Please open Telegram to view this post
VIEW IN TELEGRAM
👍2
4 способа форматировать дату в JavaScript!

Работая с интерфейсами, часто нужно красиво вывести дату — например, "2025-11-14" превратить в "14 ноября 2025" или "14 Nov 2025".

1. Через toLocaleDateString() — локализованный формат:
const date = new Date('2025-11-14T00:00:00Z');
console.log(date.toLocaleDateString('ru-RU', {
day: 'numeric',
month: 'long',
year: 'numeric',
timeZone: 'Europe/Moscow'
}));
// "14 ноября 2025 г."


2. Через Intl.DateTimeFormat() — для повторного использования:
const date = new Date('2025-11-14T00:00:00Z');
const fmt = new Intl.DateTimeFormat('en-GB', {
day: '2-digit',
month: 'short',
year: 'numeric',
timeZone: 'UTC'
});
console.log(fmt.format(date));
// "14 Nov 2025"


3. Вручную — через методы Date:
const months = [
'января', 'февраля', 'марта', 'апреля', 'мая', 'июня',
'июля', 'августа', 'сентября', 'октября', 'ноября', 'декабря'
];
const date = new Date('2025-11-14T00:00:00Z');
const formatted = `${date.getUTCDate()} ${months[date.getUTCMonth()]} ${date.getUTCFullYear()}`;
console.log(formatted);
// "14 ноября 2025"


4. Через библиотеки dayjs или date-fns

dayjs:
import dayjs from "dayjs";
import "dayjs/locale/ru";
dayjs.locale("ru");

console.log(dayjs("2025-11-14").format("D MMMM YYYY"));
// "14 ноября 2025"


date-fns:
import { format, parse } from "date-fns";
import { ru } from "date-fns/locale";

const date = parse("2025-11-14", "yyyy-MM-dd", new Date());
console.log(format(date, "d MMMM yyyy", { locale: ru }));
// "14 ноября 2025"


Эти способы покрывают почти все задачи — от простых форматирований до продвинутых UI с локализацией.

🖥 JavaScript test // чат
Please open Telegram to view this post
VIEW IN TELEGRAM
👍2
Promise и цепочки промисов

Благодаря данному видео ты узнаешь, что такое объект Promise. Также ты изучишь состояния Promise: pending, fulfilled, rejected. Продемонстрировано перехватывание ошибки с catch.

➡️ Смотреть видео

🖥 JavaScript test // чат
Please open Telegram to view this post
VIEW IN TELEGRAM
👍2
This media is not supported in your browser
VIEW IN TELEGRAM
JS Hero — отличный ресурс для изучения JavaScript

Тут JS изучается не по скучным статьям, а через живые практические задания. Особенно полезно, если хочешь довести базу до автоматизма: функции, циклы, условия, строки, массивы. Постепенные уровни усложняются, и к концу ты уже пишешь уверенный код без подсказок.

➡️ jshero.net

🖥 JavaScript test // чат
Please open Telegram to view this post
VIEW IN TELEGRAM
👍3
Использование сторонних библиотек

Использование сторонних библиотек позволяет расширить функциональность вашего кода.

🖥 JavaScript test // чат
Please open Telegram to view this post
VIEW IN TELEGRAM
👍2
Убираем дубли, короткий способ получить уникальные значения!

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

В ES6 появился Set, вместе со spread-оператором он делает это в одну строку:
const unique = [...new Set([1, 1, 2, 3, 5, 5, 1])];


Set хранит только уникальные элементы, поэтому дубликаты автоматически отбрасываются:
console.log(unique); // [1, 2, 3, 5]


Этот приём работает для массивов примитивов: number, string, boolean, null, undefined.

🖥 JavaScript test // чат
Please open Telegram to view this post
VIEW IN TELEGRAM
❤3
АЙТИШНИКИ БЕСПЛАТНОЕ ОБУЧЕНИЕ

Проект «Terminal» стал крупнейшей библиотекой бесплатного образования. В одном канале собраны курсы, книги, полезные инструменты и практические тренажёры для всех разработчиков:

• Практические курсы и задания
• Книги и статьи известных авторов
• Полезные инструменты и ресурсы
• IT-новости и инсайды

Обучение по всем направлениям: SQL, Python, ML, Frontend, PHP, C++, Go, Git, Linux, QA, Java, Vibe-coding, InfoSec и др.

⌨️ подписаться
Please open Telegram to view this post
VIEW IN TELEGRAM
❤1
🧩Что будет на выходе?

function factorial(n) {
return n <= 1 ? 1 : n * factorial(n - 1);
}
console.log(factorial(5));

Ответ: 120

🖥 JavaScript test // чат
Please open Telegram to view this post
VIEW IN TELEGRAM