設計モードの基礎

5146 ワード

1、プロトタイププログラミングの基本ルール全データが対象です.対象を得るには、インスタンスクラスではなく、オブジェクトを原型として探してクローンします.対象者は原型を覚えています.対象がある要求に応じられない場合、この要求は自分の原型に委ねられます.2、JavaScriptのルートオブジェクトはObject.prototypeオブジェクトです.Object.prototype対象が空の対象です.非常用のwithとevalを除いた場合、具体的には実際の応用において、thisの指向は大体以下の4種類に分けられます.を対象とする方法で呼び出します.を普通の関数として呼び出します.コンストラクタの呼び出し.Function.prototype.callまたはFuntions.prototype.appy呼び出し.4、callとappyの違いFuntions.prototype.callとFuntion.prototype.appyは非常に一般的な方法です.それらの作用は全く同じで、違いは着信パラメータの形式の違いだけです.appryは2つのパラメータを受け入れて、最初のパラメータは関数の体内のthisオブジェクトの指向を指定しています.第二のパラメータは一つのバンドの下付きセットです.このセットは配列としてもいいし、クラスの配列としてもいいです.apply方法はこのセットの要素をパラメータとして呼び出しの関数に伝達します.callが入ってきたパラメータの数は固定されていません.appyと同じです.最初のパラメータも関数の体内を表すthisの方向を指しています.二つ目のパラメータから順に関数5、クローズドのパケットに入ってきます.var mult=(function){var cache={}var cacacacaculate=function(){/閉cacaculate関数consosososolie.loge('計算関数',this);var a=1;for(var i=0,l=argments.length;i;;return function{src}6、高次関数の他の応用1)currying-関数コリック化(function currying)curryingはまた部分求値ともいう.一つのcurryingの関数は、まずいくつかのパラメータを受け取り、これらのパラメータを受け取った後、関数はすぐに値を求めるのではなく、他の関数に戻り続け、先ほど入ってきたパラメータは関数によって形成されたクローズドに保存されます.関数が本当に値を求める必要があるときは、その前に伝えられたすべてのパラメータが一度に値を求めるために使用されます.var currying=function(fn){var args=];return function(){if(argments.length==0){return fn.apply(this,args);else{[].push.appry(args,argments);
}; 

var cost = (function(){ 
   var money = 0; 
    return function(){ 
        for ( var i = 0, l = arguments.length; i < l; i++ ){ 
            money += arguments[ i ]; 
        } 
        return money; 
    }  
})(); 

var cost = currying( cost );    //     currying    
2)uncurrying Function.prototype.uncurrying=function(){var self=this;consosolie.logs;returnfunction(){var obj=Aray.prototype.shiffftl.call(argments);cone.lologloglogloglogloglogs;conelogloglogloglogloglogloglogj(abbbttttttffffffffffffffffffffffftttttttttttttttttttttttpppppppAray.prototype.push.uncurrying();次のコードはuncurryingの別の実施形態である:Function.prototype.uncurryng=function(){var self=this;return function(){return Function.prototype.cl.apply(self,argments);;3)関数ルーチン=
var __self = fn,    //                
    timer,      //     
    firstTime = true;    //          

return function () { 
    var args = arguments, 
        __me = this; 

    if ( firstTime ) {    //         ,       
        __self.apply(__me, args); 
        return firstTime = false; 
    } 

    if ( timer ) {    //        ,               
        return false;
          } 

    timer = setTimeout(function () {  //          
        clearTimeout(timer); 
        timer = null; 
        __self.apply(__me, args); 

    }, interval || 500 ); 

}; 

window.onresize=throttle(function){consolie.logs(1)}500);
4)時関数var timeChunk=function(ary,fn,count){
  var obj, 
          t; 

    var len = ary.length; 

        var start = function(){ 
    for ( var i = 0; i < Math.min( count || 1, ary.length ); i++ ){ 
        var obj = ary.shift(); 
        fn( obj ); 
    } 
 }; 
 return function(){ 
    t = setInterval(function(){ 
      if ( ary.length === 0 ){  //               
          return clearInterval( t ); 
      } 
      start();   
    }, 200 );    //          ,            

}; 

var ary=[];
for(var i=1;i<=1000;i+){ary.push(i);;
var render FriendList=timeChunk(ary,function(n){var div=document.create Element('div');div.innerHTML=n;document.body.apendChild(div);8);
render FriendList();5)不活性負荷関数ポイント私のバインディングイベント
<pregt;<codegt;var addEvent=function(elem、type、handler){
if(window.addEvent Listener){
addEvent=function(elem,type,handler){
elem.addEvent Listener(type,handler,false);
)
}else if(window.atachEvent){
addEvent=function(elem,type,handler){
elem.atachEvent('on'+type,handler);
)
)
addEvent(elem,type,handler);

</codegt;</pregt;
デザインモードの学習に入る前に、この章はクローズドと高次関数を選んで解説しています.これはJavaScript<bragt;開発において、クローズドと高次関数の応用が非常に多いからです.デザインモードについて言えば、JavaScriptという言語の独自の特徴から、<bt;多くのデザインパターンがJavacriptの中で実現されています.いくつかの伝統的な対象言語の実現には大きな差があります.<bragt;JavaScriptでは、多くのデザインパターンがクローズドと高次関数によって実現されています.これは不思議ではありません.モデルの実現<bragt;プロセスに対して、モードが何を助けてくれるかに注目しています.
</articale>
<div>
<div>
<div>
<!--PCとWAP適応版--gt;
<div id=「SOHUCS」sid=「1296808166455508」gt;
<script type=「text/javascript」src=「/view/front/js/chayan.js」gt;