亚洲中字慕日产2020,大陆极品少妇内射AAAAAA,无码av大香线蕉伊人久久,久久精品国产亚洲av麻豆网站

資訊專欄INFORMATION COLUMN

js設(shè)計模式

brianway / 1874人閱讀

摘要：基礎(chǔ)知識變量聲明數(shù)據(jù)類型類型轉(zhuǎn)換基礎(chǔ)教程變量他是用于存儲信息的一個容易規(guī)則他是敏感大小寫的和他是個不同的變量變量名字必須以字母或者下劃線開始數(shù)字不可以你不用在中創(chuàng)建這個動作經(jīng)常揮別稱之為聲明您可以通過語句來聲明變量注意的地方如果變量再次被定

基礎(chǔ)知識

變量,聲明,數(shù)據(jù)類型,
類型轉(zhuǎn)換

/**
 * 基礎(chǔ)教程
 */
(function(){
    /**
     * 變量
     * 他是用于存儲信息的一個容易
     * 規(guī)則
     * 他是敏感大小寫的 (Y和y他是2個不同的變量)
     * 變量名字必須以字母或者下劃線開始 數(shù)字不可以 $("#id")
     */
    x = 5;
    length = 66.15;
    // 你不用var
    var k = "YUNFENGCHENG";
    alert(k)
    k = "USPCAT.COM";
    //在javascript中 創(chuàng)建這個動作經(jīng)常揮別稱之為"聲明"
    //您可以通過var 語句來聲明jS變量
    var x = "44";
    var carname;
    //注意的地方
    //如果變量再次被定義一會他的原始數(shù)值將不被持有
})()
/**
 * 數(shù)據(jù)類型和類型轉(zhuǎn)換
 */
(function(){
/**
 * 基本數(shù)據(jù)類型(3種)
 * (1)數(shù)字 number
 *   例如 3.1415927 ,0.251,.2,100,1.478E
 * (2)字符串
 *   string
 * (3)布爾 booble
 */
 //數(shù)字型轉(zhuǎn)字符串
 var num1 = 3.1415927;
 var str1 = Number.toString(num1); 
 document.write(typeof str1 == "string");//true
 document.write("
")
 //四舍五入
 var num2 = num1.toFixed(2);
 document.write(num2);
 document.write("
")
 //返回指定的為數(shù)的數(shù)字
 var num3 = num1.toPrecision(4);
 document.write(num3);
 document.write("
")
 //(Math) 介紹一點方法
 //四舍五入round
 document.write(Math.round(4.7));
 document.write("
")
 //隨機出處理0~1
 document.write(Math.random());
 document.write("
")
 //0~10的隨機數(shù)
 document.write(Math.floor((Math.random()*11)));
 document.write("
")
 document.write("-------------------------------
")
 
 //字符串
 //注意(轉(zhuǎn)義) pca"t  要輸入 pca"t 
 換行 
 /**
    " " & 和好+  
 
 回車 
    	  f 換頁
  */
 //屬性 length indexof substring chartAt(整數(shù))
 //如何轉(zhuǎn)成數(shù)字
 var str2 = "USPCAT.COM";
 var str3 = "3.14";
 var number = Number(str3);
 document.write(typeof number == "number");
 document.write("
")
 document.write((str2 - 0)+"
");//NaN 非數(shù)值
 document.write((str3 - 1)+"
");//如果是減法他回自動將字符串轉(zhuǎn)成數(shù)字
 document.write((str3 + 1)+"
");//加法會當(dāng)成字符串的拼接操作
 //布爾類型(boolean)
 //true | false
 var s = "";
 var o = {};//true
 var l = [];//true
 var n = null;
 var f = false;
 var u = undefined;
 document.write("-------------------------------
")
 if(!s){
     document.write("s is false
")
 }
 if(!o){
     document.write("o is false
")
 }
 if(!l){
     document.write("l is false
")
 }
 if(!n){
     document.write("n is false
")
 } 
 if(!f){
     document.write("f is false
")
 }
 if(!u){
     document.write("u is false
")
 }
 /**
s is false
f is false
u is false
n is false
  */
 if(str != "" && str != null && str != undefined){
     //...
 }
 if(str){
     //...
 }
 /**
  * 2復(fù)合類型
  * (1)數(shù)組-->有序的集合(array):下標(biāo)(index) 是從0開始的
  * 例子
  * var arr = new Array();
  * (2)特殊的對象-->函數(shù)(function)
  */
 /**
  * 特殊值
  * (1)null 不是有效的對象數(shù)組數(shù)組字符串  他們?yōu)榭?
  * (2)undefined 他是代表沒有定義 和空不是一個概念
  * [沒有] 但是有容易 有一個盒子但是盒子里賣沒有東西
  * undefined 連盒子也沒有
  */
 /**
  * 內(nèi)置特殊對象
  * Data對象
  * Error錯誤對象
  * ReExp對象
  */
})()
/**
 * 數(shù)據(jù)類型和類型轉(zhuǎn)換
 */
(function(){
    /**
      * 2復(fù)合類型
      * (1)數(shù)組-->有序的集合(array):下標(biāo)(index) 是從0開始的     
     */
    //屬性
    //constructor 返回對創(chuàng)建次對象的數(shù)組的函數(shù)引用
    //index 
    //input
    //*length
    //方法
//    *concat 合并數(shù)組
//    *join 把數(shù)組按照一定的各式進(jìn)行串聯(lián)
//    *push 數(shù)組的追加
//    *pop 刪除數(shù)組返回的最后一個元素
    //sort toString shift 刪除并且返回數(shù)組的第一個元素
    var arr = new Array();
    arr.push(1);
    arr.push(55);
    arr.push(5);
    arr.push(3);
    arr.push(9);
    //alert(arr.length)
    var arr2 = [1,2,3,45,6,7,8];
    //alert(arr2.join(":"));
    //alert(arr.concat(arr2).toString())
    for (var i = 0; i < arr2.length; i++) {
        document.write(arr2[i]+"
");
    }
    //擴(kuò)展array的方法
    Array.each = function(array,fn){
        for (var i = 0; i < array.length; i++) {
            fn(array[i])
        }
    }
    Array.each(arr2,function(v){
        document.write(v+"
");
    })
})()
高級類 繼承和聚合 接口

1.注解的方法
2.屬性檢驗法
3.鴨式變形法

/**
 * 1.注釋方法
 * 最簡單,但是功能也是最弱的
 * 他利用inerface和implement"文字"
 * 把他們用注解的方式顯示的表現(xiàn)出來
 */
(function(){
    /**
     * 用注釋來定義一個接口
     * interface PersonDao(){
     *     function add(obj);
     *  function remove(obj);
     *  function find(id);
     * }
     */
    //我們用注釋的方式來實現(xiàn)他
    /**
     * PersonDaoImpl implement interface
     */
    var PersonDaoImpl = function(){
        
    }
    PersonDaoImpl.prototype.add = function(obj){
        //..
    }
    PersonDaoImpl.prototype.remove = function(obj){
        //..
    }
    PersonDaoImpl.prototype.find = function(id){
        //..
    }
    /**
     * 千萬不要感覺他是沒有任何意義的
     * 1.大型的項目靠得就是規(guī)范和標(biāo)準(zhǔn)
     * 2.這樣的寫法會交你的程序員在沒有寫實現(xiàn)之前有充分時間做代碼的設(shè)計和架構(gòu)
     * 3.缺點:要認(rèn)為的遵守
     */
})()
/**
 * 屬性檢驗法
 */
(function(){
    /**
     * 用注釋來定義一個接口
     * interface PersonDao(){
     *     function add(obj);
     *  function remove(obj);
     *  function find(id);
     * }
     */
    //我們用注釋的方式來實現(xiàn)他
    var PersonDaoImpl = function(){
        this.implementInterface = ["PersonDao"];        
    }
    PersonDaoImpl.prototype.add = function(obj){
        alert(obj)
        //..
    }
    PersonDaoImpl.prototype.remove = function(obj){
        //..
    }
    PersonDaoImpl.prototype.find = function(id){
        //..
    }    
    function addObj(obj){
        var PersonDao = new PersonDaoImpl();
        //開始檢查
        if(!impl(PersonDao,"PersonDao")){
            throw new Error("類PersonDaoImpl沒有實現(xiàn)接口PersonDao");
        }else{
            PersonDao.add(obj);
        }
    }
    addObj("USCAPT.COM");
    /**
     * 他接受的是一個不定參數(shù)
     */
    function impl(Object){
        //遍歷出入對象的屬性
        for(var i=1;i

/**
 * 3.鴨式變形法
 * 這個方法來源于一個國外的老頭他有一個名言(jim)
 * "像鴨子一樣走路并且會嘎嘎叫的東西就是鴨子"
 * 換言之
 * 如果對象具有與接口定義的方法名字的同命所有方法 那么我就認(rèn)為你就是實現(xiàn)本接口
 */
(function(){
    //定義一個接口類
    var Interface = function(name,methods){
        if(arguments.length != 2){
            alert("interface must have two paramters...");
        }
        this.name = name;//這個是接口的名字
        this.methods = [];//定義個空數(shù)組來轉(zhuǎn)載函數(shù)名
        for (var i = 0; i < methods.length; i++) {
            if(typeof methods[i] != "string"){
                alert("method name must is String ...")
            }else{
                this.methods.push(methods[i])
            }
        }
    }
    //定義接口的一個靜態(tài)方法來實現(xiàn)接口與實現(xiàn)類的直接檢驗
    //靜態(tài)方法不要寫成Interface.prototype.* 因為這是寫到接口原型連上的
    //我們要把靜態(tài)的函數(shù)直接寫到類層次上
    Interface.ensureImplements = function(object){
        if(arguments.length<2){
            alert("必須最少是2個參數(shù)");
            return false;
        }
        //遍歷
        for (var i = 1; i < arguments.length; i++) {
            var inter = arguments[i];
            //如果你是接口就必須是Interface類型的
            if(inter.constructor != Interface){
                throw new Error("if is interface class must is Interface type");
            }
            //遍歷函數(shù)集合并分析
            for (var j = 0; j < inter.methods.length; j++) {
                var method = inter.methods[j];
                //實現(xiàn)類中必須有方法名字 和 接口中所有的方法名項目
                if(!object[method] || typeof object[method] != "function"){
                    throw new Error("實現(xiàn)類并且沒有完全實現(xiàn)接口中的所有方法...");
                }
            }
        }
    }
    //應(yīng)用
    //定義自己的接口
    var GridMananger = new Interface("GridMananger",["add","remove","list"]);
    var FormMananger = new Interface("FormMananger",["save"])
    
    function commManager(){
        //先實現(xiàn)方法
        this.add = function(){
            alert("ok")
        }
        this.remove = function(){}
        this.list = function(){}
        this.save = function(){}
        //檢驗
        Interface.ensureImplements(this,GridMananger,FormMananger)
    }
    var c = new commManager();
    c.add();
    /**
     * 接口的重要性
     * 1.大型項目提高代碼的靈活度
     * 2.松耦合
     * 3.在團(tuán)隊開發(fā)的時候,有寫時候你在真正編碼之前就可以寫API(自己的類庫)
     * 那這類庫就可以時候在進(jìn)行實現(xiàn)
     * 開始的時候我們就可以對整個項目是否可行,通過接口就可模擬出來
     */
    
})()





閉包


門戶大開類型


用命名規(guī)范區(qū)別私有和共有的方式


閉包



/**
 * 信息的隱藏是最終的目的,封裝只不過是隱藏的一種方法 
 */
(function(){
    /**
     * 1.門戶大開類型
     * 2.用命名規(guī)范區(qū)別私有和共有的方式
     * 3.閉包
     */
    //門戶打開型
    function Person(age,name){
        this.name = name;
        if(!this.checkAge(age)){
            throw new Error("年齡必須在0到150之間");
        }
        this.age = age;
    }
    //var p = new Person(-10,"JIM");
    //alert(p.age)
    //解決上述問題
    Person.prototype = {
        checkAge:function(age){
            if(age>0 && age < 150){
                return true;
            }else{
                return false;
            }
        }
    }
    Person.prototype["getName"] = function(){
        return this.name || "USPCAT.COM";    
    }
    //var p = new Person(-10,"JIM");
    var p = new Person(27,"JIM");
    var p2 = new Person(27);
    alert(p2.getName());

})()


上面這種門戶大開的都是公用的不是很好，應(yīng)該提前做好閉包


(function(){
    //用命名規(guī)范來區(qū)別私有和共有變量
    function Person(name,age,email){
        //定義私有變量
        this._name;//私有
        this._age;//私有
        this.setName(name);
        this.setAge(age);
        this.email = email;//共有
        
    }
    Person.prototype = {
        setName:function(name){
            this._name = name;
        },
        setAge :function(age){
            if(age>0 && age < 150){
                this._age = age;
            }else{
                throw new Error("年齡必須在0到150之間");
            }            
        }
    }
    var p = new Person("JIM",-1,"JIM@USPCAT.COM");
})()


/**
 * 閉包實現(xiàn)封裝
 */
(function(){
    function person(name,age,email,sex){
        this.email = email;//public 變量
        //get
        this.getName = function(){
            return this.name;
        }
        this.getAge = function(){
            return this.age;
        }        
        //set
        this.setName = function(name){
            this.name = name
        }
        this.setAge = function(age){
            if(age>0 && age < 150){
                this.age = age
            }else{
                throw new Error("年齡必須在0到150之間");
            }                
        }
        var _sex = "M";//這也是私有變量的編寫方式
        this.getSex = function(){
            return _sex;
        }
        this.setSex = function(){
            _sex = sex
        }
        this.init = function(){
            this.setName(name);
            this.setAge(age);
        }
        this.init();
    }
    //ceshi 
    var p = new person("JIM",-1,"www.USPCAT@126.COM")
})()


/**
 * 普通的屬性和函數(shù)是作用早對象上的
 * 而靜態(tài)的函數(shù)是定義到類上面的
 */
(function(){
    function Person(name,age){
        this.name = name;
        this.showName = function(){
            alert(this.name)
        }
    }
    //第一種靜態(tài)函數(shù)的寫法
    Person.add = function(x,y){
        return x+y;
    }
    //alert(Person.add(10,20))
    //第二種方式
    //用類中類的方式完成沒一個對象全擁有相同的屬性和闡述
    var cat = (function(){
        //私有靜態(tài)屬性
        var AGE = 10;
        //私有函數(shù)
        function add(x,y){
            return x+y;
        }
        return function(){
            this.AGE = AGE;
            this.add = function(x,y){
                return add(x,y)
            }
        }
    })()
    alert(new cat().add(1,2)+"  "+new cat().AGE);
    alert(new cat().AGE);
    /**
     * 1.保護(hù)內(nèi)部數(shù)據(jù)完整性是封裝一大用處
     * 2.對象的重構(gòu)變得很輕松,(如果沒有封裝你感動正在用這的代碼嗎?)
     * 3.弱化模塊直接的耦合
     * 弊端
     * 私有的方法他會變得很難進(jìn)行單元測試
     * 使用封裝就會意味著與復(fù)雜的代碼打交道
     * 最大問題是封裝在javascript中是很難實現(xiàn)的
     */
})()




單體模式

1.普通的單體
2.具有局部變量的強大單體
3.惰性單體
4.分支單體

函數(shù)的鏈?zhǔn)秸{(diào)用
工廠模式
橋梁模式
門面模式
組合模式
適配模式
裝飾者
享元模式
代理模式
責(zé)任鏈模式
命令模式
觀察者模式
類引擎

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://www.ezyhdfw.cn/yun/87762.html

相關(guān)文章

  • JS 外觀模式

    摘要：外觀模式在中常常用于解決瀏覽器兼容性問題。實現(xiàn)外觀模式不僅簡化類中的接口，而且對接口與調(diào)用者也進(jìn)行了解耦。外觀模式的優(yōu)勢是易于使用，而且本身也比較輕量級。 1. 簡介 外觀模式（Facade）為子系統(tǒng)中的一組接口提供了一個一致的界面，此模塊定義了一個高層接口，這個接口值得這一子系統(tǒng)更加容易使用。外觀模式在JS中常常用于解決瀏覽器兼容性問題。 2. 實現(xiàn) 外觀模式不僅簡化類中的接口，而且...

    BothEyes1993 評論0 收藏0

  • JS 橋接模式

    摘要：簡介橋接模式將抽象部分與它的實現(xiàn)部分分離，使它們都可以獨立地變化。同時橋接模式也有自己的缺點大量的類將導(dǎo)致開發(fā)成本的增加，同時在性能方面可能也會有所減少。 1. 簡介 橋接模式（Bridge）將抽象部分與它的實現(xiàn)部分分離，使它們都可以獨立地變化。其實就是函數(shù)的封裝，比如要對某個DOM元素添加color和backgroundColor，可以封裝個changeColor函數(shù)，這樣可以在多個...

    chemzqm 評論0 收藏0

  • JS或Jquery

    摘要：大潮來襲前端開發(fā)能做些什么去年谷歌和火狐針對提出了的標(biāo)準(zhǔn)，顧名思義，即的體驗方式，我們可以戴著頭顯享受沉浸式的網(wǎng)頁，新的標(biāo)準(zhǔn)讓我們可以使用語言來開發(fā)。 VR 大潮來襲 --- 前端開發(fā)能做些什么 去年谷歌和火狐針對 WebVR 提出了 WebVR API 的標(biāo)準(zhǔn)，顧名思義，WebVR 即 web + VR 的體驗方式，我們可以戴著頭顯享受沉浸式的網(wǎng)頁，新的 API 標(biāo)準(zhǔn)讓我們可以使用 ...

    CatalpaFlat 評論0 收藏0

  • JS 工廠模式

    摘要：工廠模式定義一個用于創(chuàng)建對象的接口，這個接口由子類決定實例化哪一個類。實現(xiàn)一個簡單的實現(xiàn)，使用如果使用對象屬性來實現(xiàn)以下例子中的工廠方法接受在運行時以字符串形式指定的類型，然后創(chuàng)建并返回所請求類型的對象。 1. 簡介 工廠模式的目的是為了創(chuàng)建對象，它通常在類或者類的靜態(tài)方法中實現(xiàn)，具有以下目標(biāo)： 當(dāng)創(chuàng)建相似對象時執(zhí)行重復(fù)操作 當(dāng)編譯時不知道具體類型的情況下，為工廠客戶提供一個創(chuàng)建對象...

    zhangke3016 評論0 收藏0

  • JS 狀態(tài)模式

    摘要：簡介狀態(tài)模式允許一個對象在其內(nèi)部狀態(tài)改變的時候改變它的行為，對象看起來似乎修改了它的類。狀態(tài)通常為一個或多個枚舉常量的表示。簡而言之，當(dāng)遇到很多同級或者的時候，可以使用狀態(tài)模式來進(jìn)行簡化。 1. 簡介 狀態(tài)模式(State)允許一個對象在其內(nèi)部狀態(tài)改變的時候改變它的行為，對象看起來似乎修改了它的類。其實就是用一個對象或者數(shù)組記錄一組狀態(tài)，每個狀態(tài)對應(yīng)一個實現(xiàn)，實現(xiàn)的時候根據(jù)狀態(tài)挨個去運...

    xingqiba 評論0 收藏0

  • JS 抽象工廠模式

    摘要：簡介抽象工廠模式就是通過類的抽象使得業(yè)務(wù)適用于一個產(chǎn)品類簇的創(chuàng)建，而不負(fù)責(zé)某一類產(chǎn)品的實例。通過抽象工廠，就可以創(chuàng)建某個類簇的產(chǎn)品，并且也可以通過來檢查產(chǎn)品的類別，也具備該類簇所必備的方法。 0. 簡介 抽象工廠模式(Abstract Factory)就是通過類的抽象使得業(yè)務(wù)適用于一個產(chǎn)品類簇的創(chuàng)建，而不負(fù)責(zé)某一類產(chǎn)品的實例。 JS中是沒有直接的抽象類的，abstract是個保留字，但...

    RiverLi 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<