Подробная статья
22 Oct, 08:59
21 Oct, 15:00
23 May, 08:44
IntersectionObserver
- это мощный браузерный API, который позволяет асинхронно наблюдать за пересечением элемента (target) с его родителем (root) или областью просмотра (viewport). Другими словами, этот API обеспечивает вызов определенной функции каждый раз при пересечении целевого элемента с root или viewport.IntersectionObserver
необходимо с помощью конструктора создать объект-наблюдатель с двумя параметрами - функцией обратного вызова и настройками:const observer = new IntersectionObserver(callback, options)
IntersectionObserverEntry
, каждый из которых содержит информацию о пересечении одного элемента.const observer = new IntersectionObserver(entries => {
entries.forEach(entry => {
const intersecting = entry.isIntersecting
entry.target.style.backgroundColor = intersecting ? "blue" : "orange"
})
})
observer.observe(document.getElementById("test"))
14 May, 17:11
04 May, 12:43
20 Apr, 08:45
23 Feb, 06:01
JavaScript-код
вне браузера. Это означает, что вы можете создавать серверные приложения на JavaScript
, запускать скрипты локально на вашем компьютере и многое другое.JavaScript
время выполнения начинается с момента запуска скрипта в браузере и заканчивается, когда скрипт завершает свое выполнение. Во время выполнения, интерпретатор JavaScript
обрабатывает код, интерпретируя его строки по одной, и выполняет инструкции, которые он находит.JavaScript
, она не будет выполнена, пока мы не вызовем ее в нашем коде.function multiply(a, b) {
return a * b;
}
// вызываем функцию multiply и сохраняем результат в переменную result
const result = multiply(10, 5);
// выводим результат в консоль
console.log(result);
JavaScript
- это период времени, в течение которого программа выполняется, включая выполнение функций и других инструкций. 22 Feb, 08:21
примитивы
- это данные, которые не являются объектом
и не имеют методов
.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 примитива.
03 Jan, 16:31
solution(1000); // should return 'M'
Symbol Value
I 1
V 5
X 10
L 50
C 100
D 500
M 1,000
31 Dec, 16:23
Поздравляю вас с Новым годом!
🎄баги были только смешными
20 Oct, 09:05
event.stopImmediatePropagation()
используется для предотвращения распространения события вверх по DOM дереву, однако он имеет более сильный эффект, чем event.stopPropagation()
. Кроме того, что он предотвращает распространение события к вышестоящим элементам, он также останавливает вызов других обработчиков событий для текущего элемента.event.stopImmediatePropagation()
:document.getElementById('inner').addEventListener('click', function(event) {В этом примере, при клике на элемент с id "inner", обработчик первого события будет вызван и выведет в консоль сообщение "Inner element clicked". Однако, обработчик второго события не будет вызван из-за использования
event.stopImmediatePropagation(); // Предотвращаем распространение события и вызов других обработчиков
console.log('Inner element clicked');
});
document.getElementById('inner').addEventListener('click', function(event) {
console.log('Additional inner element click handler');
});
document.getElementById('outer').addEventListener('click', function(event) {
console.log('Outer element clicked');
});
event.stopImmediatePropagation()
. Таким образом, ожидаемый вывод будет только "Inner element clicked" без вывода "Additional inner element click handler" или "Outer element clicked".event.stopImmediatePropagation()
, так как это метод остановит вызов обработчиков, зарегистрированных после него для текущего элемента.event.stopPropagation()
и event.stopImmediatePropagation()
заключается в том, что первый метод предотвращает распространение события только вверх по DOM дереву, в то время как второй метод предотвращает как распространение события вверх по дереву, так и вызов других обработчиков событий для текущего элемента. 19 Oct, 06:47
Proxy
является мощным инструментом в JavaScript, который позволяет создавать объекты-обертки и предоставляет полный контроль над поведением этих объектов при доступе к ним и изменении их свойств.Proxy
- обеспечить перехват и кастомизацию операций на объекте, таких как чтение (get
), запись (set
), удаление (deleteProperty
) и других. Это позволяет нам создавать ловушки для операций и добавлять дополнительную логику в обработку объектов.const obj = {В этом примере мы создали объект
name: 'John',
age: 30
} ;
const proxy = new Proxy(obj, {
get(target, property) {
console.log(`Чтение свойства ${property}`);
return target[property];
},
set(target, property, value) {
console.log(`Запись свойства ${property} со значением ${value}`);
target[property] = value;
}
});
console.log(proxy.name); // Вывод: Чтение свойства name, Значение: John
proxy.age = 40; // Вывод: Запись свойства age со значением 40
console.log(proxy.age); // Вывод: Чтение свойства age, Значение: 40
console.log(obj.age); // Вывод: 40 (изменение значения age было отражено в оригинальном объекте)
obj
и создали его обертку с помощью Proxy
. Затем мы определили ловушки get
и set
для перехвата чтения и записи свойств объекта. Когда мы обращаемся к свойствам обернутого объекта через proxy
, ловушки выполняются, и мы можем добавить дополнительную логику перед выполнением операций. 17 Oct, 06:50
"a b c" --> ["b"]
"a bcs d k" --> ["d"]
" a b sc p t k" --> ["p"]
"a b c de" --> ["b", "c"]
" a b c de " --> ["b"]
"abc" --> ["a", "b", "c"]
Ответы пишите в комментах 🙂 27 Jul, 06:02
const person = { firstName: 'John', lastName: 'Doe' }
Нужно чтобы этот объект, как то магическим образом стал массивом 🙂function objectToArray(obj) {
return Object.entries(obj)
}
Вызываем функцию:const personArray = objectToArray(person)
26 Jul, 08:50
accum("abcd") -> "A-Bb-Ccc-Dddd"
accum("RqaEzty") -> "R-Qq-Aaa-Eeee-Zzzzz-Tttttt-Yyyyyyy"
accum("cwAt") -> "C-Ww-Aaa-Tttt"
26 Jul, 07:47
function isNumber(param) {2 способ
return Number.isFinite(param);
}
function isNumber(param) {3 способ
return !isNaN(param);
}
function isNumber(param) {
return typeof param === "number";
}