javascript模塊模式

當一個javascript文件很大的時候,會出現一些問題:
1.里面定義了大量的變量,你不得不把變量的名字寫的越來越長。
2.系統讀取全部javascript文件速度很變慢。

而解決這兩個問題最好的有一個很不錯的方式就是引入模塊模式。

一、格式

模塊模式使用了匿名閉包的方式

var model=(function(){
   ...//定義一些私有變量
     return {
         ....//以對象的方式返回,返回值可以有函數內部的東西
    }
})();//可以傳參數

其中模塊內可以定義一些私有變量,return出來的屬性是共有屬性。

二、例子

下面我以學生為例

var student=(function(day){
     var myStudyDay=day;
     function study(){
         myStudyDay++;
     }
     return {
         mygrade:function(){
          return myStudyDay;
        },
         study:study
    }
});
var qq=student(50);
console.log(qq.mygrade());//50
qq.study();
console.log(qq.mygrade());//51
console.log(myStudyDay);//error:myStudyDay is not defind

myStudyDay是student模塊的私有屬性,study是該模塊的私有函數,防止了全局污染,在函數外部不能修改這兩個的值。

三、高級

夢想決定高度,想要讓你的模塊更大試試這樣

var student=(function(day){
     var myStudyDay=day;
     function study(){
         myStudyDay++;
     };
     var grade=(function(){
      var grade=90;
      return{
        mygrade:function(){
          return grade
        }
      }
     })//模塊里面套一個模塊
     return {
         mygrade:function(){
          return myStudyDay;
        },
         study:study
    }
});

模塊里面套模塊,這樣可以讓你的模塊可以變得特別大。

使用模塊模式不僅可以保護一些模塊內的變量,同時還可以使我們的代碼更具有意義性。

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容