Задать вопрос
Ответы пользователя по тегу JavaScript
  • Как бы выглядел данный код с тернарным оператором?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Если исход одинаковый, можно условия комбинировать логическими операторами.
    В данном случае логическим ИЛИ ||
    const year = prompt('В каком году появилась спецификация ECMAScript-2015?');
    alert( year == '2015' || year == '2016' ? 'правильно' : 'неправильно' );
    Ответ написан
    2 комментария
  • Случайные числа с заданной сумой, какой алгоритм?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Чтобы соблюсти условие строго-больше, можно записать все слагаемые через их ненулевые разницы.
    x > y, значит, x = y + ненулевое_число. Можно так перезаписать слагаемые:
    m          = k0 
    z = m + k1 = k0 + k1
    y = z + k2 = k0 + k1 + k2
    x = y + k3 = k0 + k1 + k2 + k3
    -----------------------------
    m+z+y+x    = 4k0 + 3k1 + 2k2 + k3 = SUM
    ki — это натуральные числа от 1.
    Получили все k — вычислили x, y, z, m.

    Сначала получим k0
    Т.к. на k1..k3 уходит минимум 6, когда все по 1,
    для k0 остаётся диапазон [1, (SUM - 6) / 4]
    при этом k0 должен быть целым.

    Выбрав случайный k0 в этом диапазоне,
    получаем новую целевую сумму SUM1 = SUM - 4 * k0,
    которую нужно заполнить 3k1 + 2k2 + k3 = SUM1

    Рекурсия. Но на последнем шаге k3 это весь остаток.

    const addUpTo = (top, n) => {
      const getDiffs = (sum, n, acc = []) => {
        if (n === 1) {
          x = sum;
        } else {
          const headroom = (n - 1) * n / 2;
          const cap = Math.floor((sum - headroom) / n);
          if (cap < 1) throw("Impossible. " + JSON.stringify(acc));
          x = 1 + Math.floor(Math.random() * cap);
        }
    
        acc.push(x);
    
        if (n <= 1) {
          return acc;
        } else {
          return getDiffs(sum - x * n, n - 1, acc);
        }
      }
    
      return getDiffs(top, n).map((_, i, a) => a.reduce((acc, c, j) => j <= i ? acc + c : acc)).reverse();
    }
    
    addUpTo(100, 4)  /*
    [ 34, 30, 21, 15 ]
    [ 31, 24, 23, 22 ]
    [ 66, 17, 13, 4 ]
    [ 47, 22, 21, 10 ]
    ...
    */
    
    addUpTo(10, 4)  // [ 4, 3, 2, 1 ]
    addUpTo(9, 4)   // ошибка, невозможно разложить
    Ответ написан
    Комментировать
  • Как изменить элемент в нужную дату и время?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    С сервера передавать Unix timestamp момента, когда должно произойти переключение. Например, на PHP что-то типа:
    $timestamp = date('2020-03-29T23:59:00+03:00'); // +03:00 потому что по МСК
    echo "<script>const theMoment = ${timestamp};</script>";


    В странице ловить этот «абсолютный» момент, независимый от временной зоны браузера. Раз в секунду «смотреть на часы» – не пора ли:
    const checkTime = (ts) => {
      if (Date.now() < ts) return setTimeout(() => checkTime(ts), 1000);
      // время пришло
      document.getElementById('price').innerText = '39 990';
    }
    
    checkTime(theMoment * 1000); // в JS timestamp считается в миллисекундах
    // а из PHP приходит в целых секундах


    Ну и где-то на странице есть элемент с ценой на замену:
    <p>
      Специальная цена на наш утюг: <span id="price">29 990</span> 
      <br>
      действует до 30 марта!
    </p>
    Ответ написан
    Комментировать
  • Метод call объекта-функции в js как работает?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    У массивов есть метод indexOf()
    Но его, видимо, нет у this.children, а хочется.

    Поэтому берут пустой массив [] и его метод indexOf
    и вызывают его через call() (подробнее)
    применительно не к тому пустому массиву,
    а подставив методу indexOf в качестве this (где искать) — this.children,
    и вместо 1-го аргумента (что искать) — event.target

    Этот код ищет event.target среди this.children
    и возвращает его индекс или -1, если не нашлось.
    Ответ написан
    Комментировать
  • Передать и вызвать функцию как параметр в JS?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    В самом вызове test() можно обернуть исходные функции с их аргументами в функции:
    function test(fn1, fn2){
      if(fn1()){
        console.log('blabla');
      } else {
        fn2();
      }
    }
    
    // в вызове оборачивайте в функции:
    test(() => real_function1(arg0, arg1),  () => real_function2(arg3));


    Первый вариант предпочтительнее, но для разнообразия второй вариант – «привязать» к ним аргументы:
    test(real_func1.bind(null, arg1, arg2),  real_func2.bind(null, arg3));
    Ответ написан
    1 комментарий
  • Как проверить строку на наличие нужной буквы?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    if ('блаблаква'.indexOf('в') > -1) alert('ОшибкВа!');


    См. метод строки .indexOf()
    Ответ написан
    Комментировать
  • Как из console.log вывести значение объекта в HTML?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    const data = JSON.parse(this.responseText);
    "Your link is " + data.shortURL;
    Ответ написан
    Комментировать
  • Как удалить объект из массива по ключу?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    const id_to_delete = 2;
    posts = posts.filter(el => el.id != id_to_delete);
    Ответ написан
  • Как анимировать SVG периметр из точек?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Анимация атрибута d делается с помощью тега animate, где указываются атрибуты from и to – состояния из которого, и куда.

    Можно скриптом генерить новые значения атрибута d, но останется ощущение «шагов» в таком движении.

    Полагаю, художественный замысел тут несколько иной: чтобы каждая из контрольных точек, определяющих контур, жила своей жизнью, и не по общим часам. Это сделать можно в видеоредакторах, но не в SVG, к сожалению.
    Ответ написан
    Комментировать
  • Как обратиться к элементу массива в данном случае?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Поле city объекта user — опционально.

    Выведите friends.items[42] – возможно, кто-то не указал свой город, и ваш скрипт не создал для него поле coords.
    Хорошо бы предусмотреть else в условии
    if (item.city) {
      // ...
    }
    Ответ написан
    Комментировать
  • Как реализовать функцию?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    завести объект, который ставит в соответствие коду языка, массив вопросов?

    const langTests = {
      'en': textEn,
      'ru': textRu,
    };

    тогда можно брать нужный по коду языка:
    const getText = (lang) => {
      const tests = langTests[lang];
      return tests[Math.floor(Math.random() * tests.length)];
    }
    
    let language = 'en';
    getText(language)  // 'test2'
    Ответ написан
    1 комментарий
  • Мультиусловие в if как его сделать?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    браузер Хром ИЛИ браузер Опера ИЛИ браузер Сафари:
    } else if (browser == 'Chrome' || browser == 'Opera' || browser == 'Safari') {

    но лучше
    } else if (['Chrome', 'Opera', 'Safari'].includes(browser)) {
    или то же,
    олдскульно
    } else if (!!~['Chrome', 'Opera', 'Safari'].indexOf(browser)) {
    Ответ написан
    1 комментарий
  • Как расположить элементы случайным образом не накладываясь?

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

    Для каждого найти векторы до всех других.
    Каждый такой вектор преобразовать в обратный, на который хорошо бы подвинуть.
    Но разделить на квадрат длины. Так влиять будут только короткие – когда сосед оказался слишком близко.
    Сложить векторы и переместить объект.

    Метод плохо сработает если один объект окажется «зажат» между другими точно на одной прямой, или окружён.
    Ответ написан
  • Как сформировать объект в виде ассоциативного массива?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Если считать «маркером» начала данных нового объекта поле filter-name,
    можно вставлять новый пустой объект по такому сигналу
    и заполнять поля всегда в последний элемент массива:
    arr.reduce((acc, cur) => {
      if (cur.name === 'filter-name') acc.push({});
      acc[acc.length - 1][cur.name] = cur.value;
      return acc;
    }, []);


    Ответ написан
    1 комментарий
  • Как правильно построить условия на проверку IndexOf?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    В чём ошибка исходного кода:
    Во всех заголовках присутствует в конце зачем-то единица.
    И поэтому при очередном клике, раньше других срабатывает одно и то же условие,
    где ищется '1' и заголовок становится 2 - click again!1

    Как лучше
    Где-то сохранять, какой из заголовков виден сейчас.
    Не текст заголовка — тексты могут частично совпадать и indexOf() начнёт ошибаться — а номер заголовка.

    0xD34F подсказал как всегда красивый, правильный и лаконичный вариант.

    Ещё можно держать переменную, указывающую на очередной заголовок:
    const headers = ['Мойте руки', 'Сидите дома', 'Помогайте соседям', ];
    let currentHeader = 0;
    $('#header').on('click', function() {
      $(this).text(headers[currentHeader]);
      currentHeader += 1;
      currentHeader %= headers.length;
    });
    Ответ написан
    2 комментария
  • Почему цикл некорректно отрабатывает?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    i < 3 проверяется перед выполнением очередной раз тела цикла.
    i++ выполняется после выполнения тела цикла.

    i становится равным 3. Проверяется, меньше ли 3? — облом — выходит из цикла.
    Ответ написан
    Комментировать
  • Почему данный код работает неправильно?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Давайте переменным и свойствам осмысленные названия.
    Что за qq, raysa, j?

    Сейчас этот неаккуратный код не работает, видимо, потому, что свойство qq у всех лучей рано или поздно становится 1 и у них перстают обновляться координаты.

    Вместо 0 и 1 давайте логической переменной значения false и true. Назовите её как-то понятно, типа isStopped

    Например, так, точно тот же код, но немного чище и может понятнее:
    spoiler
    const ctx = document.getElementById("canvas").getContext("2d");
    
    const gun = {
      x: 10,
      y: 10,
    }
    const rays = [];
    const blocks = [];
    
    for (let i = 0; i < 20; i++) {
      rays.push({x: 0, y: 0,
        angle: i,
        radius: 0,
        isStopped: false,
        raysa: 0
      });
    }
    
    blocks.push({x: 20, y: 20});
    
    function draw() {
      rays.forEach(ray => {
        const radians = ray.angle / 180 * Math.PI;
        if (!ray.isStopped) {
          ray.x = Math.cos(radians) * ray.raysa + gun.x;
          ray.y = Math.sin(radians) * ray.raysa + gun.y;
          ray.radius = ray.raysa;
          if (ray.x >= 100) ray.isStopped = true;
          
          ray.raysa += 1;
          if (ray.isStopped) {
            ray.x = Math.cos(radians) * ray.radius + gun.x;
            ray.y = Math.sin(radians) * ray.radius + gun.y;
          }
        }
        ray.angle += 2;
    
        if (i % 10 == 0) console.log(ray.angle);
    
        ctx.clearRect(0, 0, 320, 320);
        ctx.beginPath();
        ctx.moveTo(gun.x, gun.y);
        ctx.lineTo(ray.x, ray.y);
        ctx.stroke();
      });
    }
    
    //setInterval(draw,20);
    Ответ написан
    4 комментария
  • Как каждые 0.5 секунды задавать рандомные значения свойству top и left?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Чтобы не было предсказуемой ритмичности, можно и время рандомизировать:
    const glitch = () => {
      $(glitch1).css({
        left: Math.random()*500+'px',
        top: Math.random()*500+'px'
      });
      setTimeout(glitch, 200 + Math.random() * 300);
    }
    
    glitch();


    Ответ написан
    Комментировать
  • Как заменить кавычки "лапки" на "елочки", согласно правилам русского языка?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Так-себе вариант, который работает с текстом из вопроса, но позорно провалится на пустой паре кавычек )
    v.0.1
    const src = '"По приказу ОАО "Рога и Копыта""';
    
    src.split('').reduce((acc,c,i,arr) => {
      if (c === '"') {
        const prev = i ? arr[i - 1] : '';
        if (i && prev !== ' ') {
          if (prev === '"') return acc;
          acc += '»';
        } else {
          acc += '«';
        }
      } else {
        acc += c;
      }
      return acc;
    }, '')


    Upd. версия подлиннее, но пустые кавычки более ли менее
    v.0.2
    const requote = source => {
      const Q_OPEN = 1;
      const Q_CLOSE = 2;
      const SPACE = 3;
      const OTHER = 4;
    
      let prev = SPACE;
    
      return source.split('').reduce((acc, c, i, arr) => {
        if (c === '"') {
          if (prev !== SPACE) {
            if (prev === Q_CLOSE) return acc;
            acc += '»';
            prev = Q_CLOSE;
          } else {
            acc += '«';
            prev = Q_OPEN;
          }
        } else {
          acc += c;
          prev = c === ' ' ? SPACE : OTHER;
        }
        return acc;
      }, '')
    }
    
    requote(src)
    Ответ написан
    Комментировать
  • Как изменить значение в объекте массива объектов и вернуть массив?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    const flip = (src_array, id) => {
      const result_array = JSON.parse(JSON.stringify(src_array); // клонируем массив объектов, чтобы не менять оригинал
      const obj = result_array.find(el => el.id == id);
      if (obj) obj.done = !obj.done;
      return result_array;
    }
    Ответ написан
    Комментировать