Ответы пользователя по тегу JavaScript
  • Как включить на проекте redux devtools?

    contraomnes
    @contraomnes
    Frontend developer
    расширение передается 3 или, в вашем случае, 2 аргументом (enhancer), а не комбинируется с редьюсерами
    export default createStore(combineReducers(reducer), initialState, window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__())


    или

    export default createStore(combineReducers(reducer), window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__())
    Ответ написан
    Комментировать
  • Что нужно делать на практике в JavaScript, чтобы его понимать?

    contraomnes
    @contraomnes
    Frontend developer
    Задачки + английский
    https://www.codewars.com/
    https://www.hackerrank.com/

    Учебник по js на русском с примерами и задачками
    https://learn.javascript.ru/

    Кроме того, одним javascript'ом сыт не будешь)
    frontend.png
    Ответ написан
    2 комментария
  • Как прописать border-radius: 5px; в JS?

    contraomnes
    @contraomnes
    Frontend developer
    Попробуй так
    document.getElementById("st1").style.borderRadius = '5px';

    только правильнее всё-таки тогда элемент вынести в переменную и есть различные способы добавления стилей через js: https://developer.mozilla.org/ru/docs/Web/API/HTML...
    Ответ написан
    Комментировать
  • Как из массива объектов вытащить имена, собрать отдельный массив уникальных имен и отсортировать в алфавитном порядке?

    contraomnes
    @contraomnes
    Frontend developer
    const arr = [{name: 'Сергей'}, {name: 'Анна'}, {name: 'Сергей'}, {name: 'Пётр'}, {name: 'Антон'}];
    const result = [...new Set(arr.map(n => n.name))].sort((a, b) => a.localeCompare(b));
    
    console.log(result);
    Ответ написан
  • Что в данном коде значит var slider = multiItemSlider('.slider', { isCycling: true });?

    contraomnes
    @contraomnes
    Frontend developer
    Ты вызываешь функцию multiItemSlider, передав в неё нужные параметры:
    1 - очевидно, это селектор, по которому ищется соответствующая нода
    2 - судя по всему, это объект с настройками, isCycling - судя по всему отвечает за автоматическое переключение слайдов
    он возвращает объект с методами, которые, ты можешь использовать далее по коду, допустим, если ты напишешь ниже этой переменной slider.stop() то слайдер остановится

    И да, это очень круто, что ты пытаешься разобраться в чужих исходниках, но я думаю, что к такой вещи должно быть какое-то описание, разве в исходниках не было никаких комментариев, документации к тому, как этот слайдер используется, что можно в него передать, что возвращает?
    Ответ написан
  • Как объединить два массива в один у которых ключи id и user_id с одинаковыми значениями в js?

    contraomnes
    @contraomnes
    Frontend developer
    вот тебе ещё
    const array1 = [
    { "user_id": 1, "page_views": 7, "clicks": 5 },
    { "user_id": 5, "page_views": 6, "clicks": 3 },
    { "user_id": 9, "page_views": 4, "clicks": 7 },
    { "user_id": 1, "page_views": 3, "clicks": 5 },
    ];
    
    const array2 = [
    {"id":9,"first_name":"Barnabas"},
    {"id":1,"first_name":"Emlyn"},
    {"id":5,"first_name":"Ervin"},
    ];
    
    const result = array2.map(item2 => {
      // отфильтровали массив 1 на наличие элементов с соответствующим id
      const withCurrentId = array1.filter(item1 => item1['user_id'] === item2['id']);
      
      // склеили новый объект с суммами свойств
      const item1 = withCurrentId.reduce((acc, curr) => {
        // если в аккумуляторе нет свойства page_views, то 0, потом суммируем
        acc['page_views'] = (acc['page_views'] || 0) + curr['page_views'];
        // если в аккумуляторе нет свойства clicks, то 0, потом суммируем
        acc['clicks'] = (acc['clicks'] || 0) + curr['clicks'];
    
        return acc;
      }, {});
    
      return { ...item2, ...item1 };
    });
    
    
    console.log(result);
    Ответ написан
    Комментировать
  • Почему слайдер не работает когда меню (header) имеет position: fixed;?

    contraomnes
    @contraomnes
    Frontend developer
    он считает, что слайдер не виден вот здесь:
    if (!_isElementVisible(_mainElement)) {
                return;
              }

    если глубже, то вот здесь
    element.contains(elemFromPoint(rect.left, rect.top))
              || element.contains(elemFromPoint(rect.right, rect.top))
              || element.contains(elemFromPoint(rect.right, rect.bottom))
              || element.contains(elemFromPoint(rect.left, rect.bottom))

    когда ты используешь fixed на меню, ты перекрываешь верх слайдера, и верхние точки недоступны, а нижние не были доступны и раньше, если ты сдвинешь для интереса слайдер с помощью margin-top на пикселей 100, или
    сделаешь вот так:
    || element.contains(elemFromPoint(rect.right, rect.bottom - 1))
    || element.contains(elemFromPoint(rect.left, rect.bottom - 1))

    то он заработает) очевидно, это всё не самое подходящее решение
    Ответ написан
    Комментировать
  • Вывести всех людей в консоль, вывести средний возраст людей и имя человека с самой большой зарплатой в списке?

    contraomnes
    @contraomnes
    Frontend developer
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Document</title>
    </head>
    <body>
        <script>
        // рандомайзер даты
        function randomDate(start, end) {
          return new Date(start.getTime() + Math.random() * (end.getTime() - start.getTime()));
        }
    
        var pn = ['Alex', 'Mark', 'Victor', 'Maxim', 'Robert'],
            pnf = pn[Math.floor(Math.random() * pn.length)]; // я не знаю, что это такое
    
        var chislo = prompt('Введите ко-во массивов');
        var massive = [];
    
        for (let i = 0; i < chislo; i++) {
          massive.push({
            // не знаю, что такое d2, d1 и, в общем случае, исхожу из того, что я могу получить корректную дату,
            // date: (new Date(Math.floor(Math.random() * (d2 - d1) + d1))).toDateString(),
            date: randomDate(new Date(1960, 0, 1), new Date(2000, 0, 1)).toDateString(),
            summ: Math.floor(Math.random() * (500 - 0 + 1)) + 0,
            name: pn[Math.floor(Math.random() * pn.length)]
          });
        }
        console.table(massive);
    
        const initialValues = {
          summ: 0, // самая высокая зп
          summOfYears: 0, // сумма годов рождения
        };
    
        const {name, summOfYears} = massive.reduce((acc, curr) => {
          const {summ, name} = acc.summ > curr.summ ? acc : curr;
          return {
            summ,
            name,
            summOfYears: acc.summOfYears + new Date(curr.date).getFullYear(),
          };
        }, initialValues);
    
        const averageAge = summOfYears && Math.round(new Date().getFullYear() - summOfYears / massive.length);
    
        if (name && averageAge) {
          console.log(`Самый высокооплачиваемый ${name}`);
          console.log(`В среднем ребятам ${averageAge}`);
        }
    
    
        // пока писал, подумал, что я немного издеваюсь, и это будет заметно в общем... вот более адекватное решение для вас
    
        /*
        var summOfYears = 0, // сумма годов рождения
          whoWithMaxSalary = {};  // человек с самой высокой зп
        massive.forEach((person) => {
          whoWithMaxSalary = whoWithMaxSalary.summ > person.summ ? whoWithMaxSalary : person;
          summOfYears += new Date(person.date).getFullYear();
        });
    
        // если summOfYears равна не нулю, тосчитаем средний возраст
        const averageAge = summOfYears && Math.round(new Date().getFullYear() - summOfYears / massive.length);
    
        if (whoWithMaxSalary.name && averageAge) {
          console.log('Самый высокооплачиваемый: ' + whoWithMaxSalary.name);
          console.log('В среднем ребятам: ' + averageAge);
        }
        */
    
        </script>
    </body>
    </html>
    Ответ написан
    Комментировать
  • Как правильнее всего достать значение объекта при помощи строки?

    contraomnes
    @contraomnes
    Frontend developer
    const nestedObject = { a: { b: { c: 3 } }, c: 1, b: 1 };
    const str = "a.b.c";
    
    const prop = str
      .split(".")
      .reduce(
        (acc, current) => (acc[current] !== undefined ? acc[current] : acc),
        nestedObject
      );
    console.log(prop);

    если str будет другой, например, 'a.b.c.d', то вернет максимально глубокое значение, т.е. в данном случае `c`, которое равно 3
    Ответ написан
    Комментировать
  • Как в react-slick slider узнать общее количество слайдов?

    contraomnes
    @contraomnes
    Frontend developer
    узнать общее количество слайдов можно только весьма упоротыми способами
    https://codesandbox.io/s/react-slick-33v2z
    счетчик, помоему, лучше всё-таки делать внешним
    https://codesandbox.io/s/react-slick-nyjxq
    Ответ написан
    Комментировать