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

    @f_ban
    const fs = require('fs');
    const path = require('path');
    
    let pathSupplied = './';
    let extFilter = 'js';
    
    let extension = (element) => {
        let extName = path.extname(element);
        return extName === '.' + extFilter;
    };
    
    let walk = function (dir) {
        const result = [];
    
        fs.readdir(dir, function (err, list) {
            list.forEach((item) => {
                let itemPath = path.join(dir, item);
                fs.stat(itemPath, (e, stats) => {
                    if (stats.isDirectory()) {
                        walk(itemPath);
                    } else {
                        if(extension(itemPath)){
                            console.log(itemPath)
                            result.push(itemPath);
                        }
                    }
                });
            });
        });
    
        return result;
    }
    
    walk(pathSupplied);
    
    walkAsync = (dir)=>{
        return new Promise((resolve)=>{
            resolve(walk(dir))
        });
    }
    Ответ написан
    Комментировать
  • Почему выводит undefined?

    @f_ban
    Судя по всему через `document.getElementById('in1')` вы пытаетесь получить доступ к <input id="in1"> но у элементов HTMLInputElement нет свойства `Value`, есть `value`. Видимо опечатались.
    Ответ написан
    Комментировать
  • Нормально ли изменять параметр функции внутри функции без объявления переменной?

    @f_ban
    В случае, если вы так работаете со значением, прередваемым по значению (то есть не объект), то особо можно не волноваться.
    Но все же ваш второй вариант реализации будет лучше. Как минимум, функция становится абсолютно чистой. а это хорошо со многих точек зрения.
    Или же вариант из первого ответа - короче и лаконичнее
    Ответ написан
    1 комментарий
  • Почему includes проверяет вхождения части строки?

    @f_ban
    Потому что, includes здесь применяется к срокам, таким образом она ищет вхождение строк. А строка 'купи' является подстрокой всех значений массива array_query.

    Судя по всему, вам требуется рудиментальные лексический анализ, а для этого, разделите каждую строку на массив слов (лексем), и уже потом проверяйте, содержит ли массив нужную лексему. Это простейший неоптимизированный вариант алгоритма.
    Ответ написан
    Комментировать
  • Вопросы об одной строке React кода?

    @f_ban
    Судя по приведеному коду:
    1. В this.state.active хранится индекс текущего активного айтема.
    2. Через this.props.items в компонент прокидвыается массив айтемов, с которыми нужно работать.
    3. Могут сойтись звезды так, что this.state.active будет иметь значение, выходящее за пределы массива this.props.items (самое первое предположение о природе данной проверки). В этом случае конструкция this.props.items[this.state.active] вернет значение undefined,
    4. Далее в работу включается оператор &&, в случае когда (false && чтото_там_еще), выигрывает то, что справа. Оператор && сперва стратается привести значение слева к булевому, по одному определенному алгоритму приведения, в частности undefined приводится к значению false. Таким образом, конструкция будет исполнена только если this.props.items[this.state.active] не вернет undefined/null/0/''/false.
    5. Конструкция {...this.props.items[this.state.active]} говорит о том, что все свойства возвращенного объекта нужно вставить как пропсы в создаваемый Content
    Ответ написан
    Комментировать
  • UWP Javascript как скачать и назначит Background?

    @f_ban
    Вы можете воспользоваться тем, что для свойства background-img, как и для background, можно указывать несколько слоев фонов, таким образом, дефолтовый фон должен быть в самом нижнем слое. Обратите внимание, что если в качестве дефолтового слоя указать изображение, то опять же может происходить временной лаг, поэтому, в качестве уж совсем нижнего слоя укажите либо градиент/цвет, либо простенькую svg через data-url.

    Затем, когда получите актуальный URL фоновой картинки, поставите его в свойство спереди, отделив от предыдущего значения запятой.

    Вот mdn по теме https://developer.mozilla.org/en-US/docs/Web/CSS/C...
    Ответ написан
    2 комментария
  • Как заставить браузер брать файлы из нужного места?

    @f_ban
    Такое поведение браузерах связано скорее всего с тем, что в аттрибуте src тегов img указано примерно такое "img/src/чтототамеще". Если укажите, "/img/src/чтототамеще", это должно решить проблему (есть ещё другой способ, но я не думаю, что он здесь уместен), обратите внимание, что этот путь начинается слешем, такие пути называются статическими и не пересчитываются относительно базового пути страницы.
    Ответ написан
    1 комментарий
  • Как получить свойство из объекта, если объект был создан через функцию?

    @f_ban
    Прямой доступ к переменной name, после вызова анонимной функции вы уже не получите. Да она попала в замыкание метода logg(). Если Вам нужно получать доступ к ней в рамках объекта, который вернула функция, то возвращаемый объект должен предоставлять соответствующие методы для чтения/установки значения этой переменной.
    Ответ написан
    Комментировать
  • Как сделать слайдер зацикленным?

    @f_ban
    nextSlideHandler = (e, item, index ) => {
      let arr = [...this.state.data];
      const {direction} = e.currentTarget.dataset;
      const {currentImageIndex,
             images} = this.state.data[index];
      const newIndex = direction === 'next'
                      ? (currentImageIndex+1) % (images.length-1)
                      : ((currentImageIndex || images.length)-1) % (images.length-1);
      arr[index].cantGoNext = true;
      arr[index].cantGoPrev = newIndex !== 0;
      arr[index].currentImageIndex = newIndex;
    
      this.setState({ data:arr });
    }
    Ответ написан
    Комментировать
  • Как исправить ошибку при загрузке файла с помощью fetch?

    @f_ban
    Во-первых, ваш сервер должен уметь обработать запрос на '/data.json'.
    В приведенном же вами коде бэковой части обрабатываются запросы на: '/', '/exmpl.js', '/Gistograma.html', '/Gistogr.js', '/server1.js'. А в блоке default вообще указаны инструкции, что если придет запрос на что-то другое, что не входит в этот список, то ответить кодом 404 - стандартный код ответа HTTP, в случае если запрашиваемый ресурс не найден.

    Таким образом, если добавите что-то вроде следующего, то проблема должна быть решена:
    case '/data.json':
        const js = fs.readFileSync('data.json', 'utf8'); 
        res.writeHead(200, {'Content-Type': 'application/json'});
      		res.end(js);
    Ответ написан
    8 комментариев
  • Как валидировать форму для скачивания файла с минимумом JS?

    @f_ban
    1. Используйте input[type=submit]/button[type=submit]
    2. Подпишитесь на событие submit на форме
    3. В обработчике события запускайте загрузку файла с помощью примерно такой функции
    // https://stackoverflow.com/questions/3916191/download-data-url-file/45905238#45905238?newreg=ddb3c48865d04c319b39f772df762521
    function download(dataurl, filename) {
      var a = document.createElement("a");
      a.href = dataurl;
      a.setAttribute("download", filename);
      a.click();
    }

    3. Что касается невозможности нажатия на кнопку сабмита, если хоть одно поле формы не валидно, то навешайте примерно такой стиль:
    #someform:invalid [type=submit]{
      pointer-events: none;
      
      /* другие нужные стили, да хоть display: none; */
    }

    4. Если редирект хотите выполнять на бэке, тот здесь проблем нет - просто перенаправляйте в бэковом обработчике формы. Если будете редиректить клиентом, то в обработчике сабмита отмените дефолтовую реакцию на ивент, с формы соберите данные и пошлите AJAX-ом на бэк, и затем делейте редирект на сэнкью-пейдж, если данные отправились успешно.
    Ответ написан
    Комментировать
  • Python или JS: что всё-таки изучать?

    @f_ban
    После 5-го изученного языка, придёт понимание, что язык программирования всего лишь инструмент решения задач. Поэтому, изучайте оба, акцентируйтесь на их стандартных конструкция, заодно, найдите для себя, что в каждом из них вам нравится.
    Ответ написан
  • Как сделать что бы скрипт работал после другого скрипта?

    @f_ban
    Воспользуйтесь MutationObserver, https://developer.mozilla.org/en-US/docs/Web/API/M... для отслеживания изменений DOM нужных элементов. Как только появятся нужные данные, заберете их.

    Вариант 2 - создать кастомный вэб-компонент, и использовать его вместо тега ul, который будет наблюдать за изменениями в своем слоте, и опять же, как тотлько в слоте появятся нужные данные, забрать... Но наверное первый вариант уместнее будет.
    Ответ написан
    Комментировать
  • Как приметить изменении без перезагрузки страницы при изменении localstorage?

    @f_ban
    Вам следует поменять архитектуру хранения, состояния, тем более что создаете SPA. Вам следует создать простой объект, в свойствах которого будет храниться состояние приложения, в частности, у него может быть свойство mode. Далее, для изменения этого свойства создать функцию-редьюсер. После этого, все вместе упаковать в хранилище/стор. Что же до персистент-хранения в локал-сторадже или где там еще, то хранилище должно предоставлять метод dispatch(), в который можно передать функцию, которая будет при изменениях будет скидывать состояние в нужный сторадж. Также, с помощью этого же метода добавлять функции обновления состояние DOM или что там нужно для отображения в UI.

    В общем, я кратко описал концепцию работы REDUX, новичкам в этом вопросе кажется, что эта библиотека создана исключительно для реакта, но это не так.

    И да, данные сначала меняются в "горячем" объекте внутри стора, а потом уже выталкиваются в UI и персистент-хранилища.
    Ответ написан
    Комментировать
  • Как создать свои ошибки в JS?

    @f_ban
    Не совсем понял, когда проверка выполняется, если в конструкторе, то воспользуйтесь деструктуризацией аргументов, и делайте проверки до инициализации свойств объекта - это как минимум наглядно покажет все ограничения на входные параметры конструктора.
    class Point {
      constructor(x, y, ...other) {
          if(other.length > 0){
            throw 'Only 2 number arguments';
          }
          if(typeof x !== 'number'){
            throw TypeError(`The first argument must be number but have got ${typeof x}`);
          }
          if(typeof y !== 'number'){
            throw TypeError(`The second argument must be number but have got ${typeof y}`);
          }
          
          this.x = x;
          this.y = y;
      }
    }


    Да, в JS можно написать throw 'Текст ошибки'; И это создаст вполне себе нормальный объект исключения класса Error. Также существуют разные стандартные классы исключений. Если требуется кастомный типизированый класс исключения, то просто унаследуйте новый класс от Error и используйте его в кострукции throw.

    На самом деле, не совсем понимаю, зачем проверку свойств объекта выделили в отдельный метод. Это нужно дл какой-то валидации вне конструктора?
    Ответ написан
    1 комментарий
  • Будет ли хорошей практикой такая структура приложения на Vue?

    @f_ban
    Так ведь весьма здравая и зрелая с архитектурной точки зрения мысль. Фреймворк чего-либо там - всего лишь незначительная деталь реализации. Вся ценность системе - ее бизнесправила, юз-кейсы и их чистота реализации. Действительно, реализуя спа, важно сделать границу между слоем, работающим с бизнес-правилами, и слоем, просто отрисовывающим Стейт, или вьюв-модель. В итоге, каждая часть будет заниматься своим делов, и как бонус, легко за аб-тестить хоть все фронт-фремворки одновременно.
    Ответ написан
    Комментировать
  • Как изменить цвет SVG изображения?

    @f_ban
    .red{
      fill:red;
    }

    <svg class="red" ...>...</svg>
    Ответ написан
    Комментировать
  • Возможно ли определить включен ли GPS на смартфоне из мобильного браузера?

    @f_ban
    Прямого API, предоставляющего такой функционал, не встречал.
    Использую такой трюк. Метод navigator.geolocation.getCurrentPosition() вторым параметром принимает обработчик ошибок. Если в обработчик попала любая ошибка кроме PERMISSION_DENIED, то сообщаю пользователю, что геолокация не доступна, прошу проверить включен ли модуль геолокации.
    Ответ написан
    Комментировать
  • Как привести строку к нормальному виду?

    @f_ban
    Ответ написан
    Комментировать