Задать вопрос
Ответы пользователя по тегу JavaScript
  • Как сделать, что бы данная функция выполнялась последовательно?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Promise.all() дождётся выполнения всех.
    Promise.all(
      id_contacts.map(id =>
        axios
          .post('api/add_contact', { id })
          .then()
          .catch(console.error)
      )
    )
      .then(resultsArray => {
        axios.post('api/bizproc', { contacts: resultsArray });
      })
      .catch(console.error);
    [warning] запросы контактов отправятся почти одновременно / параллельно, что может быть проблемой при большом их числе. Поэтому стоит продумать последовательные пачки параллельных запросов, если контактов там может быть больше, скажем, 10.
    Ответ написан
    Комментировать
  • Как правильно реализовать нажатые на кнопку?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Просто табы с вашей разметкой примерно так можно сделать:


    Наверное, там должно быть иначе: первая кнопка "all" должна показывать вообще все, а остальные – фильтровать какую-то часть по классам. Но как спросили, так и вот..
    Ответ написан
    Комментировать
  • Как сделать цикл кликов на JS?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    let i = 1;
    const trigger = () => {
      document.getElementById('id' + i).click();
      if (++i > 5) i = 1; // 1..5
      setTimeout(trigger, 1000);
    }
    
    trigger();

    Ответ написан
    Комментировать
  • Как использовать переданную функцию с локальными переменными?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Можно не переменной, а свойством объекта держать это «локальное значение», и обращаться к свойству this:
    const G = {
      boo: function() {
        console.log(this.x);
      },
    };
    
    function A() {
      let x = 'XXX';
      const obj = { x, extraparams: { overwriteFunc: () => {}, }, };
    
      // перезаписывание. Если typeof obj[prop] == 'function'
      obj.extraparams.overwriteFunc = G.boo.bind(obj);
    
      // вызов
      obj.extraparams.overwriteFunc();
    }
    
    A(); // 'XXX'
    Ответ написан
  • Как удалять класс active у прошлого элемента?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    сначала у всех удалите класс,
    потом добавьте его кликнутому.

    Можно каждый раз выполнять поиск и удалять только у тех, где класс есть:
    document.querySelectorAll('tr.active').forEach(el => el.classList.remove('active'));
    Ответ написан
    3 комментария
  • С помощью чего задается сайт с возможностью авторизации?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Авторизация только на фронте имеет мало смысла (на фронте подделывается всё) – нужен ещё бэкенд, который сможет независимо проверять авторизацию.

    Так как хотите хранить тудушечки для разных аккаунтов, хранить тоже надо будет не в браузере, а на бэкенде.

    Если это учебный проект, можно не пилить собственный бэкенд, который надо ещё и хостить где-то, а ограничиться авторизацией ВКонтакте. Сделать приложение, которое будет авторизовывать пользователя и хранить его список TODO в storage ВК — простое key-value хранилище. Так можно будет зайти с любого устройства, и видеть все свои делишки.

    Создать мини-апп, без React и VK-UI — понадобится только компонент VK Bridge для авторизации и взаимодействия в ВК API.
    Ответ написан
    Комментировать
  • Do while цикл в чём разница?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    let и const объявляют переменные/константы с блочной областью видимости.

    Во втором варианте объявление let a делает её видимой только внутри фигурных скобок do { }.
    Снаружи скобок идёт обращение к другой, необъявленной переменной a.
    Ответ написан
    1 комментарий
  • Как определить что запрос к api пришел с клиента?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Отдавая фронт, сервер может установить в нём уникальное значение ключа, и требовать именно это же значение в запросах к api. Скажем, в HTTP-заголовках запроса. Если нет ключа – запрос отклонять.

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

    Но и это никак не защищает от того, что получив код фронта, «злодей» не станет выполнять запросы с этим ключом из своих скриптов. Уточните вашу задачу, чего хочется добиться.

    Авторизация пользователя — этот вариант вполне. Чел логинится на бэке и получает уникальный временный ключ, ассоциированный с его аккаунтом.

    Ограничение по частоте запросов к API тоже с ключом решается.
    Ответ написан
    2 комментария
  • Как понять следующее выражение на JS?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Код можно расписать подробнее примерно так:
    var e;
    var r = t.length;
    var n = '';
    var i = 0;
    var s = 0;
    var a = 0;
    // for (; i < r; ) {
    while (i < r) {
      s = t.charCodeAt(i);
      if (s < 128) {
        n += String.fromCharCode(s);
        i++;
      } else {
        if (s > 191 && s < 224) { 
          // это заглавные кириллические буквы в Win1251
    
          a = t.charCodeAt(i + 1);
          // дальше код оборвался, приведён не полностью
        }
      }
    }
    фрагмент кода приведёт не полный, поэтому и «распаковка» не полна.
    Ответ написан
    5 комментариев
  • Как в localstorage вывести больше одной записи?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    держать тудусы в массиве.

    Сохранять массив (JSON-сериализованный).

    const lsKey = 'todo items';
    
    // в самом начале посмотреть, есть ли сохранённые данные?
    const data = JSON.parse(localStorage.getItem(lsKey)) || [];
    
    // добавление нового
    const item = { id: 123, name: 'aaa', title: 'bbb' };
    data.push(item);
    localStorage.setItem(lsKey, JSON.stringify(data));
    Ответ написан
  • В коде не удаётся заставить отработать третий условный оператор else if в методе start. Как переиначить условие, что бы заработало?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    у вас в одном if .. else if объединены проверки двух независимых переменных.

    if (Car.started === false && Car.fuel > 0) {
      // и строго равно false, и fuel больше 0
    } else if (Car.started && Car.fuel <= 0) {
       // сюда попадают не прошедшие первый if
      // и к тому же соответствующие второй проверке started && fuel <= 0
    }
    // никуда не попадут:
    // Car.started = undefined (не строго false, но и не переводится в true
    // Car.started === false, но и fuel > 0
    Ответ написан
  • Как сделать калькулятор для расчета страховки?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    По событию изменения селекта или чекбокса, всё перерасчитывать:
    Ответ написан
    8 комментариев
  • Как передать значение из тега H3 в модальную форму?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    функцию swa() забыли привести, как вы начали её писать?

    В неё перым аргументом попадёт объект Event, у которого есть свойство target – элемент, по которому кликнули. В данном случае это тег <a>

    Для этого элемента можно найти родителя (свойство parent) – это div. А в нём уже найти элемент H3:
    const title = event.target.parent.querySelector('h3').innerText;
    Ответ написан
    Комментировать
  • Как получить доступ к глобальной переменной из функции?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Всё дело во времени.
    Массив объявляется и сразу доступен, пустой.
    Запрос отправляете сразу.
    И ожидаете результатов тут же, сразу же — вот это ошибка.

    Ответ на запрос приходит не сразу, а (много) позже. Асинхронно. Обращаться к «глобальному» массиву есть смысл только после получения ответа.

    Поэтому откройте удивительный мир промисов!
    Ну, или просто вызывайте отрисовку таблицы redraw_table() в коллбэке по успешному завершению выполнения запроса.
    Ответ написан
    1 комментарий
  • Как сгруппировать id объектов, у которых совпадают остальные свойства?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Нет смысла выделять первый id как особый, и добавлять к нему в массив match другие похожие — все id с одинаковыми прочими значениями равноправны. Поэтому предлагаю как результат просто массивы, где собраны id с совпадающими свойствами.

    Понадобится хэш из ключей, исключая id, упорядоченных по алфавиту, и значений. Этот отпечаток будет одинаков у совпадающих объектов, несмотря на разные id (и разный порядок ключей).

    Получаем объекты { id, hash }, затем составляем «словарь», где ключи – хэши, а значения – Set'ы с id, у которых оказался одинаковый хэш. Set'ы – чтобы не повторялись одинаковые id.

    Потом остаётся из этих Set'ов сделать обычные массивы.
    const arr = [
      { id: 1, we: 'cn', le: null },
      { id: 2, le: null, we: 'cn' },
      { id: 3, we: 'cn', le: 'car' },
      { id: 1, we: 'cn', le: null },
    ];
    
    const dict = arr
      .map(({ id, ...obj }) => {
        const keys = Object.keys(obj).sort();
        const ordered = keys.reduce((acc, c) => {
          acc[c] = obj[c];
          return acc;
        }, {});
        return { id, hash: JSON.stringify(ordered) };
      })
      .reduce((acc, c) => {
        (acc[c.hash] ??= new Set()).add(c.id);
        return acc;
      }, {});
    
    Object.values(dict).map(s => [...s]); // [ [1, 2], [3] ]
    Ответ написан
    9 комментариев
  • Как исправить код, чтобы он заработал?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    HTML отдельно, JS отдельно.
    Слушателей событий добавлять через addEventListener()
    Забыть про document.write(). Вместо этого использовать element.innerText = "Хабр"; например.
    Обновлять запись баланса понадобится из двух разных мест: в начале, и при каждом выигрыше. Поэтому – в функцию.

    Ответ написан
  • Как импортировать все export default файлы из папки?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    «Кроме импорта каждого» стандартных вариантов нет.

    Можно сделать в папке index.js, в который таки прописать каждый файл в папке.
    // papka/index.js
    import a from './a';
    import b from './b';
    // ...
    
    export { a, b, };


    Зато потом удобно
    // main.js
    import * as Papka from '/papka';
    
    const { a, b } = Papka;
    console.log(a, b);
    
    // или
    Object.entries(Papka).forEach(([key, value]) => console.log(key, value));
    Ответ написан
    1 комментарий
  • Как выполнить последовательно функцию js?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    async/await тут лишний, достаточно просто
    const get_element_list = id => {
      return axios({
        url: `${url_hook}/lists.element.get.json`,
        method: 'post',
        data: {
          IBLOCK_TYPE_ID: 'lists',
          IBLOCK_ID: 17,
          filter: {
            PROPERTY_70: 1,
            PROPERTY_74: id,
          },
        },
      }).then(response => {
        const result = response.data.result[0];
        console.log(result, response.status, response.data); // посмотрите, что тут
      });
    };
    Ответ написан
    Комментировать
  • Как записать надпись на кнопке в cookies?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Сохранять удобнее не в куках, а в localStorage.

    Нужна модель данных. Есть кнопки, у каждой, наверное, уникальный id. На случай, если их перемешают иначе, или добавится новая — полагаться только на порядковый номер в коллекции, i, не годится: сейчас на 3-м месте одна кнопка, завтра окажется другая, а мы для неё запомнили включённое состояние.

    Итак, есть кнопки с уникальными id. Кнопка может быть добавлена или не-добавлена в избранное. Булево значение: true или false. Запоминать будем набор пар ключ-значение. Ключ id, значение true/false. Что-то типа { "abc123": true, "xyz789": false, }

    При загрузке страницы проверить, есть ли сохранённый комплект? Применить его. Остальным кнопкам значение по-умолчанию.

    При любом изменении кнопок — сохранять обновлённую коллекцию.

    Надписи показывать исходя из true/false в этой коллекции.
    Ответ написан
    Комментировать
  • Интересная задача на js?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Решение не верно, т.к. расчитывает только на эти 4 имени. Что, если там будут другие?

    Алгоритм:
    1. составить объект, где ключи – имена, а значения – счётчики, сколько раз имя встретилось.
    2. после полного подсчёта, найти максимум и минимум счётчиков.
    3. собрать имена, у которых счётчик равен максимуму или минимуму. Каждого, теоретически, может оказаться больше одно, поэтому – в массивы имён.
    4. пройти по всем ключам объекта со счётчиками, и исключить имена, которые есть среди макс и мин. – останутся «остальные».


    spoiler
    const mostLeastAndTheRest = names => {
      const dict = names.reduce((acc, name) => ((acc[name] ??= 0), acc[name]++, acc), {});
      // { "Женя": 3, "Иван": 1, "Виктор": 4, "Константин": 1 }
    
      const values = Object.values(dict);
      const max = Math.max(...values);
      const min = Math.min(...values);
    
      const entries = Object.entries(dict);
      const winners = entries.filter(([_, value]) => value === max).map(([key, _]) => key);
      const losers = entries.filter(([_, value]) => value === min).map(([key, _]) => key);
      const rest = Object.keys(dict).filter(name => !winners.includes(name) && !losers.includes(name));
      return { winners, losers, rest };
    };
    
    mostLeastAndTheRest(['Женя', 'Женя', 'Иван', 'Женя', 'Виктор', 'Виктор', 'Константин', 'Виктор', 'Виктор']);
    /*
    {
      "winners": [ "Виктор" ],
      "losers": [ "Иван", "Константин" ],
      "rest": [ "Женя" ]
    }
    */


    Ещё вопрос — особый случай, если всех одинаковое число, то все – «победители» или «проигравшие» ?
    Ответ написан
    1 комментарий