• Рекурсивный перебор сквозь пространство js?

    Aetae
    @Aetae Куратор тега JavaScript
    Тлен
    В современном js увы никак.
    Раньше когда был только var - все глобальные переменные лежали в window.
    Сейчас, однако, есть const и let которые никак не получить.
    Ответ написан
  • Как однозначно идентифицировать отметки из разных инпутов (radio, checkbox) разбросанных по сайту?

    Aetae
    @Aetae Куратор тега JavaScript
    Тлен
    В наше время правильный ответ: юзать фреймворки или, хотя-бы, либы для форм. Оно вам всё как надо соберут сами. Делать всё ручками - только на баги напрашиваться.
    Ответ написан
  • Зачем преобразовывать ES модули в CommonJS?

    Aetae
    @Aetae Куратор тега JavaScript
    Тлен
    Ну потому что старые браузеры не умеют в esmodules, а изначальная идея babel как раз в поддержке старых браузеров - всё остальное наслоилось после.
    Также esm нельзя скомпоновать в один файл, в отличие от CommonJS.
    В любом случае это лишь умолчания, которые вы всегда можете поменять.
    Ответ написан
    4 комментария
  • Как лучше организовать мобильные и десктопные версии компонентов в vue?

    Aetae
    @Aetae Куратор тега Vue.js
    Тлен
    Ну если оптимизировать - то desctop в mobile на ходу превратиться не может(может конечно, но такие "экспериментаторы" не обломятся перегрузить страницу). В таком случае: вынести экспорты таких "двойных" компонентов в отдельный файл который сразу при загрузке экспортируют нужный вариант, без всякой лишней динамики.

    Если же делать динамично, то написать функцию хэлепер, которая принимает на вход обе версии компонента и возвращает вспомогательный функциональный pass through компонент, который выбирает нужный из двух, а всё остальное просто пробрасывает.
    Ответ написан
    Комментировать
  • Как можно улучшить этот код?

    Aetae
    @Aetae Куратор тега JavaScript
    Тлен
    1. Запросы вместо await по порядку стоит объединить в await Promise.All чтоб сразу все три значения получал, а лучше вообще объединить их на сервере в один запрос.
    2. Стоит вместо first, second, third генерировать массив значений, не зависимый от количества(вдруг скоро юани станут важны). Соответственно и табличку строить от этого массива.
    3. Вычисляемые вещи типа data.first.RUB / data.first.USD - хранить в переменных, чтоб десять раз не перевычислять. (это мелочи по производительности, но не эстетично)
    Ответ написан
    1 комментарий
  • Как прервать Promise.all?

    Aetae
    @Aetae
    Тлен
    Как-то так:
    function makeRejectable(...promisess) {
      let reject;
      const rejector = new Promise((_, r) => reject = r);
      
      const promise = Promise.race([
        Promise.all(promisess),
        rejector
      ]);
      
      return [promise, reject]
    }
    
    const [promise, reject] = makeRejectable(...promisess);
      
    promise.then(console.log, console.error);
      
    reject('reject');
    Ответ написан
    1 комментарий
  • Как импортировать функцию из пакета KeystoneJS?

    Aetae
    @Aetae Куратор тега JavaScript
    Тлен
    В typescript то что после двоеточия - это описание типов. Для js оно не нужно и в принципе, в его понимании, не существует.

    Убери его, и всё заработает:
    import { DocumentRenderer } from '@keystone-next/document-renderer';
    
    const renderers = {
      inline: {
        bold: ({ children }) => {
          return <strong>{children}</strong>;
        },
      },
      block: {
        paragraph: ({ children, textAlign }) => {
          return <p style={{ textAlign }}>{children}</p>;
        },
      },
    };
    
    <DocumentRenderer document={document} renderers={renderers} />;
    Ответ написан
  • Как прикрутить автогенерацию типов на чистом Rest API (без GraphQL)?

    Aetae
    @Aetae Куратор тега TypeScript
    Тлен
    Да через сваггер. openapi-generator и прочее.
    Ответ написан
    Комментировать
  • Почему возникает ошибка с map в реакте?

    Aetae
    @Aetae
    Тлен
    const [data, setData] = useState([]);

    Сейчас по порядку у тебя так:
    1.
    const [data, setData] = useState(); // data === undefined

    2. data.map((item, idx) => ( // error
    3. fetchData
    4. Цифры текут по проводам...
    5. setData // data === json с сервера
    6. data.map((item, idx) => ( // ok
    Ответ написан
    Комментировать
  • Расширение, меняющее цвет посещённых ссылок -?

    Aetae
    @Aetae
    Тлен
    Для таких вещей нет смысла ажно целое расширение писать, есть юзерскрипты: ставишь tempermonkey и сразу пишешь код.

    Конкретно задача обычно решается добавлением inline стиля(не важно в юзерскрипте или в расширении), примерно как показал Александр .
    У меня в глобальном юзерскрипте для этого такая функция пошарена) :
    tm_css(css, important) {
      if(important) {
        css = css.replace(/(?=[^\n\S]*;[^\n\S]*\n|[^\n\S]*\n[^\n\S]*\})/g, ' !important');
      }
      (document.body||document.head||document.documentElement)
        .insertAdjacentHTML('beforeend', `<style is="tm_css">${css}</style>`);
    }


    Однако в расширении таки можно подключать локальные ресурсы(не рандомные, а самого расширения, но всё же).
    Ответ написан
    Комментировать
  • Как в javascript игнорировать   и(или) считать его простым пробелом?

    Aetae
    @Aetae Куратор тега JavaScript
    Тлен
    Вместо конкретно пробелов использовать в регулярках "любой пробельный символ": /\s/.
    Скобки надо, очевидно, экранировать: /\(текст\)/.

    Можно написать вспомогательную функцию, чтоб вручную не писать страшые вещи типа
    /тут\s+длинная\s+строка.\s+слова\s+разделены\s+пробелами/g
    :
    function spacify(regexp) {
      const { source, flags } = regexp;
      return new RegExp( source.replace(/\s+([*+{?])?/g, (_, mod) => `\\s${mod ?? '+'}`), flags )
    }


    Либо написать вспомогательную функцию, которая будет заодно и экраировать:
    function escapeRegExp(string) {
      return string.replace(/[.*+?^${}()|[\]\\]/g, '\\$&'); 
    }
    function toSpacedRegExp(string, flags = 'g') {
      return new RegExp( escapeRegExp(string).replace(/\s+/g, '\\s+'), flags )
    }
    // /тут\s+длинная\s+строка\.\s+слова\s+разделены\s+пробелами/g
    const text = toSpacedRegExp('тут длинная строка. слова разделены пробелами')
    Ответ написан
  • Стрелочная функция и контекст?

    Aetae
    @Aetae Куратор тега JavaScript
    Тлен
    В моем понимании стрелочная функция берет контекст при объявлении

    Не совсем при объявлении, скорее при создании.(хотя это одно и тоже, но так меньше непонимания, имхо)
    Соответственно при создании нового экземпляра класса объявляется(создаётся) новая стрелочная функция в контексте этого экземпляра. По сути это просто свойство, уникальное для каждого экземпляра, в отличие от метода, который один для всех.

    class Car{
        constructor() {
            this.name = "BMW"
        }
        showname = () => {
            console.log(this.name);
        }
    }
    let { showname } = new Car();
    let obj = {
      name: 'random',
      showname
    }
    obj.showname() // всё равно BMW


    Вообще все свойства в классе объявляются(создаются) в контексте экземпляра:
    class Car {
        storedThis = this
    }
    const car = new Car();
    const { storedThis } = car;
    car === storedThis; // true

    После же того как они были созданы они живут обычной жизнью.
    Ответ написан
    Комментировать
  • Как переделать функцию в jsx, чтобы не было ошибки?

    Aetae
    @Aetae
    Тлен
    Неправильно понимаешь.
    К jsx это вообще отношения не имеет.
    Включённое по умолчанию eslint правило не любит когда тренарный оператор "висит в воздухе"(не назначен переменной или не передан в функцию, например). Перепиши на if else, как-то используй результат(например return isOnSa...), или отключи\заигнорь правило - никакой реальной проблемы тут нет, просто такие конструкции зачастую могут быть ошибкой(когда ты просто забыл использовать результат).
    Ответ написан
    Комментировать
  • Не складываются числа типа number?

    Aetae
    @Aetae Куратор тега JavaScript
    Тлен
    parseInt -> parseFloat
    Ответ написан
    Комментировать
  • Как правильней сделать роут vue-router?

    Aetae
    @Aetae Куратор тега Vue.js
    Тлен
    Все именованные параметры экранируются. Если article не несёт никакого практического смыла - то логично её просто выкинуть.

    Однако если очень нужно, можно делать так: path: "/news/*", - звёздочка исключение и не экранируется.
    Ответ написан
    Комментировать
  • Как правильно хранить и показывать отмеченные сущности во vueJS 2?

    Aetae
    @Aetae Куратор тега Vue.js
    Тлен
    Также как раньше жили, без этих ваших новомодных Set\Map:
    chosenLangs: {},
    
    clickLang(id) {
      return this.isIssetLang(id) 
        ? this.$delete(this.chosenLangs, id) 
        : this.$set(this.chosenLangs, id, true);
    },
    
    isIssetLang(id) {
      return id in this.chosenLangs;
    },
    Ответ написан
    1 комментарий
  • Как метод сделать generic?

    Aetae
    @Aetae Куратор тега TypeScript
    Тлен
    А зачем? Ты ведь явно указываешь что результат - Observable<PayerTypes>. Другим он быть не может и ни от чего не зависит. Зачем там url?

    Или может ты имеешь ввиду что-то типа такого:
    type Urls = {
        getPayerTypes: PayerTypes;
        getNPCTypes: NPCTypes;
    }
    
    private httpGet<K extends keyof Urls>(url: K): Observable<Urls[K]> {
      return this.http.get<Urls[K]>(url)
        .pipe(
          pluck('data'),
          catchError(this.handleError)
        );
    }
    Ответ написан
    Комментировать
  • Действия внутри конструкторов?

    Aetae
    @Aetae Куратор тега JavaScript
    Тлен
    Внутри конструктора можно делать всё что хочешь. Конструктор практически обычная функция(мелкие детали пока для вас не важны).
    Ответ написан
    5 комментариев
  • Верстка ромба с хвостиком?

    Aetae
    @Aetae
    Тлен
    А проблем то в чём?
    Блок, в нём по центру background: linear-gradient и :before/after повёрнутый квадрат.
    Условно так:
    Ответ написан
    Комментировать
  • Как динамически продублировать кусок кода?

    Aetae
    @Aetae
    Тлен
    Во всех IDE для веба есть Emmet: пишете div.text$*3 - тыкаете tab и готово.
    Если же вам надо на самом сайте, то обрисуйте конкретнее задачу.
    Ответ написан