首頁 > web前端 > js教程 > 深入理解JavaScript中的區塊級作用域、私人變數與模組模式(圖文教學)

深入理解JavaScript中的區塊級作用域、私人變數與模組模式(圖文教學)

亚连
發布: 2018-05-19 14:37:27
原創
1714 人瀏覽過

本篇文章詳細的介紹了JavaScript中的區塊級作用域、私人變數與模組模式,詳細介紹了區塊級作用域、私人變數與模組模式,對學習JavaScript很有幫助。

本文詳細的介紹了JavaScript中的區塊級作用域、私有變數與模組模式,廢話就不多說了,具體如下:

1.區塊級作用域(私有作用域),經常在全域作用域中被用在函數外部,從而限制在全域作用域中新增過多的變數和函數。

(function(count){ 
  for(var i=0;i<count;i++){ 
    console.log(i);//=>0、1、2、3、4 
  } 
  console.log(i);//=>5 
})(5);
登入後複製
(function(){ 
  var now=new Date(); 
  if(now.getMonth()==0 && now.getDate()==1){ 
    console.log("新年快乐"); 
  }else{ 
    console.log("尽情期待"); 
  } 
})();
登入後複製

 2.私有變數:任何在函數中定義的變量,都可以認為是私有變​​量,因為無法在函數的外部存取這些變數。

特權方法:有權存取私有變數和私有函數的公有方法稱為特權方法。

2.1)在建構函式中定義特權方法:

 function Person(name){ 
  this.getName=function(){ 
    return name; 
  }; 
  this.setName=function(value){ 
    name=value; 
  }; 
} 
var person1=new Person("Jason"); 
console.log(person1.getName());//=>Jason 
person1.setName("gray"); 
console.log(person1.getName());//=>gray 
var person2=new Person("Michael"); 
console.log(person1.getName());//=>gray 
console.log(person2.getName());//=>Michael 
person2.setName(&#39;Alex&#39;); 
console.log(person1.getName());//=>gray 
console.log(person2.getName());//=>Alex
登入後複製

建構子模式的缺點是針對每個實例都會建立同樣一組新方法。

2.2)靜態私有變數來實作特權方法

在私有作用域中,先定義私有變數和私有函數,然後定義建構子及其公有方法。

 (function(){ 
  //私有变量和函数 
  var name=""; 
  Person=function(value){ 
    name=value; 
  }; 
  //特权方法 
  Person.prototype.getName=function(){ 
    return name; 
  }; 
  Person.prototype.setName=function(value){ 
    name=value; 
  } 
})(); 
var person1=new Person("Jason"); 
console.log(person1.getName());//=>Jason 
person1.setName("gray"); 
console.log(person1.getName());//=>gray 
var person2=new Person("Michael"); 
console.log(person1.getName());//=>Michael 
console.log(person2.getName());//=>Michael 
person2.setName(&#39;Alex&#39;); 
console.log(person1.getName());//=>Alex 
console.log(person2.getName());//=>Alex
登入後複製

3.模組模式:透過為單例新增私有變數和特權方法能夠使其得到增強。

如果必須建立一個物件並以某些資料進行初始化,同時也要公開一些能夠存取這些私有資料的方法,那麼就可以使用模組模式。

var application=function(){ 
  //私有变量和函数 
  var components=[]; 
  //初始化 
  components.push(new BaseComponent()); 
  //公共接口 
  return { 
    getComponentCount:function(){ 
      return components.length; 
    }, 
    registerComponent:function(){ 
      if(typeof component=="object"){ 
        components.push(component); 
      } 
    } 
  } 
}();
登入後複製

上面是我整理給大家的,希望今後會對大家有幫助。

相關文章:

js程式碼延遲一定時間後執行一個函數的實例

利用JS hash製作單頁Web應用的方法詳解

JS簡單實作浮動視窗

以上是深入理解JavaScript中的區塊級作用域、私人變數與模組模式(圖文教學)的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板