Как переписать код на более современный JS?

Ссылка скопирована
1 ответ

Здравствуйте! Подскажите пожалуйста как переписать код на более современный код JS. Делаю менюшку для сайта и изучаю JS нашел такой код он работает, при клике добавляет 2 динамических класса на 2 разных блока, но пишут на форуме что код устаревший. Как исправить?

const menu = document.querySelector('.burger-menu').onclick = function() {     document.querySelector('.menu__list').classList.toggle('active-menu')     document.querySelector('.burger-menu').classList.toggle('active'); };

const menu = document.querySelector('.burger-menu').onclick = function() { document.querySelector('.menu__list').classList.toggle('active-menu') document.querySelector('.burger-menu').classList.toggle('active'); };

Дополнительно:

Всё с этим кодом в плане "современности" нормально.
А вот в плане читаемости и переиспользования - нет.

Можно например вот так переписать:

const menu = document.querySelector('.burger-menu'); const menuList = document.querySelector('.menu__list'); const activateMenu = () => (menuList.classList.toggle('active-menu'), menu.classList.toggle('active'));  menu.addEventListener('click', activateMenu, true);

const menu = document.querySelector('.burger-menu'); const menuList = document.querySelector('.menu__list'); const activateMenu = () => (menuList.classList.toggle('active-menu'), menu.classList.toggle('active')); menu.addEventListener('click', activateMenu, true);

Подскажите пожалуйста как переписать код на более современный код JS.

Зачем?

нашел такой код он работает, при клике добавляет 2 динамических класса на 2 разных блока

Не добавляет, а переключает.

но пишут на форуме что код устаревший

На заборе пишут, что пора прыгать из окна.

Как исправить?

addEventListener()

Ответы:

Может они что-то типо этого ждут:

const menu = document.querySelector('.burger-menu').addEventListener('click', () => {     document.querySelector('.menu__list').classList.toggle('active-menu')     document.querySelector('.burger-menu').classList.toggle('active'); });

const menu = document.querySelector('.burger-menu').addEventListener('click', () => { document.querySelector('.menu__list').classList.toggle('active-menu') document.querySelector('.burger-menu').classList.toggle('active'); });

Нужно решить такую задачу?

Опишите проблему, и специалист поможет с настройкой, исправлением ошибки или доработкой сайта. Подберём понятный план работ без лишней переписки.

Заказать помощь
Лучший ответ
1
Стас DB Ответ

Для переписывания кода на более современный JavaScript можно использовать современные возможности и синтаксис ES6 (ECMAScript 2015) и более поздних версий. Ниже приведен пример простого кода на JavaScript, который можно переписать с использованием новых возможностей:

Исходный код на JavaScript:

function add(a, b) {
  return a + b;
}
 
var result = add(2, 3);
console.log(result);

function add(a, b) { return a + b; } var result = add(2, 3); console.log(result);

Переписанный код с использованием стрелочной функции и деструктуризации:

const add = (a, b) => a + b;
 
const result = add(2, 3);
console.log(result);

const add = (a, b) => a + b; const result = add(2, 3); console.log(result);

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

Если у вас есть конкретный код, который вы хотели бы переписать на более современный JavaScript, пожалуйста, предоставьте его, и я помогу вам с переписыванием.

Другие ответы (0)

Пока нет других ответов. Будьте первым, кто поможет автору.

Ответить на вопрос

комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *

Вам также может быть интересно