bugfix> javascript > 投稿

私はJSに次のコードを持っています(最後のES2020を使用)、現在のコードはタイプが 'asporto' または 'takeaway' タイプの設定から現在の日付時間に追加します 'takeaway' または 'asporto' そして、別のセットアップが呼び出された場合 limiteOreTakeaway/Asporto です !== '00:00:00' 現在の時間がより大きいかどうかを確認する必要があります limiteOreTakeaway/Asporto 、だから私は文字列を分割しています limiteOreTakeaway/Asporto 時間と分に移動し、現在の日付が>それであるかどうかを確認します limiteOreTakeaway/Asporto セットアップからの時間+24時間をcurDateに追加します。

私のコードは次のようになります:

const curDate = new Date();
    if (this.carrello.tipo === 'asporto') {
      if (this.negozioSetup.limiteOreAsporto !== '00:00:00') {
        // controllo se l'orario limite è impostato (orariolimite != 00:00)
        const ore = parseInt(
          this.negozioSetup.limiteOreAsporto.split(':')[0],
          10
        );
        const minuti = parseInt(
          this.negozioSetup.limiteOreAsporto.split(':')[1],
          10
        );
        // controllo se l'ora di adesso ha superato l'orario limite
        if (curDate.getHours() > ore) {
          curDate.setHours(
            curDate.getHours() + this.negozioSetup.oreMinimeAsporto + 24
          );
         // se l'ora corrente è uguale controllo se i minuti limite hanno superato il limite
        }else if (curDate.getHours() === ore && curDate.getMinutes() > minuti) {
            // se l'orario corrente è maggiore di quello limite aggiungo 24 ore alla data corrente
            curDate.setHours(
              curDate.getHours() + this.negozioSetup.oreMinimeAsporto + 24
            );
        }
      } else {
        // orario limite disabilitato proseguo con l'aggiunta delle ore minime tra gli ordini
        curDate.setHours(
          curDate.getHours() + this.negozioSetup.oreMinimeAsporto
        );
      }
    } else if (this.carrello.tipo === 'takeaway') {
      if (this.negozioSetup.limiteOreTakeaway !== '00:00:00') {
        const ore = parseInt(
          this.negozioSetup.limiteOreTakeaway.split(':')[0],
          10
        );
        const minuti = parseInt(
          this.negozioSetup.limiteOreTakeaway.split(':')[1],
          10
        );
        if (curDate.getHours() > ore) {
          curDate.setHours(
            curDate.getHours() + this.negozioSetup.oreMinimeTakeaway + 24
          );
        }else if (curDate.getHours() === ore && curDate.getMinutes() > minuti) {
          curDate.setHours(
            curDate.getHours() + this.negozioSetup.oreMinimeTakeaway + 24
          );
        }
      } else {
        curDate.setHours(
          curDate.getHours() + this.negozioSetup.oreMinimeTakeaway
        );
      }
    }

簡略化したいと思います。可能であれば、ES2020で利用可能な最新のツールを使用して最適化します。

回答 1 件
  • 繰り返す代わりに関数を使う間の唯一の違い tipo === 'asporto' ブランチと tipo === 'takeaway' ブランチは、渡されるプロパティ名です setHours :どちらか .oreMinimeAsporto または .oreMinimeTakeaway 。その値をパラメーターとして受け取る関数を作成し、いずれかを使用して呼び出します .oreMinimeAsporto または .oreMinimeTakeaway 代わりに。これにより、コードのサイズが約半分になります。

    const curDate = new Date();
    const { tipo } = this.carrello;
    if (tipo === 'asporto' || tipo === 'takeaway') {
        const casedProp = tipo[0].toUpperCase() + tipo.slice(1);
        changeDate(
            currDate,
            this.negozioSetup['oreMinime' + casedProp],
            this.negozioSetup['limiteOre' + casedProp],
        );
    }
    
    

    一度だけ分割して構造を解除するつかむために ore そして minti 一度に値。使用することもできます Number の代わりに parseInt(str, 10) 、および使用 .map 両方の要素に一度に変換を適用するには:

    const [ore, minuti] = this.negozioSetup.limiteOreAsporto.split(':').map(Number);
    
    

    関数を呼び出す一度複数回ではなく可能であれば-電話する必要はありません getHours 毎回、一度呼び出して結果を変数に格納することをお勧めします。

    const currHours = curDate.getHours();
    const currHoursWithOffset = currHours + oreMinime;
    
    

    インデント地獄を避けるために早く戻る-たくさん読んで {} ブロックを使用すると、コードが必要以上に読みにくくなる可能性があります。の場合 00:00:00 、大きなものではなく、必要な1行を実行してから戻ることを検討してください if / else

    の枝 currHours > ore そして curDate.getHours() === ore && curDate.getMinutes() > minuti ブランチ内にも同じロジックが含まれているため、それらを1つに結合します if ステートメント:

    const changeDate = (date, oreMinime, limiteOre) => {
        const currHours = curDate.getHours();
        const currHoursWithOffset = currHours + oreMinime;
        if (limiteOre === '00:00:00') {
            curDate.setHours(currHoursWithOffset);
            return;
        }
        const [ore, minuti] = limiteOre.split(':').map(Number);
        if (currHours > ore || currHours === ore && curDate.getMinutes() > minuti) {
            curDate.setHours(
                currHours + oreMinime + 24
            );
        }
    };
    const curDate = new Date();
    const { tipo } = this.carrello;
    if (tipo === 'asporto' || tipo === 'takeaway') {
        const casedProp = tipo.slice(1).toUpperCase() + tipo.slice(1);
        changeDate(currDate, this.negozioSetup['oreMinime' + casedProp]);
    }
    
    

    結合されたステートメントが読みにくいと思われる場合は、最初に値を変数に入れることができます(私はそれをあなたに任せます、私は言語を理解していません)-例えば

    const cond1 = currHours > ore;
    const cond2 = currHours === ore && curDate.getMinutes() > minuti;
    if (cond1 || cond2) {
      // ...
    }
    
    

    複数の個別のプロパティの代替より広いスケールでは、間の相関関係をハードコーディングする必要があります this.carrello.tipo そしてその this.negozioSetup.oreMinime- プロパティは少し奇妙です。可能であれば、2つがなるようにデータを再配置することを検討してください oreMinime そして limiteOre 値はオブジェクト2つの別々のプロパティではなく。次に、ブラケット表記を使用してオブジェクトの値を検索する必要があります。

    ore: {
      asporto: { minime: <value>, takeaway: <value> },
      takeaway: { minime: <value>, takeaway: <value> },
    }
    
    

    次に、次のことができます。

    changeDate(currDate, this.negozioSetup.ore[tipo]);
    
    

    と変更 changeDate 必要に応じてのパラメータ。

あなたの答え