2

このJavascriptコードをリファクタリングするのを手伝ってください。スケジュールされたメッセージ送信には大きな形式があります(送信日、繰り返しタイプ、日付/数量で終了、クレジットシステム-実行時にスケジュールされた送信プランの総コストをカウントする必要があります)。このフォームのJavascriptバリデーターを書いています。

検証アルゴリズムがあります1)送信日時が過去の瞬間にないかどうかを確認します2)「日付で終了」フィールド時間が最初の送信日時よりも大きいかどうかを確認します3)スケジュール計画の総コストを検証します

(約6つのステップがありますが、ここに3つだけ記述します-問題を把握するのに十分だと思います)

「スケジュールされたプランを保存」ボタンには、「クリック」イベントのJavaScriptリスナーがあります。このリスナーはこの関数を呼び出します。

ScheduledValidator.checkIfSendDateTimeIsNotInPast(params, form);

これがその宣言です:

ScheduledValidator.checkIfSendDateTimeIsNotInPast = function (params, form) {
    var conn = new Ext.data.Connection();

    conn.request({
        url: CONST.BASE_URL + 'url',
        params: params,
        callback: function (options, success, response) {
            response = Ext.util.JSON.decode(response.responseText);
            if (response.success == false) {
                // display error messages
            } else { 
                ScheduledValidator.checkIfEndDateIsGreaterThatSendDate(params, form);
            }
        }
    });
}

後でリクエストをネストしました:

ScheduledValidator.checkIfEndDateIsGreaterThatSendDate = function (params, form) {
var conn = new Ext.data.Connection();

conn.request({
    url: CONST.BASE_URL + 'url2',
    params: params,
    messageForm: form,
    callback: function (options, success, response) {
        response = Ext.util.JSON.decode(response.responseText);
        if (response.success == false) {
            // display error messages
        } else {
            ScheduledValidator.validateTotalCost(params, form);
        }
    }
});
}

そしてもう1つここに:

ScheduledValidator.validateTotalCost = function (params, form) {
...

私はそのアプローチが好きではありません。アルゴリズムを一目で理解するのは非常に難しいからです。たぶん、単一のフォームの検証のために多くの(約6)ネストされたAJAXクエリを作成するのは良くありませんか?たぶんそれは単一のリクエストにマージされるべきであり、その後、サーバー側ですべての検証アクティビティを実行しますか?このコードをどのようにリファクタリングする必要がありますか?

4

1 に答える 1

2

コードをリファクタリングする前に、ズームアウトしてフォームプロセスとユーザーエクスペリエンスがどのように機能するかを評価することをお勧めします。

たとえば、日付を入力するときにすぐにユーザーにフィードバックを提供する必要がありますか?彼女がフォームへの記入を完了するまで待つことはできますか?その場合は、通常のフォーム投稿を使用して、送信サーバー側を検証し、フィードバックを返すことができます。

そうでない場合で、経験に即時のフィードバックが必要な場合は、フォームの検証を処理するために、実装の周りにジェネリックラッパーを作成することを検討することをお勧めします。これは手動で行うことも、必要に応じて特定のURLとコールバックを定義できるフォーム検証メカニズムをGoogleで探すこともできます。

3番目のオプションは、サーバーに接続せずにクライアント側で検証を行うことです。ロジックをJavascriptで実行できるかどうかを判断し(おそらく、日付の計算が含まれる場合、これはそれほど難しいことではありません)、それを実行するレイヤーを追加して、サーバーに接続する必要がないようにします。最初の場所。ボーナス:サーバー側のコードの応答速度によっては、これによりユーザーエクスペリエンスが実際に向上する可能性があります(ただし、サーバー側の検証は必須であることに注意してください)。

質問で示したユースケースの例から、私の以前の提案が当てはまるように思われます。つまり、フォームが正しく入力されているかどうかについて、フィードバックをすぐに受け取る必要はありません。私の状況の理解が正しければ、AJAX呼び出しを削除して通常の形式で機能させることでリファクタリングプロセスを開始し、機能するようになったらクライアント側のみの検証を追加することをお勧めします。

于 2009-03-22T00:11:07.890 に答える