Ответы пользователя по тегу JavaScript
  • Избранное на статичном сайте?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    Если совсем без регистрации, то только localstorage, но такой вариант избранного будет работать только на том браузере запущенном на том компе в котором данное "избранное" заполнялось.

    Если же вы хотите чтобы пользователь заполнив избранное на одном компе/браузере мог его посмотреть на других компах/браузерах тогда вам надо:

    1. Реализовать любую идентификацию пользователя. Вот некоторые варианты:
    - по логину/паролю
    - по id одной из соцсетей

    2. Использовать для хранения "избранного" пользователем любой онлайн сервис, позволяющий хранить и читать данные. Вот несколько вариантов:
    - Firebase - облачная СУБД класса NoSQL, позволяющая разработчикам приложений хранить и синхронизировать данные между несколькими клиентами. Основной набор функций бесплатен.
    - CloudBoost.io Служба баз данных со множеством полезных функций. Бесплатная. обеспечивает поддержку вашего приложения, включая хранение данных, аутентификацию пользователей, уведомления в режиме реального времени, поиск и многое другое.
    - аналоги этих двух онлайн сервисов
    - написать самому простейший CRUD и разместить его налюбом nodejs хостинге. Например используя Express.js. Вот даже нашел статью как такой crud написать.

    Если же вы прикрутите
    Ответ написан
    Комментировать
  • В JavaScript. Как сконвертировать объект в виде строки в сам объект?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    const text = "{a:[1,2,{b:3}],c:{d:4},\"e\":\"qqq\"}";
    
    const json = text.replace(/(?<=[\{,]\s*)([^",\{]*?)(?=\s*:)/g, a=>{
    	return '"'+a+'"';
    });
    
    console.log(text); // {a:[1,2,{b:3}],c:{d:4},"e":"qqq"}
    console.log(json); // {"a":[1,2,{"b":3}],"c":{"d":4},"e":"qqq"}
    
    const obj = JSON.parse(json);


    Александр, вот мой вариант, тоже наверное может сломаться (если в названии ключа должны быть запятая или левая фигурная скобка, а так же если одно из значений будет содержать что то типа "{cat: 5}"), но все остальные варианты отработает на ура
    Ответ написан
    1 комментарий
  • Нужно найти одинаковые числа в массиве?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    const km = [25, 45,  95, 125, 150, 200, 325, 250, 165, 350]
    
    const cof = [1, 1.5, 1,  1.5, 1.2, 1.5, 1 ,  0.5, 1.2, 1.5];
    
    // как то так
    const res = cof.reduce((a,v,i)=>(a[v]=(a[v]||0)+km[i],a),{});
    
    console.log(res); // { 1: 445, "1.5": 720, "1.2": 315, "0.5": 250 }
    
    console.log(Object.values(res)); // [445, 720, 315, 250];
    Ответ написан
    2 комментария
  • Как выполнить такое задания?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    const person = {
        id: 29,
        name: "John",
        role: "Admin",
        salary: 999
    };
    const templatesSet = [
        "/items/%id%/%name%",
        "/items/%id%/%role%",
        "/items/%id%/%salary%"
    ];
    
    const pathes = templatesSet.map(t => t.replace(/%(.*?)%/g, (s,k)=>person[k]));
    
    console.log(pathes); // [ "/items/29/John", "/items/29/Admin", "/items/29/999" ]
    Ответ написан
  • Почему код выдаёт неправильный результат?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    потому что ваш код эквивалентен этому :
    x = 0;
    y = -200;
    
    x = 1 * y; // 1*(-200)
    y = -1 * x; // 1*(-200) ведь Х уже -200


    сделайте так
    x = 0;
    y = -200;
    
    temp = x;
    x = y; // -200)
    y = -temp; // -0


    а еще лучше так

    x = 0;
    y = -200;
    
    [x,y]=[y,-x];
    Ответ написан
    Комментировать
  • Как правильно сделать Promise?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    вариант 1.
    let promise = new Promise(foo);
    promise.then(result => {
        alert('done')
    });
    
    
    
    function foo(resolve, reject) {
        $.ajax({
            url: ......,
            type: 'get',
            dataType: 'json',
            data: data,
            success: function(data) {
                // ....
                resolve(data);
            },
            error: function(xhr, textStatus, errorThrown) {
                // ...
                reject(textStatus);
            }
        }
    }


    вариант 2.
    let promise = new Promise(function (resolve, reject) {
        $.ajax({
            url: ......,
            type: 'get',
            dataType: 'json',
            data: data,
            success: function(data) {
                // ....
                resolve(data);
            },
            error: function(xhr, textStatus, errorThrown) {
                reject(textStatus);
            }
        }
    });
    promise.then(result => {
        alert('done')
    });


    вариант 3.
    let promise = new Promise(function (resolve, reject) {
        foo(resolve, reject);
    });
    promise.then(result => {
        alert('done')
    });
    
    
    
    function foo(resolve, reject) {
        $.ajax({
            url: ......,
            type: 'get',
            dataType: 'json',
            data: data,
            success: function(data) {
                // ....
                resolve(data);
            },
            error: function(xhr, textStatus, errorThrown) {
                // ...
                reject(textStatus);
            }
        }
    }
    Ответ написан
    4 комментария
  • Как на основе кода для рисования снеговика функцию drawSnowman, которая рисует снеговика в указанной позиции на холсте к примеру drawSnowman(0, 0 )?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    var drowSnowman = function(posX, posY) {
                function drawCircle(x, y, radius, fillCirсle) {
                ctx.beginPath();
                if (fillCirсle === true) {
                    ctx.lineWidth = 4;
                    ctx.arc(x, y, radius, 0, Math.PI * 2, false);
                    ctx.stroke();
                } else if (fillCirсle === false) {
                    ctx.arc(x, y, radius, 0, Math.PI * 2, false);
                    ctx.fill();
                }
            };
            
            drawCircle(posX+100, posY+100, 30, true);
            ctx.fillStyle = "orange";
            drawCircle(posX+100, posY+105, 5, false);
            ctx.fillStyle = "black";
            drawCircle(posX+90, posY+95, 5, false);
            drawCircle(posX+110, posY+95, 5, false);
            drawCircle(posX+100, posY+170, 40, true);
            drawCircle(posX+100, posY+150, 5, false);
            drawCircle(posX+100, posY+170, 5, false);
            drawCircle(posX+100, posY+190, 5, false);
    };
    
    drowSnowman(200,150);
    drowSnowman(500,450);
    Ответ написан
    Комментировать
  • Как убрать enter между словами?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    mess.channel.send(robotmessage.join(" ")).then(mess.channel.send(mess.author));


    если в mess.channel.send(...) передать массив строк (а в robotmessage у вас именно массив строк) то каждый элемент массива будет отправлен как отдельная (новая) строка.
    Ответ написан
    1 комментарий
  • Почему не работает перебор объекта JS?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    https://developer.mozilla.org/ru/docs/Web/JavaScri...
    Этот метод позволяет точно добавлять или изменять свойства объекта. Обычное добавление свойств через присваивание создаёт свойства, которые можно увидеть через перечисление свойств (с помощью цикла for...in или метода Object.keys), чьи значения могут быть изменены и которые могут быть удалены. Этот же метод позволяет настроить эти дополнительные детали свойства.
    ...
    enumerable
    Равен true только в том случае, если это свойство можно увидеть через перечисление свойств содержащего его объекта.
    Значение по умолчанию установлено в false.


    таким образом вам надо делать так
    Object.defineProperty(obj, 'test', {value: 1, enumerable: true}); 
    Object.defineProperty(obj, 'test2', {value: 1, enumerable: true});
    Ответ написан
    3 комментария
  • Как отправить свой Blob объект посредством XMLHttpRequest?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    Как вариант, могу предложить следующее.
    Пару дней назад отвечал на этот вопрос Как получить несколько файлов base64 string?
    По сути там формируется массив с данными всех прикрепленных файлов. Применительно к вашей задаче можно например перед отправкой удалить часть элементов/файлов из данного массива и затем их отправить.
    А для красоты можно еще и сделать табличный вывод прикрепленных файлов с кнопкой "удалить" для каждого.

    Ответ написан
  • Как получить несколько файлов base64 string?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    4 комментария
  • Как написать условие, пока блок находится поверх другого блока или пересекает его границу делать то и то?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    устаревшее решение

    1. создаем функцию которая
    1.1 получает 3 параметра
    - ссылку на первый блок
    - ссылку на второй блок
    - ссылку на колбэк функцию, которую нужно будет выполнить при пересечении блоков
    1.2 определяет координаты верхнего левого угла каждого из сравниваемых элементов и их высоту и ширину
    1.3 сравнивает местоположения блоков и в случае их наложения вызывает колбэк
    2 ВАЖНО созданную функцию вызываем каждый раз, как происходит перемещение одного из отслеживаемых элементов

    сама функция сравнения:
    function testIntersection(elem1, elem2, cb){
       // получаем координаты первого и второго элемента 
       let box1 = elem1.getBoundingClientRect();
       let box2 = elem2.getBoundingClientRect();
    
       let isIntersection = true;
    
       // если нижняя грань первого элемента выше чем верхняя грань второго - НЕПЕРЕСЕКАЮТСЯ
       if ( box1.bottom < box2.top ){  isIntersection=false;  }
    
       // если верхняя грань первого элемента ниже чем нижняя грань второго - НЕПЕРЕСЕКАЮТСЯ
       if ( box1.top > box2.bottom ){  isIntersection=false;  }
    
       // если правая грань первого элемента левее чем левая грань второго - НЕПЕРЕСЕКАЮТСЯ
       if ( box1.right < box2.left ){  isIntersection=false;  }
    
       // если левая грань первого элемента правее чем правая грань второго - НЕПЕРЕСЕКАЮТСЯ
       if ( box1.left > box2.right ){  isIntersection=false;  }
    
       // если всеже пересекаются, выполняем колбэк функцию
       if( isIntersection ){
          cb();
       }
    }



    Актуальное решение дано в комментарии к вашему вопросу от Johnny Lowhunter
    Ответ написан
    Комментировать
  • Как использовать переданный аргумент?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    this.test[0][activeBlock].map...?
    Ответ написан
    Комментировать
  • Как преобразовать массив в объект?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    var obj = arr.reduce((a,v)=>{
      a[v.id]={color: v.color};
      return a;
    },{});
    Ответ написан
    Комментировать
  • Блокировка загрузки скрипта на сайте (как)?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    /**
     * функция добавляет код скрипта на страницу предварительно удаляя из него указанные куски текста, 
     * @param {string} 		url  полные URL добавляемого скрипта
     * @param {string} 		replaces массив со строками, которые будут удалены (заменены на пустоту)
     */
    function addScript( url , replaces=[]) {
      // получаем текст добавляемого на страницу скрипта
      fetch(url)
      .then(response=>{
        return response.text();
      })
      .then(text=>{
        // готовим регулярку для замены всех вхождени из массива replaces
        const restr = "("+replaces.join("|")+")";
        const regex = new RegExp(restr, "g");
        //  заменяем в тексте скрипта все вхождения из массива replaces
        const code = text.replace(regex,"");
    
        // получаем указатель на head страницы
        let head = document.getElementsByTagName( 'head' )[ 0 ];
        // создаем новый элемент script
        let script = document.createElement( 'script' );
        script.charset="utf-8";
        script.type = 'text/javascript';
        //script.src = url;
        script.innerHTML = code;
        // добавляем измененный скрипт на страницу
        head.appendChild( script );
      });
    }
    
    
    
    // Используем заготовку
    // например у нас есть сторонний скрипт, который нам надо добавить на страницу => https://external.domain/js/needed.js
    // но он запускаясь подгружает не нужные нам скрипты https://external.domain/js/unnecessary.js и https://external.domain/js/advertising.js
    // тогда делаем так
    addScript( 
      "https://external.domain/js/needed.js",
      [
        "unnecessary.js",
        "advertising.js"
      ]
    );
    
    // ну и на последок. Вы должны понимать что данное решение не панацея и его легко обойти
    // например "вредные" скрипты могут иметь случайносгенерированное имя
    // так же хочу предупредить, что данное решение будет сыпать ошибки в консоль, так как после удаления
    // из кода загружаемого скрипта строк с именами файлов вредных скриптов, код который их загружает 
    // не сможет этого сделать.
    // так же данный свособ может привести к частичной или полной неработоспособности полезного скрипта
    // например если полезный скрипт использует функции из подгружаемых вредных скриптов
    // или если в полезном скрипте есть переменные или функции с именами, аналогичными удаляемым скриптам
    // и т.д. и т.п.
    Ответ написан
    Комментировать
  • Как распознать изображение в JS?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    вы хотите что то типа такого сделать?

    Вот еще интересный вариант, реализуемый библиотекой AR.JS. Если это то что вам нужно, то вот статья (сразу скрольте до середины)
    Это маркер
    500

    Э это код на codepen.io
    Ответ написан
    Комментировать
  • Как сделать функцию в которую вписываешь с какой вероятностью вернется true, от 0 до 100?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    так:
    function randomTrue(P){
       return P>=Math.random()*100;
    }


    ну или так:
    const randomTrue = P => P>=Math.random()*100;
    Ответ написан
  • Почему не работает debounce?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    разбирайтесь (ниже рабочий код):
    import React, { useState } from 'react';
    import './styles.css';
    
    function debounce(fn, ms, ...args) {
      let timer;
      return (value) => {
        timer = setTimeout(() => {
          // ваш вариант вообще забывал о том что в fn вы пытаетесь передать value
          fn.apply(this, [value,...args]);
    
          // удалять обработчик таймаута вообще не надо, но если это всетаки делать, то наверное уже после того как 
          clearTimeout(timer);
          timer = null;
        }, ms);
      };
    }
    
    export default function App() {
      const [value, setValue] = useState('');
    
      const handleChange = e => {
        const {value} = e.target;
        delayHandler(value);
      };
    
      const delayHandler = debounce(value=>{
        setValue(value);
        alert(value);
      }, 2000);
    
      return (
        <div className="App">
          <p>Current value: {value}</p>
          <form>
            <input onChange={handleChange} />
          </form>
        </div>
      );
    }


    не совсем уверен чего вы хотите добиться, но мне кажется должно вообще быть как-то так:
    function debounce(fn, ms) {
      return (...args) => {
        setTimeout(() => {
          fn.apply(this, args);
        }, ms);
      };
    }
    Ответ написан
  • Как вывести нечетные числа в цикле While?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    var num = 30;
    while(num<40){
      num++;
      if(num%2) console.log(num);
    }
    Ответ написан
    1 комментарий
  • Как получить вложенный HTML элемент с помощью JS?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    https://developer.mozilla.org/ru/docs/Web/API/Docu...

    получится как то так:

    var el = document.querySelector("div.card__owerlay-wrapper a.card-do__btn.print__btn");
    Ответ написан
    Комментировать