UUIDv7
или в простонароден Ulid
, которые имеет все плюсы целого числа (всегда будут вставляться друг за другом и не приведут к фрагментации данных. Ваш вариант как раз таки к таким проблемам и приведёт, и это одна из проблем) и гарантирует, что не будет повторов. const container = document.querySelector('.container');
const line = document.querySelector('.invisibility');
const marginBottom = line.getBoundingClientRect().top - container.getBoundingClientRect().bottom;
const options = {
root: document.querySelector('.container'),
rootMargin: `0px 0px ${marginBottom}px 0px`,
threshold: 0
}
const callback = function(entries, observer) {
entries.forEach((entry) => {
entry.target.style.background = entry.isIntersecting ? 'green' : 'red';
});
};
const observer = new IntersectionObserver(callback, options);
container.querySelectorAll('.item').forEach(item => {
observer.observe(item);
});
arr.map(item => Object.fromEntries([item]))
const resultArr = [];
for (let i = 0; i < arr.length; i++) {
const item = arr[i];
const obj = {};
obj[item[0]] = item[1];
resultArr.push(obj);
}
const resultArr = [];
for (let [prop, value] of arr) {
const obj = { [prop]: value };
resultArr.push(obj);
}
const arrs = [ arr1, arr2 ];
.const result = arrs.reduce((acc, n) => (
n.forEach((m, i) => Object.assign(acc[i] ??= {}, m)),
acc
), []);
function* zip(data, defaultValue = null) {
const iterators = Array.from(data, n => n[Symbol.iterator]());
for (let doneAll = false; doneAll = !doneAll;) {
const values = [];
for (const n of iterators) {
const { value, done } = n.next();
values.push(done ? defaultValue : value);
doneAll &&= done;
}
if (!doneAll) {
yield values;
}
}
}
const result = Array.from(zip(arrs), n => Object.assign({}, ...n));
<template>
— из него можно забирать готовый DocumentFragment, который клонировать и наполнять данными.const [ checked, setChecked ] = React.useState(false);
<input
type="checkbox"
checked={checked}
onChange={e => setChecked(e.target.checked)}
...
<button
disabled={!checked}
...
// tagName - Имя тега
// props - объект с свойствами DOM элемента
// children - массив с DOM элементами
function createElement (tagName, props = {}, children = []) {
const newDOMElement = document.createElement(tagName);
if (props) {
for (const prop in props) {
if (Object.prototype.hasOwnProperty.call(props, prop)) {
newDOMElement[prop] = props[prop];
}
}
}
if (children.length) {
children.forEach(child => {
newDOMElement.append(child);
});
}
return newDOMElement;
}
const body = document.body;
// Создаём новый DOM узел
const newDOM = createElement('div', null, [
createElement('h1', null, [
'Заголовок страницы'
]),
createElement('p', null, [
'Привет, Мир!'
]),
createElement('button', {
onclick: () => {
alert('бабах');
}
}, [
'Кликни меня'
])
]);
// Вставляем в body новый DOM узел
body.append(newDOM);
let previousTimer;
const startTimer = (word, delay, callback) => {
const timer = setInterval(
() => {
if (previousTimer !== timer) {
clearInterval(previousTimer);
previousTimer = timer;
}
callback();
},
delay
);
};
startTimer('t1', 280, () => console.log('cb t1'));
startTimer('t2', 1200, () => console.log('cb t2'));
startTimer('t3', 910, () => console.log('cb t3'));
// t1, t1, t1, t3, t2, t2, t2...
onClick(event) {
let action = event.target.dataset.action;
if (action) {
this[action]();
}
}
_elem
кладётся elem это загадка. #itemInner {
counter-reset: bullshit-counter;
}
.row {
counter-increment: bullshit-counter;
}
.row::before {
content: counter(bullshit-counter) "!!!";
}
itemInner.find('.item-num').text(i => i + 1);