Méthode de modèle singleton en javascript

Cet article présente principalement les informations pertinentes sur la méthode d'implémentation de la méthode modèle singleton en JavaScript. J'espère que cet article pourra aider tout le monde. Les amis dans le besoin pourront s'y référer.

Méthode d'implémentation de la méthode modèle singleton en javascript

Méthode modèle singleton

Définition de la méthode modèle : classe parent Définir un ensemble de squelettes d'algorithmes de fonctionnement et étendre certaines étapes d'implémentation aux sous-classes, afin que les sous-classes puissent redéfinir certaines étapes d'implémentation dans l'algorithme sans modifier la structure de l'algorithme de la classe parent.

Bloc de code

partie html, par exemple :

<p id="content"></p>

partie js, par exemple :

  //格式化字符串方法
  function fromateString(str, data) {
   return str.replace(/\{#(\w+)#\}/g, function(match, key){
    return typeof data[key] === undefined ? '' : data[key]
   });
  }
  //基础导航
  var Nav = function (data) {
   //基础导航样式模板
   this.item = &#39;<a href="{#href#}" rel="external nofollow" title="{#title#}">{#name#}</a>&#39;;
   //创建字符串
   this.html=&#39;&#39;;
   for (var i = 0; i < data.length; i++) {
    this.html += fromateString(this.item, data[i]);
   }
   return this.html;
  }
  //带有信息提示信息导航
  var NumNav = function (data) {
   //消息提醒小心组件模板
   var tpl = &#39;<p>{#num#}</p>&#39;;
   for (var i = data.length -1; i >= 0; i--) {
    data[i].name += data[i].name + fromateString(tpl, data[i]);
   }
   return Nav.call(this, data);
  }
  //带有链接地址的导航
  var LinkNav = function (data) {
   //消息提醒小心组件模板
   var tpl = &#39;<span>{#link#}</span>&#39;;
   for (var i = data.length -1; i >= 0; i--) {
    data[i].name += data[i].name + fromateString(tpl, data[i]);
   }
   return Nav.call(this, data);
  }

  //测试带有信息提示的导航
  var nav = document.getElementById(&#39;content&#39;);
  nav.innerHTML = NumNav([
   {
    href : &#39;www.baidu.com&#39;,
    title : &#39;百度一下你就知道&#39;,
    name : &#39;百度&#39;,    
    num : 10,
    link : &#39;www.baidu.com&#39;
   },
   {
    href : &#39;www.taobao.com&#39;,
    title : &#39;淘宝商城&#39;,
    name : &#39;淘宝&#39;,    
    num : 2,
    link : &#39;www.taobao.com&#39;
   },
   {
    href : &#39;www.qq.com&#39;,
    title : &#39;腾讯首页&#39;,
    name : &#39;腾讯&#39;,    
    num : 3,
    link : &#39;www.qq.com&#39;
   }
  ]);

En fait, le modèle de méthode modèle n'est pas seulement utilisé lorsque nous normalisons des composants, mais est également très couramment utilisé lors de la création de pages. Le code ci-dessus peut dériver l'encapsulation de pages statiques et l'encapsulation interactive de la logique métier.

Recommandations associées :

Exemples de code de définition et d'utilisation de modèles de méthodes de modèles dans les modèles de conception classiques Java

Exemple de partage de code du modèle de méthode de modèle PHP

Modèle de méthode de modèle et son implémentation PHP

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!