document.querySelector('form').addEventListener('submit', e => {
    e.preventDefault();

    const title = input.value;

    fetch('?action=add', {
      method: 'POST',
      body: new URLSearchParams({
        title: title,
        token: token,
      }),
    })
    .then(response => response.json())
    .then(json => {
      addTodo(json.id, title);
    });

    input.value = '';
    input.focus();
  });

このコードにおいてconst title = input.valueの中は最初は、inputの中身になるのはわかります。
が非同期処理でinput.value = ''この部分から先に処理をされて、中身は空文字列になりそのあとにfetchの中の処理が行われるような感じがしてしまいます。
なぜ、fetchの中身のtitleは空文字列にならないのですか？