パターンのたとえ

-こんにちは*顔*友人に手を振って笑顔で。

-ワウ！ *大きく開いた目で明るい輝きで*アシャおばさんが到着しました！

-はい、私はあなたのために新しいおとぎ話を持っています*座って、腕で赤ちゃんを連れて行きました*聞きたいですか？

-もちろん！ *少し恥ずかしくて目をそらした*叔父は私にそのような恐ろしい話を言った...

-まあ、私の話があなたを怖がらないことを願っています*彼の髪を軽くたたきました*彼女はあなたにパターン化された方法で考える方法を教えるべきです。

-え？ *誤解からねじれた顔*どう？

-M ...今、あなたは知っています*ウィンクしてそれを拾いました*ここで変数を文字列に挿入する必要があるとき-あなたは何をしますか？

-さて... *近くに横たわっている紙に鉛筆とチルカヌルを取りました*このようなもの：

var query= 'xxx'

var resultCount= 512

var message= ' <kbd>' + query + '</kbd> : ' + resultCount

 —   ? *  *

 —   … *   ,     *

 — ,   … *    *

<iframe src="javascript:alert('ahtung')"></iframe>

 — ,   *  *

var message= ' <kbd>' + query.escapeHTML() + '</kbd> : ' + resultCount

 — … * *    —    ,   ..,        ?

 — … *      *    :

var texts= [ ' <kbd>', '</kbd> : ' ]

var message= texts[0] + query.escapeHTML() + texts[1] + resultCount

 —     texts[n],    ? *  ,   ,  * ,    :

var template= TT.template( ' <kbd>{0}</kbd> : {1}' )

var message= template([ query.escapeHTML(), resultCount ])

 —  * * …

 —      —  *   *  :

var template= TT.template( ' <kbd>{query}</kbd> : {count}' )

var message= template({ query: query.escapeHTML(), count: resultCount })

 — ! * *  !

 — ! *  *  :

var template= TT.html( ' <kbd>{query}</kbd> : {count}' )

var message= template({ query: query, count: resultCount })

 —   … *   *        ?!7

 — ! *   * , ,     :

var message= template({ query: TT.value( highLightedQuery ), count: resultCount })

 —     *  * TT.value?

 —    * ,    *    :

TT.value= function( data ){

        return function( ){

                return data

        }

}

 —  ,    , ,   ,      ? * ,   * ?

 — ! * * , ,   :

TT.pipe= function( list ){

        if( !list ) list= []

        var len= list.length

        return function( data ){

                for( var i= 0; i < len; ++i ) data= list[ i ]( data )

                return data

        }

}

 —   ? *    *

 —          *,      * , ,  :

var text= decodeURIComponent( encodeURIComponent( text ) )

var text= TT.pipe([ encodeURIComponent, decodeURIComponent ])( text )

 — * *  -!

 —   ! **  :

TT.template= new function( ){

        var searcher= /((?:[^\{\}]|\{\{|\}\})*)(?:\{|$)|([^\{\}]*)(?:\})/g

        return function( str, filter ){

                if( !filter ) filter= TT.pipe()

                var parts= []

                String( str ).replace

                (       searcher

                ,       function( str, val, sel ){

                                if( sel !== void 0 ){

                                        parts.push( function( data ){

                                                data= data[ sel ]

                                                switch( typeof data ){

                                                        case 'undefined': return '{' + sel + '}'

                                                        case 'function': return data()

                                                        default: return filter( data )

                                                }

                                        })

                                } else if( val ){

                                        val= val.split( '{{' ).join( '{' ).split( '}}' ).join( '}' )

                                        parts.push( TT.value( val ) )

                                }

                        }

                )

                return TT.concater( parts )

        }

}

 — *   *     !

 —   ! *  *       :

TT.uri= function( tpl ){

        return TT.template( tpl, TT.uri.encoder() )

}

TT.uri.encoder= TT.value( encodeURIComponent )

TT.uri.decoder= TT.value( decodeURIComponent )

 —  ? *,  *

 —    URI *    * :

var searchURI= TT.uri( '/search/?q={query}&count={count}' )

location.href= searchURI({ query: '&&&', count: 10 })

 — … * *    html?

 —    :

TT.html= function( tpl ){

        return TT.template( tpl, TT.html.encoder() )

}

TT.html.encoder= new function( ){

        var parent= document.createElement('div')

        var child= parent.appendChild( document.createTextNode( '' ) )

        return TT.value( function( data ){

                child.nodeValue= data

                return parent.innerHTML.split( '"' ).join( '"' ).split( "'" ).join( ''' )

        })

}

TT.html.decoder= new function( ){

        var parent= document.createElement('div')

        return TT.value( function( data ){

                parent.innerHTML= data

                return parent.firstChild.nodeValue

        })

}

 — !

 —      ! * *  html     ,    HTMLNode   :

TT.dom= function( tpl ){

        return TT.pipe([ TT.html( tpl ), TT.dom.parser() ])

}

TT.dom.parser= new function(){

        var parent= document.createElement( 'div' )

        return TT.value( function( html ){

                parent.innerHTML= html

                var childs= parent.childNodes

                if( childs.length === 1 ) return childs[0]

                var fragment= document.createDocumentFragment()

                while( childs[0] ) fragment.appendChild( childs[0] )

                return fragment

        })

}

TT.dom.serializer= new function(){

        var parent= document.createElement( 'div' )

        var child= parent.appendChild( document.createTextNode( '' ) )

        return TT.value( function( node ){

                parent.replaceChild( node.cloneNode( true ), parent.firstChild )

                return parent.innerHTML

        })

}

 —   ? *   *

 —    *   *

var link= TT.dom( '<a href="{uri}">{title}</a>' )({ uri: '/', title: ' ' }) // HTMLAnchorElement

var userName= TT.dom( '<b>{head}</b>{tail}' )({ head: 'T', tail: 'enshi' }) // HTMLFragment

 — … *  *   …



______________________

© SoftCoder.ru