CoffeeScriptは、多くの複雑なタスクでもすばやく簡単に実行できるという点で快適です。 デバッグが非常に簡単な、読みやすいコードがわかります。
検証クラスを実装する次のコードを検討してください。 一部のメソッドはjQueryを使用します。
class validation find: (rules, rule) -> rules = rules.split '|' (rule in rules) validate: (rules) -> $('.form_error').remove() delete @errors_list @fields = {} @data = {} for field, rule of rules @fields[field] = $("input[name=\"#{field}\"]"); @data[field] = @fields[field].val() @validate_field field, @data[field], rules_string unless @errors_list? @data else @show_errors() false show_errors: -> focus_set = false for field, errors of @errors_list messages = [] for error in errors messages.push @lang error @fields[field].before nano templates.form_error, {message: messages.join(' ')} unless focus_set @fields[field].focus() focus_set = true lang: (error) -> [rule,value] = @rule_value error if value? nano lang.errors[rule], {val: value}) else lang.errors[rule] rule_value: (rule)-> x = rule.split '[' if x[1]? if x[1].substr(x[1].length - 1) == ']' x[1] = x[1].substr 0, x[1].length - 1 [x[0],x[1]] min_length: (str,length) -> (str.length >= length) max_length: (str,length) -> (str.length < length) valid_email: (str) -> (/^[\w\d_-]+@+[\w\d_-]+\.+[\w]/i.test(str)) required: (str) -> (@min_length str, 1) min_value: (num,value) -> (num > value) max_value: (num,value) -> (num < value) numeric: (num) -> (/[^\d]/g.test(num)) alpha_numeric: (str) -> (/[^\da-z]/gi.test(str)) trim: (str) -> str.replace /^\s+|\s+$/g, '' integer: (str) -> parseInt(str) parse_rules: (rules) -> rules.split '|' validate_field: (field,str,rules) -> rules = @parse_rules rules for rule_string in rules [rule,value] = @rule_value(rule_string) result = @[rule] str, value unless result in [true,false] # post processing str = @data[field] = result else unless 'required' not in rules and str.length is 0 if result is no @set_error field, rule_string break set_error: (field,rule) -> if @errors_list is undefined @errors_list = {} if @errors_list[field] is undefined @errors_list[field] = [] @errors_list[field].push rule
このクラスの各メソッドは、単独で使用できます。
findメソッドを使用すると、CodeIgniterの精神で書かれた検証ルールを決定するための行で指定されたルールを見つけることができます。 CIがバックエンドとして機能する特定のプロジェクトでは、ルールオブジェクトをクライアントに直接エクスポートすると便利でした。
各フォーム要素のフィールドとルールのリストを受け入れるvalidateメソッドは、データをクリアし、ルールへの準拠を検証します。 成功した場合、メソッドはクリーンなデータを含むオブジェクトを返します。 エラーが発生した場合、メソッドは兄弟show_errors（）を呼び出してfalseを返します。 データとエラーはクラスプロパティとして保存されます。 したがって、それらは将来の使用に使用でき、同じ理由で開始前にクリーニングされます。
show_errorsメソッドは、フォームフィールドの横にエラーメッセージを挿入し、エラーを含む最初のフィールドにフォーカス（カーソル）を設定します。 そのため、ユーザーはもう一度マウスを押してクリックすることなく、誤ったデータをすぐに編集できます。
langメソッドは、適切なエラーメッセージを見つけ、ルールから値を挿入し（存在する場合）、文字列を返します。
rule_valueメソッドは、ルールから値を返します。 おそらく、正規表現を使用することでさらに美しくすることができます。 時間と理解がある場合は、PMまたはコメントを記入して、コードを確認して更新します。
メソッドmin_length、max_length、valid_email、required、min_value、max_value、numericおよびalpha_numericは、対応するルールでチェックします。 メソッドを簡単に追加できます。
ここで、検証はデータを検証するだけでなく、データを消去します。 このコードでは、trimメソッドとintegerメソッドがこれを実行します。
基本のparse_rulesメソッドは、CodeIgniterの精神でフォーマットされたルール文字列を受け取り、それを配列に変換します。
validate_fieldメソッドは、フィールド名、文字列、ルールの処理を受け入れ、文字列を処理し、ルールに準拠しているかどうかを確認し、後で使用するためにローカルデータオブジェクトに配置します。
set_errorメソッドはエラーを記憶するだけです。
行コメント付きのコードのバージョン。
class validation find: (rules, rule) -> # , | rules = rules.split '|' # - rule rules (rule in rules) validate: (rules) -> # - .form_error $('.form_error').remove() # delete @errors_list # @fields = {} # () @data = {} # for field, rule of rules # ( ) @fields[field] = $("input[name=\"#{field}\"]"); # @data[field] = @fields[field].val() # @validate_field field, @data[field], rules_string # unless @errors_list? # @data else # @show_errors() # false false show_errors: -> # , focus_set = false # for field, errors of @errors_list # messages = [] for error in errors # messages.push @lang error # , @fields[field].before nano templates.form_error, {message: messages.join(' ')} # , unless focus_set @fields[field].focus() focus_set = true lang: (error) -> # , [rule,value] = @rule_value error if value? # nano lang.errors[rule], {val: value}) else # - , lang.errors[rule] rule_value: (rule)-> # min_length[3] x = rule.split '[' if x[1]? if x[1].substr(x[1].length - 1) == ']' x[1] = x[1].substr 0, x[1].length - 1 [x[0],x[1]] min_length: (str,length) -> # true, (str.length >= length) max_length: (str,length) -> # true, (str.length < length) valid_email: (str) -> # true, (/^[\w\d_-]+@+[\w\d_-]+\.+[\w]/i.test(str)) required: (str) -> # true, (@min_length str, 1) min_value: (num,value) -> # true, (num > value) max_value: (num,value) -> # true, (num < value) numeric: (num) -> # true, (/[^\d]/g.test(num)) alpha_numeric: (str) -> # true, (/[^\da-z]/gi.test(str)) trim: (str) -> # str.replace /^\s+|\s+$/g, '' integer: (str) -> # parseInt(str) parse_rules: (rules) -> # rules.split '|' validate_field: (field,str,rules) -> # rules = @parse_rules rules # for rule_string in rules # , [rule,value] = @rule_value(rule_string) # result = @[rule] str, value # - -, false true # - , unless result in [true,false] # str = @data[field] = result # , else unless 'required' not in rules and str.length is 0 if result is no # @set_error field, rule_string # ? # - , # CI break set_error: (field,rule) -> # , if @errors_list is undefined @errors_list = {} # , if @errors_list[field] is undefined @errors_list[field] = [] # @errors_list[field].push rule
以下に示すように、オブジェクトに保存されているエラーメッセージが使用されます。
lang = errors: min_length: ' , {val} .' max_length: ' , {val} .' min_value: ' , {val}.' max_value: ' , {val}.' numeric: ' .' alpha_numeric: ' .' valid_email: ' .' required: ' .'
エラーメッセージを処理するために、人気のあるミニマルなJSテンプレートエンジンが使用されます。CoffeeScriptに移植されたコードは次のとおりです。
_nano_regex = /\{([\w\.]*)\}/g nano = (template, data) -> template.replace _nano_regex, (str, key) -> keys = key.split(".") value = data[keys.shift()] $.each keys, -> value = value[this] (if (value is null or value is `undefined`) then "" else value)
一般的なフレームワーク内のタスクは、見積もりを保護することです。
add_quotes = (str) -> (if str? then str.replace /"/g, """ else '')
使用する
フォームにそのようなフィールドがあるとします。
<label></label> <input type=”text” name=”name” value=””> <label></label> <input type=”text” name=”surname”> <label></label> <input type=”text” name=”email”>
その後、検証のルールを設定し、送信フォームで処理を呼び出すことができます。
rules = name: 'trim|required|min_length[2]|max_length[255]' surname: 'trim|max_length[255]' email: 'trim|required|valid_email|max_length[255]' validation = new validation $('body').on 'submit', 'form', => data = validation.validate rules if data isnt off # else # . , –
最小限の、柔軟な、さらには美しいコードです。