小編給大家分享一下js設計模式之結構型享元模式的示例分析，相信大部分人都還不怎么了解，因此分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后大有收獲，下面讓我們一起去了解一下吧！

創新互聯公司專注于企業營銷型網站建設、網站重做改版、西華網站定制設計、自適應品牌網站建設、H5建站、電子商務商城網站建設、集團公司官網建設、成都外貿網站建設、高端網站制作、響應式網頁設計等建站業務，價格優惠性價比高，為西華等各大城市提供網站開發制作服務。

運用共享技術有效地支持大量的細粒度的對象，避免對象間擁有相同內容造成多余的開銷。
享元模式主要是對其數據、方法共享分離，將數據和方法分成內部數據、內部方法和外部數據、外部方法。內部方法與內部數據指的是相似或共有的數據和方法，所以將其提取出來減少開銷。

var Flyweight = function() {
 // 已創建的元素
 var created = [];
 // 創建一個新聞包裝容器
 function create() {
  var dom = document.createElement('div');
  // 將容器插入新聞列表容器中
  document.getElementById('container').appendChild(dom);
  // 緩存新創建的元素
  created.push(dom);
  // 返回創建的新元素
  return dom;
 }
 return {
  // 獲取創建新聞元素方法
  getDiv: function() {
   // 如果已創建的元素小于當前頁元素總個數(5個)，則創建
   if(created.length < 5) {
    return created();
   } else {
    // 獲取第一個元素，并插入去后面
    var div = created.shift();
    created.push(div);
    return div;
   }
  }
 }
}

上面創建一個享元類，由于每頁只能顯示5條新聞，所以創建5個元素，保存在享元類內部，可以通過getDiv方法來獲取創建的元素。下面就要實現外部數據和外部方法，外部數據就是我們要顯示的所有新聞內容，由于每個內容都不一樣肯定不能共享。

var paper = 0,
  num = 5,
  len = article.length;
// 添加五條新聞
for(var i = 0; i < 5; i++) {
 if(article[i])
 // 通過享元類獲取創建的元素并寫入新聞內容
 Flyweight.getDiv().innerHTML = article[i];
}

// 下一頁按鈕綁定事件
document.getElementById('next_page').onclick = function() {
 // 如果新聞內容不足5條則返回
 if(article.length < 5) {
  return;
 }
 var n = ++paper * num % len, // 獲取當前頁的第一條新聞索引
   j = 0;
 // 插入5條新聞
 for(; j < 5; j++) {
  // 如果存在n+j條則插入
  if(article[n + j]) {
   Flyweight.getDiv().innerHTML = article[n + j];
  // 否則插入起始位置第n+j-len條
  } else if(article[n + j - len]) {
   Flyweight.getDiv().innerHTML = article[n + j - len];
  } else {
   Flyweight.getDiv().innerHTML = "";
  }
 }
}

這樣用享元模式對頁面重構之后每次操作只需要操作5個元素，這樣性能可以提高很多。
享元模式的應用是為了提高程序的執行效率與系統性能，因此在大型系統開發中應用比較廣泛，可以避免程序中的數據重復。應用時一定要找準內部狀態與外部狀態，這樣才能更合理地提取分離。

以上是“js設計模式之結構型享元模式的示例分析”這篇文章的所有內容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內容對大家有所幫助，如果還想學習更多知識，歡迎關注創新互聯成都網站設計公司行業資訊頻道！

另外有需要云服務器可以了解下創新互聯scvps.cn，海內外云服務器15元起步，三天無理由+7*72小時售后在線，公司持有idc許可證，提供“云服務器、裸金屬服務器、高防服務器、香港服務器、美國服務器、虛擬主機、免備案服務器”等云主機租用服務以及企業上云的綜合解決方案，具有“安全穩定、簡單易用、服務可用性高、性價比高”等特點與優勢，專為企業上云打造定制，能夠滿足用戶豐富、多元化的應用場景需求。

文章標題：js設計模式之結構型享元模式的示例分析-創新互聯
文章位置：http://www.yijiale78.com/article18/docsgp.html

成都網站建設公司_創新互聯，為您提供品牌網站設計、網站策劃、外貿建站、網站導航、響應式網站、定制開發

廣告

聲明：本網站發布的內容（圖片、視頻和文字）以用戶投稿、用戶轉載內容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網站立場，如需處理請聯系客服。電話：028-86922220；郵箱：631063699@qq.com。內容未經允許不得轉載，或轉載時需注明來源： 創新互聯