• Как работают циклы с таймаутом?

    bingo347
    @bingo347 Куратор тега JavaScript
    Crazy on performance...
    Первое что нужно понять, таймер работает асинхронно, а значит будет выполнен после цикла.
    Второе - let имеет блочную область видимости (переменная видна в том блоке, где была объявлена, при этом первый операнд for считается тем же блоком, что и тело цикла)
    Третье - циклы создают новый скоуп на каждую итерацию (на каждой итерации будет свой let i, при условии что этот оператор внутри цикла)

    Ну и еще, в Ваших примерах 1000 относится не к таймауту, это просто бесполезная операция, а таймаут получит значение по умолчанию - 0, думаю это не совсем то, что Вы ожидаете.

    Еще один важный момент, функциональное выражение (а стрелочная функция - это тоже функциональное выражение) внутри цикла будет создавать по функции на каждой итерации цикла. Это очень плохо и по памяти и по производительности (такие функции еще и компилироваться и оптимизироваться будут раздельно). И если в случае с let внутри цикла функции хотя бы будут отличаться замыканием (каждая замкнет свою i), то в первом случае будет 5 абсолютно идентичных функций.
    Тут можно очень хорошо показать себя, если помимо объяснения принципов работы вспомнить, что setTimeout умеет передавать аргументы в свой колбэк:
    const f = i => {
      console.log(i);
    };
    for (let i = 0; i < 5; i++) {
      setTimeout(f, 1000, i);
    }
    Ответ написан
    Комментировать
  • Откуда ошибка рендеринга в react-router?

    Hecc
    @Hecc
    Frontend. Дизайн. Шрифт.
    Из любого рендера в реакте вообще не стоит запускать никаких асинхронных действий.
    Тут стоит использовать вместо метода render, метод component и передать туда компонент в котором нормально обработать запрос.

    Если компонент классовый то в методе componentDidMount(), если функциональный - то через useEffect()

    const Render = () => (
        <Route path="/daily/:coord" component={ SuperComponent } />
    )
    
    const SuperComponent = ({ match }) => {
        let [ data, setData ] = useState( null );
        let coord = match.params.coord;
    
        useEffect( () => {  
            setData( hundlerURLRequest( coord  ) );
        }, [hundlerURLRequest, setData, coord ]);
        
        return <DailyWeather coords={data} />
    }
    Ответ написан
    2 комментария
  • Как получить ответ по fetch до рендеринга DOM дерева?

    yarkov
    @yarkov
    Помог ответ? Отметь решением.
    if (данные) {
      <Component/>
    }

    Так?
    Ответ написан
    2 комментария
  • Как убрать отступ у текста в select?

    dasnein
    @dasnein
    Добавьте к стилям select
    appearance: none;
    -webkit-appearance: none;
    Ответ написан
    5 комментариев