Ответы пользователя по тегу JavaScript
  • Не работает реализация алгоритма, поможете найти ошибку?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    замените:
    // Скроллим еще ниже
      if(scrollBottom == true){
        //alert("Скроллим вниз");
        objDiv.scrollTop = objDiv.scrollHeight;
      }


    на

    // Скроллим еще ниже
      if(scrollBottom == true){
        //alert("Скроллим вниз");
        setTimeout(()=>{
           objDiv.scrollTop = objDiv.scrollHeight;
        },1000);
      }


    Но это будет ненадежный костыль, по хорошему тут надо все переделать, включая и php/view.php

    Не работало как надо потому, что без сеттаймоута вы сразу после замены сообщений в блоке мессаджес пытаетесь проскролить, но браузер в этот момент еще не отработал вставку (тоесть новые сообщения еще не заменили старые и не изменили высоту прокрутки)

    соответственно с сеттаймоутом вы даете время браузеру отработать вставку сообщений, и на момент когда вы делаете objDiv.scrollTop = objDiv.scrollHeight; в блоке уже новые сообщения.

    с алертом работало по той же причине, алерт не асинхронный, и потому пока висел алерт, код дальше не выполнялся, а начинал выполнятся после закрытия алерта. Таким образом, пока вы тянулись мышкой закрывать алерт, давали браузеру время вставить и отобразить новый блок сообщений.

    Вся эта система по сути сейчас работает на багах, я бы советовал задать еще один вопрос о том как правильно сделать данный функционал (как оптимизировать объем передаваемых сообщений и обновление блока с сообщениями)
    Ответ написан
    Комментировать
  • Не работает без Alert, что за магия?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    Banan44, ваш вопрос дублирует другой ваш вопрос Не работает реализация алгоритма, поможете найти ошибку?
    Ответ написан
  • Как получить данные из select?

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

    Ответ написан
    Комментировать
  • Как сделать такую фильтрацию?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    Ответ написан
    Комментировать
  • Вопрос с собеседования - почему не меняется объект?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    потому что в строке
    let products = obj.data

    вы по сути в products вставляете ссылку на obj.data

    а в строке
    products = []

    вы заменяете эту ссылку на другую

    при этом содержимое
    obj.data
    тоже ссылка, и она остается прежней.

    другими словами: если вы записали на листок телефон своей девушки а потом найдя другую девушку, про старую решили забыть и зачеркнув ее номер написали номер новой девушки то прежня девушка никуда не исчезла? она ведь по прежнему сидит на своем номере телефона и ждет вашего звонка? (в данной ситуации products и есть этот листок с номером ))))

    ЗЫ: был несколько невнимателен, не достиг моего мозга последний абзац вашего вопроса. Ответили вы верно.
    Ответ написан
    2 комментария
  • Можно ли создать музыкальный сайт только на javascript?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    Да, это реально. Вам понадобятся backend и frontend. Посмотреть список технологий, используемых в обоих ветках можно тут https://proglib.io/p/webdev-2019/

    Если расписывать все в деталях, то я устану примерно на втором абзаце, и это будет меньше ~10% от того, что вам понадобится)

    ЗЫ: рекомендую начинать с чего нибудь попроще, например напишите для начала свой вариант игры "змейка", естественно с аудиосопровождением, с возможностью мультиплеера и рейтингом)
    Ответ написан
    9 комментариев
  • Как из плоского объекта с ключами, которые представляют собой несколько ключей склеенных через точку, сделать вложенный объект?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    Когда то делал что то подобное . Нужная вам логика в функции parsePermissions

    PS: вот поубирал лишнее и сделал демку (на выходе почти то что вы хотели). в самой функции parsePermissions тоже многое можно поубирать, но тут уж сами немного поработайте))))
    тык
    {
    ᠌ ᠌᠌ ᠌ ᠌ "foo": {
    ᠌ ᠌᠌ ᠌ ᠌ ᠌ ᠌᠌ ᠌ ᠌ "0": {
    ᠌ ᠌᠌ ᠌ ᠌ ᠌ ᠌᠌ ᠌ ᠌ ᠌ ᠌᠌ ᠌ ᠌ "first": 111
    ᠌ ᠌᠌ ᠌ ᠌ ᠌ ᠌᠌ ᠌ ᠌ },
    ᠌ ᠌᠌ ᠌ ᠌ ᠌ ᠌᠌ ᠌ ᠌ "1": {
    ᠌ ᠌᠌ ᠌ ᠌ ᠌ ᠌᠌ ᠌ ᠌ ᠌ ᠌᠌ ᠌ ᠌ "first": 222
    ᠌ ᠌᠌ ᠌ ᠌ ᠌ ᠌᠌ ᠌ ᠌ }
    ᠌ ᠌᠌ ᠌ ᠌ },
    ᠌ ᠌᠌ ᠌ ᠌ "bar": {
    ᠌ ᠌᠌ ᠌ ᠌ ᠌ ᠌᠌ ᠌ ᠌ "second": 333
    ᠌ ᠌᠌ ᠌ ᠌ }
    }





    PPS: и вот еще вариантик, но тоже на стал превращать объекты в массивы)))
    тык

    const insert = (target,path,value) => path.split(".").reduce((a,k,i,l)=>a[k]=i+1==l.length?value:a[k]||{},target);
    
    const parse = (list,result={}) => Object.keys(list).forEach(k=>insert(result,k,list[k]))||result;
    
    const output = parse(input);
    Ответ написан
    Комментировать
  • Как добавить данные в объект из input?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    3 комментария
  • Как сделать цикл с задержкой?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    Если я правильно понял вопрос, то так)
    (function ()
            {
                'use strict';
                if (!confirm('Удалить все лайки?')) return;
                var deleteLikeLink = document.body.querySelectorAll('.like_button_icon');
                setTimeout(()=>{
                   for (var i = 0; i < deleteLikeLink.length; i++)
                   {
                       deleteLikeLink[i].click();
                   }
                }, 1000);
                alert(deleteLikeLink.length + ' likes deleted');
            }());
    Ответ написан
    Комментировать
  • Как запомнить текст, который выполняется в функции?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    Основная проблема в получении body заключена в том, что request асинхронный. То есть ответ придет не сразу, а через какое то время, при этом, js не будет дожидаться этого ответа а продолжит выполнять код, находящийся после request-а. Это в свою очередь приведет к тому, что в этом коде мы не можем получить ответ request-а, так происходит потому, что ответ еще не пришел)
    Как же быть в этой ситуации???
    Почитать про ассинхронность, промисы и async/await

    Далее привожу простенький класс, умеющий кэшировать ответы requesta, и пример его использования:
    тык сюда

    var request = require("request");
    
    
    // создаем класс для кэширования результатов запросов
    class СacheRequest {
    	// конструктор
    	constructor(handler){
    		// создаем ассоциативный массив для кэширования результата
    		this.cache = {};
    	}
    	
    	// основной метод класса, предназначен для получения данных по ссылке
    	// принимает url в качестве параметра
    	// возвращает выполненный промис если запрос есть в кэше
    	// или промис в ожидании выполнения запроса
    	async get(url){
    		// если такой запрос уже был, возвращаем промис с результатом из кэша
    		if( this.cache[url] )
    			return  Promise.resolve(this.cache[url]);
    		
    		// иначе возвращаем промис с ожиданием результата
    		return new Promise((resolve,reject)=>{
    			// делаем запрос на указаный url
    			request(url, (error, response, body)=>{
    				// если ошибка - реджектим )
    				if( error )
    					return reject(error);
    				
    				// иначе запоминаем в кэше ответ
    				this.cache[url] = body;
    
    				// и резолвим body
    				resolve(body);
    			});			
    		});
    	}
    
    	// метод отчищает кэш
    	clear(){
    		this.cache = {};
    	}
    }
    
    // создаем экземпляр кэша
    const cacheRequest = new СacheRequest();
    
    // так как request асинхронный, то для того, чтобы получить 
    // результат запроса в "синхронном стиле" используем await
    
    // await можно использовать только внутри асинхронной функции.
    // для этой цели обернем блок с вызовами cacheRequest.get в
    // само вызывающуюся асинхронную функцию
    (async () => {
    	// выполняем запросы:
    	// запросим "http://google.ru/" (будет сделан фактический запрос)
    	let body = await cacheRequest.get("http://google.ru/");
    	console.log("\n\n\nBODY:", body, 111);
    
    	// еще раз запросим "http://google.ru/" (будет взято из кэша)
    	body = await cacheRequest.get("http://google.ru/");
    	console.log("\n\n\nBODY:", body, 222);
    })()
    
    // раз в сутки отчищаем кэш
    setTimeout(()=>{
    	cacheRequest.clear();
    }, 1000*60*60*24 ); // 1000*60*60*24 это количество миллисекунд в сутках

    Ответ написан
    1 комментарий
  • Как вынести за скобку отрицание с или?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    !( orgLawName && company && business && date && base && mber)
    Ответ написан
    Комментировать
  • Как изменить цвет по клику?

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

    1. вместо let u = document.querySelector('.u-p');
    должно быть let u = document.querySelectorAll('.u-p');

    2. вместо this[i].onclick = function() {
    должно быть u[i].onclick = function() {

    3. вместо u.style.color = 'red';
    должно быть u[i].style.color = 'red';

    Разберитесь с циклами и массивами а так-же будьте внимательней.

    let u = document.querySelectorAll('.u-p');
    for (let i = 0; i < u.length; i++) {
      u[i].onclick = function() {
        u[i].style.color = 'red';
      }
    }
    Ответ написан
    Комментировать
  • Как работает код?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    Потому что
    n-- не тоже самое что n-1
    Первое уменьшает n на единицу и возвращает результат.
    Второе возвращает число на еденицу меньше чем n. При этом само n остается прежним, в результате вы и получаете бесконечный цикл (ведь n не меняется)

    А вот следующие выражения идентичны:
    n=n-1;
    n-=1;
    n--;
    Ответ написан
    3 комментария
  • Почему числа выводятся начиная не с 0 а с 1?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    В этом варианте кода на момент вывода к i уже прибавлена единица. Соответственно вывод начнется со значения 1 и будет 1, 2, 3, 4, 5, 6, 7, 8, 9, 10
    var i = 0;
    while (i < 10) {
        i += 1;
        console.log(i)
    }


    А в этом варианте кода на момент вывода i единица еще не прибавлена. Соответственно вывод начнется со значения 0 и будет 0, 1, 2, 3, 4, 5, 6, 7, 8, 9
    var i = 0;
    while (i < 10) {
        console.log(i)
        i += 1;
    }
    Ответ написан
    8 комментариев
  • SpeechKit API на JS?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    вариант 1 (взят с qaru)

    Это возможно только при использовании XHR FormData API (ранее известный как часть XHR2 или XHR Level 2, в настоящее время известный как "Расширенные функции XHR" ).

    Учитывая этот HTML,

    <input type="file" id="myFileField" name="myFile" />


    вы можете загрузить его, как показано ниже:

    var formData = new FormData();
    formData.append("myFile", document.getElementById("myFileField").files[0]);
    
    var xhr = new XMLHttpRequest();
    xhr.open("POST", "myServletUrl");
    xhr.send(formData);


    XHR позаботится о правильных заголовках и запросит кодирование тела, и файл в этом примере будет доступен на стороне сервера как form-data с именем myFile.

    Вам нужно иметь в виду, что API FormData не поддерживается в старых браузерах. В caniuse.com вы можете увидеть, что он в настоящее время реализован в Chrome 7+, Firefox 3.5+, Safari 5+, IE 10+ и Opera 12+.


    вариант 2 (взят с qaru)

    (более подробное описание fetch API)

    // Это базовый пример с комментариями. Функция upload - это то, что вы ищете:
    
    // Select your input type file and store it in a variable
    const input = document.getElementById('fileinput');
    
    // This will upload the file after having read it
    const upload = (file) => {
      fetch('http://www.example.net', { // Your POST endpoint
        method: 'POST',
        headers: {
          // Content-Type may need to be completely **omitted**
          // or you may need something
          "Content-Type": "You will perhaps need to define a content-type here"
        },
        body: file // This is your file object
      }).then(
        response => response.json() // if the response is a JSON object
      ).then(
        success => console.log(success) // Handle the success response object
      ).catch(
        error => console.log(error) // Handle the error response object
      );
    };
    
    // Event handler executed when a file is selected
    const onSelectFile = () => upload(input.files[0]);
    
    // Add a listener on your input
    // It will be triggered when a file will be selected
    input.addEventListener('change', onSelectFile, false);




    ЗЫ: не забудьте указать правильные параметры аудиофайла
    Ответ написан
    Комментировать
  • Как переписать обычную функцию в стрелочную?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    var moveDown = () => {
               document.body.scrollTop = 940;
               document.documentElement.scrollTop = 940;
    }
    Ответ написан
    3 комментария
  • Какой язык можно использовать вместо JavaScript на фронтенде?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    Существуют. Делятся на 2 группы.

    Первая группа это языки транслируемые с помощью транспилеров в конечном итоге в обычный javascript , такие как typescript и т.д.
    Вторая группа это языки, требующие установки на клиенте специального плагина, например perlscript

    Вот немного про python Running Python in the Browser
    Ответ написан
  • Сортировка, в чем ошибка?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    const arr = [
        { name: "name1", name1: "name2" },
        { name: "Egor", name1: "Fill" },
        { name: "Egorka", name1: "beter" },
        { name: "fullName", name1: "Man" }
    ];
    
    
    const filterList = arr.filter(items =>
        Object.values(items).some(element => element.indexOf("Egor") > -1)
    );
    
    console.log(filterList);


    Сори. Чуть чуть обманул, теперь все верно)))
    на выходе
    [ { name: 'Egor', name1: 'Fill' }, { name: 'Egorka', name1: 'beter' } ]
    Ответ написан
  • Где делать GET запрос в NodeJS или JS?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    Если эти данные нужны только для отображения во фронте, делайте запрос во фронте
    Ответ написан
  • Не работает асинхрнонная функция при иморте в js?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    Все должно работать. Скорее всего вы не правильно импортируете/экспортируете ваш Reviews.

    Приведите пожалуйста примеры вашего кода:
    1. где вы производите экспорт Reviews
    2. где вы подключаете модуль с Reviews
    3. где вы вызываете Reviews.all(...)

    ошибка в одном из этих кусков кода.

    и хотелось бы увидеть содержимое функции responseBody для того чтобы смоделировать вашу ситуацию.

    ЗЫ: как это обычно и бывает, проблема в невнимательности (тоже иногда этим грешу)))
    res.body неопределен, вот и возвращает undefined

    замените в файле agent.js
    const responseBody = res => res.body;

    на
    const responseBody = res => res.data;

    вот пример

    agent.mjs
    import axios from 'axios';
    
    const API_ROOT = 'http://api.startgiven.ru:8080/stargiven-1.0/api';
    const API = api => `${API_ROOT}${api}`;
    
    const responseBody = res => res.data;
    
    const handleError = err => {
      if (err && err.response && err.response.status === 401) authStore.logout();
    };
    
    const request = {
      get: url =>
        axios
          .get(API(url))
          .catch(err => console.log(err))
          .then(responseBody)
    };
    
    const Reviews = {
      all: () => request.get('/comments')
    };
    
    export { Reviews };


    test.mjs
    import { Reviews } from './agent.mjs';
    
    console.log("test1:", Reviews );
    console.log("test2:", Reviews.all().then(a=>{
        console.log("test3:", a);
    }) );


    результат выполнения
    $ node --experimental-modules test.mjs 
    (node:2668) ExperimentalWarning: The ESM module loader is experimental.
    test1: { all: [Function: all] }
    test2: Promise { <pending> }
    test3: [
      {
        description: 'Все круто, очень. Молодцы!',
        email: 'ivanivanov@gmail.com',
        firstName: 'Иван',
        id: 10,
        lastName: 'Иванов',
        rate: 5,
        status: 0
      },
      {
        description: 'Все круто, очень. Молодцы!',
        email: 'ivanivanov@gmail.com',
        firstName: 'Иван',
        id: 11,
        lastName: 'Иванов',
        rate: 6,
        status: 0
      },
      {
        description: 'Все круто, очень. Молодцы!',
        email: 'ivanivanov@gmail.com',
        firstName: 'Иван',
        id: 12,
        lastName: 'Иванов',
        rate: 6,
        status: 0
      },
      {
        description: 'Все круто, очень. Молодцы!',
        email: 'ivanivanov@gmail.com',
        firstName: 'Иван',
        id: 13,
        lastName: 'Иванов',
        rate: 6,
        status: 0
      },
      {
        description: 'Все круто, очень. Молодцы!',
        email: 'ivanivanov@gmail.com',
        firstName: 'Иван',
        id: 14,
        lastName: 'Иванов',
        rate: 6,
        status: 0
      },
      {
        description: 'СУПЕР',
        email: 'info@3peaks.cloud',
        firstName: 'Aline',
        id: 15,
        lastName: 'Basdasd',
        rate: 5,
        status: 0
      },
      {
        description: 'СУПЕР',
        email: 'info@3peaks.cloud',
        firstName: 'Aline',
        id: 16,
        lastName: 'Basdasd',
        rate: 5,
        status: 0
      },
      {
        description: 'СУПЕР',
        email: 'info@3peaks.cloud',
        firstName: 'Aline',
        id: 17,
        lastName: 'Basdasd',
        rate: 5,
        status: 0
      },
      {
        description: 'СУПЕР',
        email: 'info@3peaks.cloud',
        firstName: 'Aline',
        id: 18,
        lastName: 'Basdasd',
        rate: 5,
        status: 0
      }
    ]
    Ответ написан