本文實例講述了JS基于設計模式中的單例模式（Singleton）實現封裝對數據增刪改查功能。分享給大家供大家參考，具體如下：

單例模式

單例模式的核心結構中只包含一個被稱為單例的特殊類。通過單例模式可以保證系統中一個類只有一個實例

單例模式最初的定義出現于《設計模式》（艾迪生維斯理, 1994）：“保證一個類僅有一個實例，并提供一個訪問它的全局訪問點。”

單例模式定義：“一個類有且僅有一個實例，并且自行實例化向整個系統提供。”

var Singleton = (function(){ SingletonClass() { } var singleton = null; return {  getInstance: function() {   if (singleton == null) {  singleton = new singletonClass();   } else {  return singleton;   }  } }})();Singleton.getIntance();

前端經常用到一些和接口相關的增刪改查異步操作。我們來舉例，我在操作數據列表時，常常少不了，增加 修改 刪除功能。有的方案是用同步的（刷新頁面），用戶體驗好一些用異步；

代碼如下

增加功能

$(".add").click(function(){  $.ajax({  type: "post"    dataType:"json",    url: "http://m.survivalescaperooms.com/",    data: {name:"csdn博客",dir:"web前端"},    success: function( result ){    if ( result.status ) { alert("新增成功！") } else { alert("新增失敗") }  },    error: function(){    alert("新增出現異步，請得新增加或聯系技術管理員");  }  });});

刪除功能

$(".del").click(function(){  $.ajax({  type: "post"    dataType:"json",    url: "http://m.survivalescaperooms.com/",    data: {id:"1"},    success: function( result ){    if ( result.status ) { alert("刪除成功！") } else { alert("刪除失敗") }  },    error: function(){    alert("新增出現異步，請得新增加或聯系技術管理員");  }  });});

上面這二個代碼片段簡單描述了，增加和刪除功能的JS代碼。有的同學發現了，他們有共同點，就是ajax請求中有一部分是相同的，并且刪除功能如果在其它地方也用到呢？，那在其它地方也要寫一代碼這種相同的代碼。感覺很不舒服

我們改進一下

var SingletonCRUD = (function(){ SingletonClass() {} SingletonClass.prototype = {   constructor: SingletonClass,   add: function( data ) {  $.ajax({   type: "post"     dataType:"json",     url: "http://m.survivalescaperooms.com/",     data: data,     success: function( result ){    if ( result.status ) { alert("新增成功！") } else { alert("新增失敗") }   },     error: function(){    alert("新增出現異步，請得新增加或聯系技術管理員");   }    });   }，  remove: function( data ) {  $.ajax({   type: "post"     dataType:"json",     url: "http://m.survivalescaperooms.com/",     data: data,     success: function( result ){    if ( result.status ) { alert("刪除成功！") } else { alert("刪除失敗") }   },     error: function(){    alert("新增出現異步，請得新增加或聯系技術管理員");   }    });   } } var singleton = null; return {  getInstance: function() {   if (singleton == null) {  singleton = new singletonClass();   } else {  return singleton;   }  } }})();var curd = SingletonCRUD.getIntance();$(".add").click(function(){  var data = {"name":"name"};  curd.add( data );});$(".del").click(function(){  var data = {"id": 1};  curd.remove( data );});