Олег программист | Фронтендер

Что такое IntersectionObserver в JavaScript IntersectionObserver - это мощный браузерный API, который позволяет асинхронно наблюдать за пересечением элемента (target) с его родителем (root) или областью просмотра (viewport). Другими словами, этот API обеспечивает вызов определенной функции каждый раз при пересечении целевого элемента с root или viewport. Для начала работы с IntersectionObserver необходимо с помощью конструктора создать объект-наблюдатель с двумя параметрами - функцией обратного вызова и настройками:

const observer = new IntersectionObserver(callback, options)

Функция обратного вызова будет выполняться каждый раз, когда происходит пересечение наблюдаемой области и какого-либо элемента из отслеживаемых. Она принимает массив объектов IntersectionObserverEntry, каждый из которых содержит информацию о пересечении одного элемента. Настройки позволяют гибко настроить поведение наблюдателя, например, установить пороговые значения пересечения или отступы. Вот простой пример использования IntersectionObserver:

const observer = new IntersectionObserver(entries => {
  entries.forEach(entry => {
    const intersecting = entry.isIntersecting
    entry.target.style.backgroundColor = intersecting ? "blue" : "orange"
  })
})

observer.observe(document.getElementById("test"))

В этом коде мы создаем наблюдателя, который меняет цвет фона элемента при пересечении границы viewport. Некоторые полезные примеры использования IntersectionObserver: - Ленивая загрузка изображений и контента - Бесконечная прокрутка (infinite scrolling) - Анимации, срабатывающие при скролле - Отображение прогресса просмотра страницы IntersectionObserver значительно улучшает производительность, позволяя отказаться от "дорогих" scroll-событий. Он работает асинхронно, не блокируя основной поток выполнения.

Вопрос с собеседования В чем отличие между Observable и Promise в JavaScript? Ответ: Observable и Promise - это два способа для работы с асинхронными операциями в JS. • Promise может завершиться успешно, либо с ошибкой, но выполняется лишь один раз. • Observable же представляет собой поток данных, которые могут быть доступны в любое время, он может генерировать несколько значений во время своей работы и быть остановлен в любое время.

Соответственно, промисы больше подходят для однократных операций, таких как загрузка файла, observable отлично справляется с потоками данных, таких как обновление данных в реальном времени.

👩‍💻 Smooth Liquid Background Effect Сцена с анимированным фоном. Сделана на SVG, CSS и JavaScript. Ссылка

5 нейронок, которые помогут разработчику найти нужную информацию: 1. Perplexity AI 2. Elicit AI 3. Consensus AI 4. Scite AI 5. ChatPDF

Всем привет 😄 Давно не виделись )) Я тут с новостью. Сижу я значить пью кофе и пишет мне моя знакомая. Короче они ищут Фронтенд разработчика себе в команду. Ну я и сказал что напишу пост у себя в канале, помогу им с поиском 😄 Как я понял опыт не важен. Кому интересно, пишите ей @Davtyanka А я дальше пить кофе ☕️ 😄

Runtime в node js Node.js - это среда выполнения, которая позволяет выполнять JavaScript-код вне браузера. Это означает, что вы можете создавать серверные приложения на JavaScript, запускать скрипты локально на вашем компьютере и многое другое. Когда мы говорим о времени выполнения (runtime), мы обычно имеем в виду период времени, в течение которого запущенная программа выполняется на компьютере. Это может быть период времени с момента запуска программы до ее завершения, или период времени, когда программа работает в фоновом режиме. В JavaScript время выполнения начинается с момента запуска скрипта в браузере и заканчивается, когда скрипт завершает свое выполнение. Во время выполнения, интерпретатор JavaScript обрабатывает код, интерпретируя его строки по одной, и выполняет инструкции, которые он находит. Например, если мы создадим функцию в JavaScript, она не будет выполнена, пока мы не вызовем ее в нашем коде. Пример кода JavaScript:

function multiply(a, b) {
  return a * b;
}

// вызываем функцию multiply и сохраняем результат в переменную result
const result = multiply(10, 5);

// выводим результат в консоль
console.log(result);

Таким образом, время выполнения программы (runtime) в JavaScript - это период времени, в течение которого программа выполняется, включая выполнение функций и других инструкций.

Что такое примитивные типы данных в javascript ? Попробую дать свою формулировку, на сколько это получится 😁 Итак, примитивы - это данные, которые не являются объектом и не имеют методов. В JavaScript существует 8 основных типов данных. Семь из них называют «примитивными» типами данных:

number
bigint
string
boolean
null 
undefined
symbol

И один не является «примитивным» и стоит особняком:

object

Очень важно понять!!! Все примитивы неизменяемы, то есть они не могут быть изменены. Важно не путать сам примитив с переменной, которой присвоено значение примитивного типа. Переменной может быть переприсвоено новое значение, но существующее значение примитивного типа не может быть изменено подобно объектам, массивам и функциям. Пример для понимания:

let bar = "abc"
console.log(bar) // abc

// Примитив не изменился
bar.toUpperCase()
console.log(bar) // abc

// Присваиваем новой переменной
let bar2 = bar.toUpperCase()
console.log(bar2) // ABC

// А теперь массивы
let foo = []
console.log(foo) // []
foo.push("plugh")
console.log(foo) // ["plugh"]

Примитив может быть заменён, но он не может быть напрямую изменён. И напоследок. За исключением null и undefined, все примитивные значения имеют объектный аналог, который оборачивает значение примитивного типа:

String для string примитива.
Number для number примитива.
BigInt для bigint примитива.
Boolean для boolean примитива.
Symbol для symbol примитива.

Задача: Создайте функцию, принимающую положительное целое число от 1 до 3999 (оба включены) в качестве параметра и возвращающую строку, содержащую представление этого целого числа римскими цифрами. Современные римские цифры записываются путем выражения каждой цифры отдельно, начиная с самой левой цифры и пропуская любую цифру со значением ноль. Римскими цифрами обозначается 1990 год: 1000=М, 900=СМ, 90=ХС; в результате получается MCMXC. 2008 год записывается как 2000=ММ, 8=VIII; или ММВIII. В 1666 году каждый римский символ используется в порядке убывания: MDCLXVI. Пример:

solution(1000); // should return 'M'

Помощь: Symbol Value I 1 V 5 X 10 L 50 C 100 D 500 M 1,000 Делитесь в комментариях что у вас получилось

Дорогие программисты! 👨‍💻 Поздравляю вас с Новым годом! 🎄 Желаю, чтобы в этом году ваш код стал ещё более чистым и эффективным. Пусть в новом году каждый из вас станет мастером кодинга! 🦸‍♂️ Желаю вам, чтобы все ваши баги были только смешными 😄 и забавными, а не критическими. Пусть ваши репозитории наполняются не только кодом, но и позитивными эмоциями, а каждый merge request будет сопровождаться улыбками и хорошим настроением. 😊