Ответы пользователя по тегу JavaScript
  • Как решить задачу о возвращении в исходную точку?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Отдельно смотреть наборы чисел по осям.
    В одной оси задача расставить знаки так, чтобы сумма получилась нулевая.
    В примере по x: [1, 0, 1]
    Далее в общем виде – NP-полная задача об упаковке.
    В частном, если там только единицы и нули, проще: четное число единиц – есть решение (половине дать минусы).
    Ответ написан
    Комментировать
  • Почему меняются все значения массива, вместо каждого отдельно?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Одинаковые потому, что внутри .map() никак не используется значение очередного элемента el

    Всегда возращается одно и то же, приготовленное из констант twentyFourHours, minutesToAdjust, millisecondsPerMinute

    spoiler
    console.log(timestamps.map(ts => {
      const D = new Date(ts);
      D.setMinutes(D.getMinutes() + 36);
      return D.toISOString();
    }))
    Ответ написан
    2 комментария
  • Решение 1/n- Cycle?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Элегантное решение всё основано на этой строке.
    Поскольку интересует дробь 1 / n, сначала переменная val равна 1.
    Вспомните деление в столбик, десятичную запись числа.
    Первая цифра, поскольку n>1, всегда 0 целых. И далее идут дробные.
    Чтобы получить первую цифру после запятой, имеющийся остаток с предыдущего шага (1) умножаем на 10 и делим на n.

    Например, 1/7. Записываем
    0.
    остаток 1

    1 * 10 = 10, делим 10 / 7, получается 1 целая и 3/7
    Цифра 1 – первая после запятой (но она сама по себе в этой задаче никак не нужна), и остаток 3:
    0.1
    остаток 3

    Этот остаток далее опять умножим на 10 * 3 = 30 и опять поделим на 7, чтобы получить следующую цифру (4).
    И так далее.

    До тех пор, пока снова не появится единица – с неё мы начинали, значит, второе её появление уже новый виток цикла цифр.

    Для истории приведу
    текст задания на англ.
    Let be n an integer prime with 10 e.g. 7.
    1/7 = 0.142857 142857 142857 ....

    We see that the decimal part has a cycle: 142857. The length of this cycle is 6. In the same way:
    1/11 = 0.09 09 09 .... Cycle length is 2.

    Task
    Given an integer n (n > 1), the function cycle(n) returns the length of the cycle if n and 10 are coprimes, otherwise returns -1.

    Examples:
    cycle(5) = -1
    cycle(13) = 6 -> 0.076923 076923 0769
    cycle(21) = 6 -> 0.047619 047619 0476
    cycle(27) = 3 -> 0.037 037 037 037 0370
    cycle(33) = 2 -> 0.03 03 03 03 03 03 03 03
    cycle(37) = 3 -> 0.027 027 027 027 027 0
    cycle(94) = -1 
    
    cycle(22) = -1 since 1/22 ~ 0.0 45 45 45 45 ...
    Ответ написан
    2 комментария
  • Как упростить выравнивание высот нескольких элементов?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    const els = [...document.getElementsByClassName('yourself-item__title')];
    const maxHeight = els.reduce((acc, el) => Math.max(acc, el.clientHeight), 0);
    els.forEach(el => el.style.height = `${maxHeight}px`);
    Ответ написан
    1 комментарий
  • Как отследить изменение значения в переменной?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Если есть возможность изменить код создания этой переменной..
    Например, вместо
    var a = 'QnA.habr.com';
    написать
    Object.defineProperty(this, 'a', {
        set: function(v) {console.log('Изменяют!'); this.value = v;},
        value: 'QnA.habr.com'
    });
    то теперь любое изменение значения переменной вызовет панику в консоли:
    a = 'StackOver...';
    // Изменяют!


    Upd. выяснилось, вопрос был совсем про другое )
    Ответ написан
  • Как подгружать часть аудиофайла?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    HLS (HTTP Live Streaming) умеет такое. В запросе указывается время "от" и "до" и сервер возвращает нужный чанк.

    Есть модуль в nginx. Не знаю, работает ли это с mp3 или придётся перекодировать файл в m4a.
    Ответ написан
    Комментировать
  • Как считать кол-во повторяющихся эл-ов в массиве?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    let arr = [1,3,3,4,5,5,5];
    function count(arr){
      let cnt = 1; // один счётчик на все значения?
      let map = new Map();
      for(let i = 0; i< arr.length; i++){
        for(let j = 0; j< arr.length; j++){ // плохо, что на каждый элемент весь массив перебираете
          // получается, считаются все пары одинаковых на каждом проходе.
          if(arr[i] == arr[j]){ // здесь каждый раз найдётся равенство самому себе
              map.set(arr[i],cnt++); // а общий счётчик всё больше и больше
          }
        }
      } return map;
    }
    console.log(count(arr));


    Для решения задачи подсчёта не нужно вложенных циклов.
    Пройти по каждому элементу достаточно всего один раз.
    И внести в "словарь": 1, если ещё не было такого, или увеличить на 1, если уже было.

    исправленный ваш код
    let arr = [1,3,3,4,5,5,5];
    function count(arr){
      const map = new Map();
      const len = arr.length;
      for (let i = 0; i < len; i++) {
        const value = arr[i];
        if (!map.get(value)) map.set(value, 0); // создать счетчик
        map.set(value, map.get(value) + 1); // увеличить на 1
      }
      return map;
    }
    console.log(count(arr));
    /*
    Map(4)
      ​size: 4
      ​<entries>
    ​​    0: 1 → 1
    ​​    1: 3 → 2
    ​​    2: 4 → 1
    ​​    3: 5 → 3
    */
    Ответ написан
    Комментировать
  • Как проверить несколько input`ov с одинаковым классом на пустоту?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    function check() {
    	let filled = true;
    	$(".input_1").each(function() {
        if ($(this).val() == '') filled = false;
      });
      $('div').text(filled ? 'Все заполнены' : 'что-то пусто');
    }


    Ответ написан
  • Как написать тест на javascript?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Вот для вдохновения
    Ответ написан
    6 комментариев
  • Как повесить обработчик события на элемент который отрисовывается?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Делегирование событий

    повесьте слушатель событий на catalogList
    События клика будут пузыриком подниматься наверх, там и отловите )
    Ответ написан
  • Как правильно отфильтровать массив массивов объектов?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Если речь идёт только об уникальности свойства name, можно создать объект, где это свойство будет ключом, а последний встретившийся объект с этим свойством – значением. Более поздние объекты с повторным свойством nameперезаписывают собой более ранние. В конце остаётся вытащить все значения из этого объекта:
    Object.values(
      arr.reduce(
        (acc, c) => {
          c.forEach(o => acc[o.name] = o);
            // получается объект acc:
            //    "test":  {id: 1, name: 'test'},
            //    "test2": {id: 2, name: 'test2'},
            //    "test3": {id: 3, name: 'test3'},
            // ...
          return acc;
        },
        {}
      )
    );


    Update. в комментариях выснили, что требуется уникальность не одного, а набора свойств. Тогда принцип тот же, но в качестве ключа использовать некий хэш или отпечаток этих свойств.
    Самый простой вариант склеить строки значений. Но возможны коллизии типа {"name": "Stan", code: "dart"} и {"name": "Stand", code: "art"} — оба дадут отпечаток "Standart" и посчитаются идентичными.

    Немного лучше удалить из копии объекта св-во id, и перевести в JSON. Тут слабое место – порядок свойств. Если у одного из объектов свойства поменяют местами, алгоритм сочтёт их разными.
    Object.values(
      arr.reduce(
        (acc, c) => {
          c.forEach(o => {
            const source = Object.assign({}, o);
            delete source.id;
            const hash = JSON.stringify(source);
            acc[hash] = o;
          });
          return acc;
        },
        {}
      )
    );
    Ответ написан
  • Почему когда доходит до конца, требуется двойной клик и выдает ошибку?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    В вашем коде косяк в том значении, которое принимает i после обновления.
    Например, было 0.
    Нажали "Показать".i++, i++ // i === 2
    Нажали "Скрыть".
    Скрывается соответствующий текущему значению i===2 (0, 1, 2 - т.е. третий, он и так пока скрыт).
    i уменьшается на 1.
    Скрывается соответствующий нынешнему i===1 (т.е. второй, был видимым).
    И потом i становится равным 0. Остался видимым нулевой.
    Надеюсь, понятна причина видимости одного.
    Это лечится костылём: замените оба i-- на --i.
    Но это не устранит другой проблемы: i может уезжать в минус.

    Предлагаю держать переменную, определяющую сколько элементов сейчас видимы.
    И функцию, которая только исходя из этой переменной показывает/прячет нужное число элементов.
    код
    const divs = document.querySelectorAll('div')
    const length = divs.length;
    const btnShow = document.querySelector('.show')
    const btnHide = document.querySelector('.hide')
    
    function showVisible(visible) {
      const toShow = Math.min(visible, length);
    
      for (let i=0; i < length; i++) {
          divs[i].style.display = i < toShow ? 'block' : 'none';
      }
    }
    
    let visible = 0;
    showVisible(visible);
    
    btnShow.addEventListener('click', function () {
      visible = Math.min(visible + 2, length);
      showVisible(visible);
    });
    
    btnHide.addEventListener('click', function () {
      visible = Math.max(visible - 2, 0);
      showVisible(visible);
    });


    Ответ написан
    Комментировать
  • При загрузке кода выполняется функция которая указана в addEventListener без клика по кнопке. Как исправить?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Так ведь передаётся не функция function(){...}, а выражение users.sort(...)
    Выражение, которое сразу же выполняется, чтобы получилось значение. И вот это значение будет (?) обработчиком события клика. Т.е. в этом коде предлагается по клику не функцию выполнить, а сортированный массив – даже не знаю, что с ним делать.

    Чтобы не сразу, оберните код в .. кхм .. функцию!
    button.addEventListener('click', function() {
      users.sort(
        function(a, b){
          return b.age-a.age
        }
      )
    });
    
    // или покороче
    button.addEventListener('click', () => users.sort((a, b) => b.age - a.age));
    Так только по событию клика массив, наконец, отсортируют.
    Ответ написан
    Комментировать
  • Как передать значение константе без тернарного оператора?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Тернарное - выражение. Его можно использовать для инициализации константы.

    if - управляющая структура. Ничего не возвращает, ограничивает scope. Объявленная внутри нее константа наружу не выберется.

    Можно функцией:
    const example = (x => {
      if (x === 5) return "Tos";
      else return "ter";
    })(5);
    Ответ написан
    4 комментария
  • Как отработать нажатие для массива кнопок?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Делегирование событий.

    Можно только слушать события на общем родителе, и проверять, есть ли искомый класс в кликнутом элементе:
    Ответ написан
    Комментировать
  • Что лучше по производительность c массивами: поиск или хранить с по нужному индексу?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Для задачи, может, подойдут Set'ы (для уникальных значений)

    Напишите тесты на jsPerf.com для двух ваших вариантов и для сетов.

    Прогоните в разных браузерах, под разными ОС.
    Ответ написан
    Комментировать
  • Как сбрасывать результат в js?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    По изменению одного из чекбоксов обновлять вычисления:$('#annun1, #diff1').on('change', computeValue);

    Но вообще микрокредитование сродни мошенничеству. Не связывались бы..
    Ответ написан
    1 комментарий
  • Блокировка кнопки до ввода данных в input?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Нужно сделать функцию, которая будет проверять и включать/выключать кнопку.
    Вызывать её по кажому изменению в инпутах:
    // элементы
    const in_1 = document.getElementById("input_1");
    const in_2 = document.getElementById("input_2");
    const btn = document.getElementById("btn");
    
    // функция проверки и вкл/выкл кнопки
    const check = () => btn.disabled =
      in_1.value.length < 3  ||  in_2.value.length < 3;
    
    // проверять при изменении инпутов
    in_1.addEventListener('input', check);
    in_2.addEventListener('input', check);
    
    // проверить разок в самом начале
    check();


    Фиддл:

    Сделал чуть более реалистично: чтобы минимум по 3 символа было в каждом инпуте.
    Ответ написан
    Комментировать
  • Функция в качестве параметра?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Функция в JS – это тоже объект. Её можно назначить переменной, передать аргументом в другую функцию, вернуть как результат работы другой функции.

    // исходное определение:
    const flip(f) => (a, b) => f(b, a);
    
    // можно развернуть:
    function flip(sourceFunction) {
      return function(a, b) {
        return sourceFunction(b, a);
      }
    }
    Функция flip() принимает аргументом функцию. И возвращает новую функцию.

    Создаваемая-возвращаемая функция вызывает исходную с аргументами наоборот.

    можно разжевать
    function flip(f) {
      // ура, нам дали какую-то исходную функцию!
      var sourceFunction = f; // для красоты запишем её в свою переменную
      // можно и вызвать её при желании:  sourceFunction(4, 5)
      // но пока не будем. Рано. Ждём.
    
      // сделаем новую, хакерскую функцию
      var hackerFunc = function(a, b) {
        // тут пусть всю работу делает старая функция
        var result = sourceFunction(a, b);
    
        // стоп. Не то. Надо же аргументы местами поменять
        var result = sourceFunction(b, a);
    
        // хакерский результат
        return result;
      } // конец определения хакер-функции
      
      // вернём теперь хакер-функцию:
      return hackerFunc;
    }
    Вот как flip(f) возващает новую хитрую хакерскую функцию.

    Ответ написан