Ответы пользователя по тегу JavaScript
  • Как на основе кода для рисования снеговика функцию 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 у вас именно массив строк) то каждый элемент массива будет отправлен как отдельная (новая) строка.
    Ответ написан
  • Почему не работает перебор объекта 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});
    Ответ написан
  • Как отправить свой Blob объект посредством XMLHttpRequest?

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

    Ответ написан
  • Как написать условие, пока блок находится поверх другого блока или пересекает его границу делать то и то?

    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);
    }
    Ответ написан
  • Как получить вложенный 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");
    Ответ написан
  • Какой проект можно сделать новичку на этапе изучения?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    (почти шутка))) сделайте миниигру по типу flappy bird, например на базе этой заготовки для rolling bun )))
    Ответ написан
  • Почему данный код работает неправильно?

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

    у вас:
    rays[i].x == blocks[q].x && rays[i].y >= blocks[q].y && rays[i].y <= blocks[q].y + 32


    должно быть:
    rays[i].x>=blocks[q].x && rays[i].x <= blocks[q].x + 32 && rays[i].y >= blocks[q].y && rays[i].y <= blocks[q].y + 32


    Ну а бонусом ловите рабочий вариант:
    Ответ написан
  • Возникает ошибка в функций когда надо вывести ноль. Как исправить?

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

    код: https://jsfiddle.net/lastuniverse/hfbdzt31/6/

    вывод:
    90  =>  3.061616997868383e-16  ---  5
    180  =>  3.061616997868383e-16  ---  5
    240  =>  3.061616997868383e-16  ---  5
    360  =>  3.061616997868383e-16  ---  5


    Если вас смущает что вместо нуля выводит 3.061616997868383e-16 то учтите что:
    1. 3.061616997868383e-16 это 0.0000000000000003061616997868383, то есть величина очень близкая к нулю
    2. ошибка возникающая при вычислении (неточность вычислений)

    Ну и цитата взятая из текста по ссылке:
    Можно ли обойти проблему? Конечно, наиболее надёжный способ — это округлить результат используя метод toFixed(n):

    let sum = 0.1 + 0.2;
    alert( sum.toFixed(2) ); // 0.30
    Ответ написан
  • Каким образом посчитать разность дат в JS?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    с использованием https://momentjs.com/docs/
    // ваши даты из бд
    var start = "1970-01-01";
    var end = "2018-03-10";
    
    // парсим их с помощью moment-а
    var a = moment(start, "YYYY-MM-DD");
    var b = moment(end, "YYYY-MM-DD");
    
    // получаем количество дней между датами
    var days = a.diff(b, 'days') ;
    
    // пихаем days куда вам там надо
    ...


    или так (на нативном js)
    // ваши даты из бд
    var start = "1970-01-01";
    var end = "2018-03-10";
    
    // парсим их с помощью нативного JS
    var a = Date.parse(start);
    var b = Date.parse(end);
    
    // получаем количество дней между датами
    var days = Math.floor(Math.abs(b-a)/(1000*60*60*24)) ;
    
    // пихаем days куда вам там надо
    ...
    Ответ написан
  • Как сформулировать regexp?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    var re = /\[(.*?)\]\s*\((http.*?)\)/g;
    var txt = '[катетер-направленному тромболизису] (https://www.radiologyinfo.org/en/info.cfm?pg=thrombo), но та, которая, помимо удаления тромбов, также открывает и усиливает слишком маленькие кровеносные сосуды через стенты или другие средства. Также может быть желательно увеличить их проницаемость, чтобы фиксаторы достигали паренхимы мозга по всему кровеносному сосуду, а не только на кончиках. Лазер может делать микроскопические дыры по всей длине, а затем, возможно, добавить [тонкий слой полиамида] (https://en.wikipedia.org/wiki/Thin-film_composite_membrane#Structure_and_materials)';
    
    var html = txt.replace(re,(a,b,c)=>{
       console.log("-------------\ntext:",b,"\nurl:",c);
       return `<a href='${c}'>${c}</a>`;
    });
    
    console.log("-------------\n",html);

    выхлоп в консоль

    -------------
    text: катетер-направленному тромболизису 
    url: https://www.radiologyinfo.org/en/info.cfm?pg=thrombo
    -------------
    text: тонкий слой полиамида 
    url: https://en.wikipedia.org/wiki/Thin-film_composite_membrane#Structure_and_materials
    -------------
     <a href='https://www.radiologyinfo.org/en/info.cfm?pg=thrombo'>https://www.radiologyinfo.org/en/info.cfm?pg=thrombo</a>, но та, которая, помимо удаления тромбов, также открывает и усиливает слишком маленькие кровеносные сосуды через стенты или другие средства. Также может быть желательно увеличить их проницаемость, чтобы фиксаторы достигали паренхимы мозга по всему кровеносному сосуду, а не только на кончиках. Лазер может делать микроскопические дыры по всей длине, а затем, возможно, добавить <a href='https://en.wikipedia.org/wiki/Thin-film_composite_membrane#Structure_and_materials'>https://en.wikipedia.org/wiki/Thin-film_composite_membrane#Structure_and_materials</a>

    Ответ написан
  • Поможете найти матрицы?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    код (спойлер)
    var matrixes =  [
      [
        [3, 2, 1],
        [1, 2, 3],
        [3, 1, 3]
      ], // Должен выводится 3
      [
        [3, 2, 1],
        [1, 2, 3],
        [3, 2, 1]
      ], // Должен выводится 0
      [
        [1, 0, 0, 0],
        [0, 1, 0, 0],
        [0, 0, 1, 0],
        [0, 0, 0, 1]
      ], // Должен выводится 4
      [
       [2, 4],
       [4, 2]
      ] // Должен выводится 0 
    ];
    
    matrixes.forEach( matrix => {
       console.log("------------------------");
       console.table(matrix);
       console.log(calc(matrix));
    });
    
    
    function calc(matrix){
      let template = matrix[0];
      let result = matrix.reduce( (acc1, items, index1) => {
        if(index1===0) return acc1;
        template = template.reverse();
        acc1 += items.reduce( (acc2, item, index2) => {
            acc2 += Math.abs(template[index2]-item);
            return acc2;
        },0);
        return acc1;
      },0);
      return result;
    }


    результат:
    5e5fed549ce9e339758941.png

    ну и песочница:
    Ответ написан