閉包的實例
阿新 • • 發佈：2019-05-05
作用域 .html 要去 doc idt 如果 stl cep 使用
1. 實現單例模式
閉包是JS的一種特性，其中一點就是：可以將外部函數的變量保存在內存中，利用這一特性，我們可以用來實現類的單例模式。
單例模式？？？
保證一個類有且只有一個實例，並提供一個訪問它的全局訪問點。
為了解決：一個全局使用的類頻繁地創建與銷毀。
優勢：控制實例數目，節省系統資源。
核心思路：利用Javascript的作用域，形成閉包，從而可以創建私有變量（假設我們將這個私有變量取名為instance），然後將創建的實例賦予這個私有變量instance就ok了。每當想創建這個類的實例時，先判斷instance是否已經引用了存在的實例，如果沒有引用，即這個類沒有被創建實例，so創建一個實例，然後將其賦予給instance；如果instance已經引用，即已存在了該類的實例，so無需再創建，直接使用這個instance就ok了。
1.實例-- 創建命名空間
//執行匿名函數，防止命名空間汙染。在匿名函數中，首先定義個上述提到的私有變量instance以及一個類。
這個類，我假設它有名字(name)和年齡(age)兩個屬性字段以及一個輸出他們名字的方(displayInfo)哈。
‘use strict‘ var singletonAccepter =(function(){ var instance = null;//默認將instance賦予null
///類：SupposeClass function SupposeClass( args ){//在這裏定義單例代碼var args = args || {};this.name = args.name || ‘Sarah‘; this.age = args.age || 24; //檢驗單例模式:運行多次，只會打印一次 this is created console.log(‘this is created!‘); }; SupposeClass.prototype = { constructor: SupposeClass, displayInfo: function(){ console.log(‘name: ‘ + this.name + ‘ age: ‘ + this.age); } }; return { //利用return + 對象字面量，將我們想，向外暴露的東東，往外拋。 name: ‘SupposeClass‘, //類的名字 getInstance: function( args ){ //創建實例方法 if( instance === null ){//利用私有變量instance實現單例模式 instance = new SupposeClass( args ); } return instance; } }; })();
singletonAccepter.getInstance(); singletonAccepter.getInstance();
https://www.cnblogs.com/giggle/p/5452271.html
2. 實例--驗證是否登陸過
//list中存儲的數據不會被其他作用域訪問到，就不會被修改了，因為函數本身是一個作用域。 function isFirstLoad () { var list = [] return function (id) { if (list.indexOf(id) >=0) { return false } else { list.push(id) return true } } } //使用 var firstLoad = isFirstLoad () console.log(firstLoad (10)) //true console.log(firstLoad (10)) //false console.log(firstLoad (20)) //true
3. 實例--點擊彈出標簽
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
</body>
</html>
<script type="text/javascript">
var i
for (i=0; i<10; i++) {
(function (i) {
var a = document.createElement(‘a‘)
a.innerHTML = i +‘<br>‘
a.addEventListener(‘click‘, function(e) {
//e.preventDefault()
alert(i) ///自由變量，要去父作用域取值
})
document.body.appendChild(a)
})(i)
}
</script>
閉包的實例