JavaScriptMVCのデータ処理


しばしば、プロジェクトで作成され、データを変更すると、フロントに提出されたデータ検証、移行が行われます.その後、バックグラウンド処理に提出します.このステップは私たちの開発者が必ず完成しなければならない仕事です.以前は、データ検証や移行を行う際に、さまざまな検証とデータ移行をツールファイルに作成し、プロジェクト全体に必要な場所で呼び出すようにしていました.JavaScriptMVCを使ってWebプロジェクトを開発する場合も、このように検証できますか?答えは肯定的だ.しかし、もし私たちが前の方法で検証と転換を完成すれば、それは本当にMVCのフレームワークを浪費して、それは私たちが書いた検証とデータの転換を制御層に書くのではなく、データ層に置いて、このようにオブジェクトのプログラミング規範に合っているのではないでしょうか.そして、読み取りとメンテナンスがもっと便利で速いです.では、JavaScriptMVCのデータ検証と移行のメリットについてお話しします.次に、JavaScriptMVCでデータを検証し、移行する方法を学びましょう.まず、私たちが最もよく使う検証について説明します.私たちはそのプロジェクトでこの仕事を完成します.いろいろな検証手法について、みんなもすでに知っています.ここでは、いろいろな検証を例に挙げることはできません.私はJavaScriptMVCの中でそれらのツールを提供して、検証コードをより簡単に書くことができます.そしてすべて私たちの普段のニーズを満たしています.JavaScriptMVCは認証機能を持っていますね.APIを見てみました.認証機能はJavaScriptMVCのModelの下にあるモジュールvalidationsで、よく使われる検証を完了し、ユーザーに認証をカスタマイズするインタフェースを残しています.では、Validationsは一般的な検証関数を提供していますが、ユーザーにカスタム検証インタフェースを提供するにはどうすればいいのでしょうか.以下、一つ一つリストします.
 
   /**
    *    validateFormatOf
    * 
    *               
    * @param {Array|String}        
    * @param {RegExp}         
    * @param {Object}    ,     2     ,message:      ,testIf:        ,  true   ,false,   
    *   :validateFormatOf(["name"],/(d+)/,{message:'      ',testIf:function(){return false;}});
    */
	
	
   /**
    *    validateInclusionOf
    * 
    *                
    * @param {Array|String}        
    * @param {Array}        
    * @param {Object}    ,     2     ,message:      ,testIf:        ,  true   ,false,   
    *   :validateInclusionOf(["name"],["lisi","test"],{message:'       ',testIf:function(){return false;}});
    * 
    *     name      lisi  test,   ,     ,  ,      
    * 
    */
   /**
    *    validateLengthOf
    * 
    *                    
    * @param {Array|String}        
    * @param {Number}          
    * @param {Number}          
    * @param {Object}    ,     2     ,message:      ,testIf:        ,  true   ,false,   
    *   :validateLengthOf(["name"],2,5,{message:'      5    2',testIf:function(){return false;}});
    * 
    */
   /**
    *    validatePresenceOf
    * 
    *          
    * Validates that the specified attributes are not blank.  See [jquery.model.validations validation] for more on validations.
    * @param        
    * @param {Object}    ,     2     ,message:      ,testIf:        ,  true   ,false,   
    *   :validatePresenceOf(["name"],{message:'    ',testIf:function(){return false;}});
    *
    */
   /**
    *    validateRangeOf
    *
    *            
    * @param {Array|String}        
    * @param {Number}      
    * @param {Number}      
    * @param {Object}    ,     2     ,message:      ,testIf:        ,  true   ,false,   
    *   :validatePresenceOf(["name"],2,5,{message:'    2    5',testIf:function(){return false;}});
    *
    *
    */

以下はValidationsが提供する5つの一般的な検証関数で、それらはすべて静的な方法で、Modelの中で直接上の5つの関数を呼び出すことができて、私たちはどのようにエラー情報がすべて英語であることを発見して、しかも簡単で、それでは自分のエラー情報に置き換えることができますか?もちろんできますが、Validationsは2つの方法で自分のエラー情報に置き換えることができます.最も直接的なのはValidationsという属性を修正することです:validationMessages:{format:“is invalid”,inclusion:“is not a valid option(perhaps out of range)”,lengthShort:“is too short”,lengthLong:“is too long”,presence:“can't be empty”,range:“is out of range”;上記の情報は5つの関数が提供する情報で、私たちは自分のエラー情報に置き換えることができます.もう1つは、関数の最後のパラメータにカスタムエラー情報を渡すことです.例:this.validateLengthOf(「description」,2,5,{message:'カスタムエラー情報';});これで5つの関数が終わります.
 
もう1つは、関数の最後のパラメータにカスタムエラー情報を渡すことです.例:this.validateLengthOf(「description」,2,5,{message:'カスタムエラー情報';});これで5つの関数が終わります.最後に、ユーザーに残されたカスタム検証インタフェースです.もちろん、上記の5つの関数の機能を自分でカスタマイズすることもできます.実際、私たちの多くのプロジェクトで最も多く使われているのは、実際の状況が複雑であるため、多くの場合、自分で検証を定義し、カスタムのエラー情報を返す必要があります.最後にValidationsが検証をスキップするオプションを提供してくれたのを見てみましょう.私たちはテスト中に検証を使いたくないことがありますが、検証を書いたので、削除して、使うときに追加しますか?ここではできません.Validationsが提供するオプションtestIfを直接使用すると、次のような目的を達成できます.
this.validateInclusionOf("date", ['test', 'aaaa'], {
			testIf : function() {
				return false;//   false,  date  ,    true,   ;
			}
		});

次に例を挙げてみましょう.
//モデルコード:
$.Model("Contact", {
	init : function() {
		this.validate("birthday", function() {
					if (this.birthday == null) {
						return "your birthday needs to be formatted YYYY-MM-DD";
					}
					if (this.birthday > new Date) {
						return "your birthday needs to be in the past";
					}
				});
		this.validateLengthOf("description", 2, 5, {
					message : '         '
				});
		this.validateInclusionOf("date", ['test', 'aaa'], {
					testIf : function() {
						return false;
					}
				});
	},
	attributes : {
		birthday : 'date',
		name : 'string'
	},
	findAll : "/contacts.json",
	update : "/contacts/{id;}.json"
}, {
	ageThisYear : function() {
		return new Date().getFullYear() - this.birthday.getFullYear();
	},
	getBirthday : function() {
		return "" + this.birthday.getFullYear() + "-"
				+ (this.birthday.getMonth() + 1) + "-"
				+ this.birthday.getDate();
	}
});	

//コントローラコード
$.Controller('Msgmanage.Message.Create', {
			init : function() {
				this.element.html(this.view());
			},
			submit : function(el, ev) {
				ev.preventDefault();
				this.element.find('[type=submit]').val('Creating...');
				var model = new Msgmanage.Models.Message(el.formParams());
				//         
				console.info(model.errors());
			},
			saved : function() {
				this.element.find('[type=submit]').val('Submit');
				this.element[0].reset();
			}
		});

 
 
データフォーマット変換(convert)
 
データフォーマット変換とは、同じデータを異なるフォーマットに変換することです.例えば、日付のフォーマットは、フロントに表示される日付フォーマットが2010-12-12である場合がありますが、バックグラウンド応答が私たちに与えたフォーマットは2012:12:12です.これには、データを表示する前に、データを変換する必要があります.JavaScriptMVCでは、SetterとConvertの2つの方法が提供されています.2つの方法がありますが、他の彼らの役割ドメインは違います.特殊なフィールドで特殊なフォーマットに変換する必要がある場合は、Setterを使うほうがいいと思いますが、1つのタイプのデータフォーマットであればConvert方式を使うほうが合理的です.次は、Setterについて説明します.
// A contact model
$.Model("Contact", {
			findAll : "/contacts.json"
		}, {

			//           setter,         ,      ,
			//  Setter,           ,         
			setBirthday : function(raw) {
				if (typeof raw == 'string') {
					var matches = raw.match(/(\d+)-(\d+)-(\d+)/)
					return new Date(matches[1], (+matches[2]) - 1, matches[3])
				} else if (raw instanceof Date) {
					return raw;
				}
			}
		});

 Convert:
$.Model("Contact", {
			attributes : {
				birthday : 'date'
			},
			convert : {
				//   convert,          birthday      date,
				//              ,           ,  ,       date  ,
				//           ,        ,            ,
				//          ,              ,          
				//          ,  ,           ,            ,
				//   convert   ,  ,             
				date : function(raw) {
					if (typeof raw == 'string') {
						var matches = raw.match(/(\d+)-(\d+)-(\d+)/)
						return new Date(matches[1], (+matches[2]) - 1,
								matches[3])
					} else if (raw instanceof Date) {
						return raw;
					}
				}
			}
		}, {// No prototype properties necessary
		})
 
最終コード:ツールクラスを定義します.
$.Class("Util", {
			valDate : function(raw) {
				if (typeof raw == 'string') {
					var matches = raw.match(/(\d+)-(\d+)-(\d+)/)
					return new Date(matches[1], (+matches[2]) - 1, matches[3])
				} else if (raw instanceof Date) {
					return raw;
				}
			}
		}, {});

このツールの関数をモデルで呼び出します.
$.Model("Contact", {
			attributes : {
				birthday : 'date'
			},
			convert : {
				date : function(raw) {
					return Util.valDate(raw);
				}
			}
		}, {
		// No prototype properties necessary
		})

ここで、データ処理について説明します.