Алексей Уколов

А как вы код написали, если не можете понять, как он работает?

Вы открывали документацию функции, читали, что она делает и какие аргументы принимает?
Ну, давайте я вам её сюда скопирую:

Parameters
indexStart
The index of the first character to include in the returned substring.
indexEnd Optional
The index of the first character to exclude from the returned substring.
Description
If indexStart < 0, the index is counted from the end of the string. More formally, in this case, the substring starts at max(indexStart + str.length, 0).
If indexEnd < 0, the index is counted from the end of the string. More formally, in this case, the substring ends at max(indexEnd + str.length, 0).

зачем нужен (-2, -1)

Для выполнения вот этого условия задачи: "если слово заканчивается на мягкий знак, то получите предпоследнюю букву". Я искренне не понимаю, что тут можно добавить...

Ошибка первая: вы в sliceHandler передаёте div-обёртку, а внутри функции думаете, что это какой-то его ребёнок.
Ошибка вторая: вы пытаетесь получить реактовское служебное свойство key через атрибут html-тега. Значение key даже через props нельзя получить, не говоря уже про html.

Давайте вы своими словами опишете, чего хотите добиться и зачем, а мы вам подскажем, как это сделать правильно.

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

"Говорите" про них ровно так же, как про обычные. Когда окажется важным, что это именно стрелочная функция (а это бывает довольно редко), так и уточняйте.

Самое простое и надёжное - проверять наличие элемента каждые N секунд (например, 5):

setInterval(function () {
  const $element = document.querySelector("#content > div > div.taskblackout");

  if ($element && $element.style.display === 'block') {
    document.location.reload()
  }
}, 5000);

Единственный минус этого решения - задержка. Элемент может появиться сразу после срабатывания и провисит эти N секунд.
Ещё, если вы часто уходите с этой вкладки, может накопиться очередь из интервалов - в этом случае лучше заменить на setTimeout, который внутри будет вызывать следующий setTimeout:

const check = () => {
  const $element = document.querySelector("#content > div > div.taskblackout");

  if ($element && $element.style.display === 'block') {
    document.location.reload()
  } else {
    setTimeout(check, 5000);
  }
};

setTimeout(check, 5000);

Почему бы не получать кнопку просто через event.target? А this прибить к вашему объекту.

Очевидно, что входящий --test и --test в объекте не равны. Пробелы там, спецсимволы, ещё что-то. Другого варианта просто нет.

Обработчиков у вас в любом случае 200 вешается.
Вся разница в том, что в первом случае они ссылаются на двести функций, а во втором на одну.
Создание функции требует определённых ресурсов, поэтому оверхед есть. Будет ли он заметным — это другой вопрос. Ответ на него зависит от того, что на самом деле в вашем коде происходит. На компьютере вы, скорее всего, разницы никогда не почувствуете, а вот на очень слабом телефоне при огромном количестве функций может начать тормозить.

P.S. Проще использовать делегирование в таких случаях.

Предполагаю, что есть какая-то возможность на этапе проверки IP-адреса в условии if-else прервать выполнение показа страницы и показать ее после прохождения капчи.

Нет такой возможности.

Вариантов развития событий два:

1. Вы используете неверное сравнение. Например, у вас в target.innerHTML есть пробелы по краям, или какие-то теги, или не совпадает регистр.
   
2. Условие срабатывает верно, но поскольку вы меняете стиль одного и того же элемента, вы не учитываете предыдущие или последующие итерации.
   

Сделайте пример в песочнице и мы вас скажем точно, в чём проблема.

Метода нет, но полно библиотек, которые это делают. Но можно и самостоятельно вот к такой простой конструкции привести исходную строку: +new Date('2024', +'02' - 1, '01') / 1000.

Никак, вы чего-то очень странного хотите. Квадратные скобки используются для работы с объектом (получение или изменение значений его свойств), через них никак нельзя изменить значение переменной, которую вы в скобках используете.
Если вы хотите получить «50», то это делается так: info['10']['5'][propName]

Вы пытаетесь в качестве имени свойства использовать объект, а JS разрешает там только строки.
Объект приводится к строке и ваш код превращается в итоге вот в это:

dwayne['[object Object]'] = 123;
dwayne['[object Object]'] = 456;

console.log(dwayne['[object Object]']);

Думаю, тут уже понятно, почему результат именно такой.

При этом, если бы вы использовали другой синтаксис, то и результат был бы другим:

dwayne.daniel = 123; // аналог dwayne['daniel']
dwayne.jason = 456; // аналог dwayne['jason']

console.log(dwayne.daniel);

Но эти daniel и jason никак не связаны с одноимёнными объектами выше.

Метод querySelectorAll возвращает коллекцию элементов и у неё нет свойства onclick, метода addEventListener и т.п.
По коллекции нужно итерировать и назначать обработчик события для каждого элемента в отдельности.
Как это сделать, написано в каждом первом учебнике JavaScript.

Не является. Массив используется на хранения списка значений, в нём нет никаких "имён".
Значения с "именами" можно хранить либо в объекте, либо в специальном типе Map.

Но при этом, если речь про значения примитивных типов, то при их добавлении в объект или Map теряется связь с изначальной переменной, откуда значение было взято.

let a = 3;
let b = 15;

let one = {};

one.a = a;
one.b = b;

a = 42;

console.log(one.a, one.b); // 3, 15
console.log(a, b); // 42, 15

let a = 3;
let b = 15;

let two = new Map();

two.set('a', a);
two.set('b', b);

a = 42;

console.log(two.get('a'), two.get('b')); // 3, 15
console.log(a, b); // 42, 15

Вам нужно вернуться к учебнику и научиться понимать код на базовом уровне, иначе вы с каждой строчкой сюда бегать будете.
В функции onSubmit вы вызываете addReservationAsync с двумя аргументами: requestServer и объект с кучей полей. А addReservationAsync ожидает 6 аргументов (то есть не объект, а каждое значение отдельно).

Вы указали аргумент функции и таким образом перезаписали переменные из скоупа выше. Нужно так:

const onSubmit = () => {
	console.log("rc", userId, roomId, options, arrivalDate, leavingDate);
	dispatch(
		addReservationAsync(requestServer, {
			userId,
			roomId,
			options,
			arrivalDate,
			leavingDate,
		}),
	);
	setNewReservation("");
};

Чтобы начать слушать событие (scroll) только при наступлении другого события (btnUp). Неужели это не очевидно?

Нужно дополнительно триггерить событие изменения (change, input и т.п.), на которое, очевидно, подписаны другие скрипты на странице: https://developer.mozilla.org/en-US/docs/Web/Event...

«Он берёт» сначала первый символ, потом второй и так далее. Всё дело в том, куда он этот символ подставляет — каждый раз в начало новой строки, поэтому она и получается перевёрнутой.

Опишите свою реальную задачу, потому что сейчас непонятно, чего именно вы хотите добиться, и из-за этого нельзя дать какой-то адекватный ответ.

Вы хотите полностью отказаться от React и перейти на более «простые» инструменты? Скорее всего, это невозможно — если используется React, то у вас сложные динамические интерфейсы и никакими автоматическими средствами переписать их на ванильный js не выйдет — только руками. Но это будет требовать знаний куда больших, чем просто использование React.

Если же вы хотите отказаться от JSX, но оставить React, то это автоматизировать уже можно, но задача очень странная.