Задать вопрос
  • .stopPropagation() на самом деле не останавливает распространение события?

    IvanU7n
    @IvanU7n
    nothing interesting here
    Всё правильно получается? stopPropagation не блокирует распространение события, в определении в документации ошибка?

    неправильно, JS-события и стандартное поведение браузера связаны между собой опосредовано
    если на событии не было вызвано event.preventDefault(), то действие по умолчанию произойдёт независимо от того дошло ли событие до цели или нет
    более того есть события, которым чихать на event.preventDefault(), т.к. действие по умолчанию происходит до события (тот же input)
    Ответ написан
    5 комментариев
  • Почему при переносе элементов столбцы получаются разной ширины?

    delphinpro
    @delphinpro Куратор тега CSS
    frontend developer
    Занимают ширину пропорционально содержимому

    Вот когда имеем дело со строками, то там все нормально - высота контейнера делится между получившимися строками поровну.

    вовсе нет. просто у вас все строки одинаковой высоты. Попробуйте в одну из них добавить например <br>
    Ответ написан
    1 комментарий
  • Как правильно сформировать объект-результат в перегруженной функции в TypeScript?

    Alexandroppolus
    @Alexandroppolus
    кодир
    type Reserve = {
      (from: Date, to: Date, destination: string): Ticket;
      (from: Date, destination: string): Ticket
    };
      
    const reserve: Reserve = (from: Date, ...args: [toOrDest: Date, destination: string] | [destination: string]): Ticket => {
      const isOne = args.length === 1;
    
      return {
        type: isOne ? "one-way" : "two-way",
        from,
        destination: isOne ? args[0] : args[1],
        ...(isOne ? {} : {to: args[0]})
      };
    };


    На самом деле, такая запись уже даёт перегрузку функции, даже если отсюда вообще выкинуть тип Reserve. Но тогда при наведении мыши на reserve будет не совсем понятная подсказка (хотя автокомплит вполне корректный).

    Ну а для данного примера лучше всего просто передвинуть параметр destination на нулевую позицию, тогда у тебя будет просто необязательный параметр в конце списка
    Ответ написан
    5 комментариев
  • Как в react работать с большим количеством данных?

    Kentavr16
    @Kentavr16
    long cold winter
    Путей решений большое количество, и они зависят от твоих хотелок.
    Вариант а - с кульбитами, но я бы так сделал. Пишешь небольшой бекенд на экспрессе для своего приложения. На беке с помощью cron например раз в день/час/несколько минут делаешь запрос на нужное апи, записываешь в своей бд ответ. Вопрос с лимитом запросов решен. далее делаем пагинацию на своем сервере (очень простое действие) и отправляешь пользователю человеческий ответ по АПИ, который будет соответствовать всем твоим запросам и нуждам. На фронте остается допилить простое СПА без извращений и сложностей.
    Вариант б - сохраняешь ответ на клиенте, обновляешь кеш раз за n-ное время, как предложено выше. В таком случае проще всего действительно использовать локалстор для хранения ответа по АПИ. Если хочется более продвинутой работы, обрати внимание на indexedDB -есть несколько интересных адаптеров для реакта, которые упрощают работу.
    Вопрос с сохранением данных при переходе на другую страницу решается просто (я догадываюсь что под другой страницей ты подразумеваешь роутинг в react SPA). Это либо хранение состояния на верхнем уровне приложения, либо стейт менеджер. Внимание - стейт-менеджер только упрощает(!!!) обращение со сложным стейтом в относительно больших приложениях. Это не панацея, по факту он делает то же самое что и обычный хук стейта. Тебе скорее всего не принципиально, но при желании пришить условный zustand можно. Это вкусовщина.
    Можно вообще написать кастомный хук для работы с локалстором/индекседДБ и юзать на каждой странице, считывая при заходе на каждую страницу данные и одновременно проверяя их "свежесть". Тогда стейт менеджеры точно не нужны от слова совсем.
    Ответ написан
    1 комментарий
  • Как работает then в промисах?

    alexey-m-ukolov
    @alexey-m-ukolov Куратор тега JavaScript
    Здесь можно даже и не заподозрить, что then что-то возвращает.
    Все функции в js что-то возвращают. Если явного return нет или в нём не указано значение, то возвращается undefined.

    Но поскольку там null, можно подумать, что исходный промис просто как-то передается дальше.
    Так и есть - вы не передали никакой callback и весь этот вызов как бы игнорируется. Этот сценарий аналогичен предыдущему.

    Еще интереснее - then возвращает простое значение, которое моментально попадает в следующий then.
    Это ваш callback возвращает простое значение, которое then оборачивает в отрезолвленный промис.

    Можете рассказать в общих чертах, если then возвращает промис, то как он его формирует?
    Ну берёт и формирует... Примерно так:
    then = (onFulfilledCallback, onRejectedCallback) => {
      try {
        let newValue;
    
        if (this.previousValue instanceof Error) {
          newValue = onRejectedCallback(this.previousValue);
        } else {
          newValue = onFulfilledCallback(this.previousValue);
        }
    
        if (newValue instanceof Promise) {
          return newValue;
        } else {
          return Promise.resolve(newValue);
        }
      } catch (error) {
        return Promise.reject(error);    
      }
    }
    Это псеводокод но общий смысл такой.
    Ответ написан
    5 комментариев
  • Какова механика работы метода bind?

    VoidVolker
    @VoidVolker Куратор тега JavaScript
    Dark side eye. А у нас печеньки! А у вас?
    bind кэширует текущее значение своего this в момент своего вызова, т.е. он привязывает именно функцию, а не объект, в котором находится функция. Иначе нельзя было бы вызывать bind на просто функции по типу foo.bind(abc). В мануале, кстати, описано что именно она кэширует - там полный список есть: https://developer.mozilla.org/ru/docs/Web/JavaScri...

    Упрощенный пример реализации bind для понимания механизма:
    function binder(that) { 
        let targetFunction = this; // кэш целевой функции
        return function() { targetFunction.call(that) } // В возвращаемой функции используем кэш
    }
    
    let user = {
      name: "Tom",
      intro() {
        console.log("I am " + this.name);
      }
    }
    
    user.intro.binder = binder 
    let f = user.intro.binder(user);
    
    setTimeout(f, 1000);
    
    user.name = "Sid";
    user.intro = function() {
      console.log("Вообще другая функция. name: " + this.name);
    }
    Ответ написан
    1 комментарий
  • Как работает синхронный вызов в микросервисах?

    Я хочу уточнить - блокируется микросервис (мс) вообще целиком или все-таки только поток, из которого сделан вызов?

    Блокировка чисто логическая. Благодаря асинхронщине, в большинстве языков никакие потоки блокироваться не будут. Будет только приостановлено выполнение кода в рамках какого-то процесса.

    Я себе представляю работу так: пусть у нас 2 мс, А и В, сделаны на Spring Web или любом другом веб-фреймворке. Каждого мс по одному экземпляру.
    * Пользователь что-то щелкает.
    * запрос уходит в А.
    * в А создается новый поток (или берется из пула - не важно) для обслуживания пришедшего запроса.
    * А вызывает В и ждет от него ответа.
    * при этом блокируется не весь А, а только поток, который обслуживает запрос.

    Условно так, но на практике даже поток не будет блокироваться - только обработка запроса от пользователя (пользователь не получит ответ, пока B не вернёт ответ)

    Стало быть, если другой пользователь тоже что-то щелкнет, то его запрос тоже будет обслуживаться отдельным потоком, и поэтому сам мс А не блокируется, продолжает нормально работать. Так почему тогда в книге написано, что блокируется микросервис?

    В книге так написано, чтобы было различие между асинхронными и синхронными запросами.
    При асинхронных запросах, вызывающий сервис вообще ничего не должен ждать - он получит уведомление о том, что его запрос обработан.
    Ответ написан
    Комментировать
  • Как работает синхронный вызов в микросервисах?

    AshBlade
    @AshBlade
    Просто хочу быть счастливым
    блокируется микросервис (мс) вообще целиком или все-таки только поток, из которого сделан вызов?

    Блокируется поток (т.к. коммуникация идет с гранулярностью в 1 поток).

    Блокирующий вызов означает, что вызывающая сторона ОЖИДАЕТ ответа.
    Это сравнивается с НЕБЛОКИРУЮЩИМИ запросами, например, запись в очередь.

    Примеры блокирующих:
    - HTTP
    - gRPC
    - отправляешь сообщение в одну очереди и начинаешь читать ответ из другой (это тоже блокирующий)

    Примеры НЕблокирующих:
    - Kafka, Rabbit
    - Outbox (паттерн)

    Так почему тогда в книге написано, что блокируется микросервис?

    Значит, неправильно описал, не те слова подобрал
    Ответ написан
    3 комментария