Verschiedene Schreibmethoden der JavaScript-Kapselung

In diesem Artikel werden hauptsächlich die verschiedenen Schreibmethoden der JavaScript-Kapselung vorgestellt. Freunde, die sich für JavaScript interessieren, können auf diesen Artikel verweisen . Artikel

In der Welt von JavaScript ist das Schreiben ein magisches Phänomen, das wirklich allen Denkrichtungen offen steht! Jedes Mal, wenn ich von Ausländern geschriebene JS-Komponenten sehe, sind die Ideen und Schreibmethoden seltsam, aber ich habe noch nie einen Code mit grundsätzlich derselben JS-Struktur gesehen. Heute werde ich darüber sprechen, wie man js schreibt. Ich habe während des Entwicklungsprozesses auch mehrere Methoden geschrieben. Wenn die Codestruktur oder -logik nicht gut geschrieben ist, führt dies dazu, dass die CPU des Computers die Berechnungen erhöht und die Laufleistung verringert. Auch die Art und Weise, wie js geschrieben wird, ist für die Leistung von entscheidender Bedeutung.

Normalerweise verwenden diejenigen, die JS-Komponenten schreiben, die Schreibmethode der anonymen Funktion, um ein Objekt zu kapseln und einen Abschlussbereich mit der Außenwelt zu bilden. (Ich werde hier nicht viel über die Vererbung und den Polymorphismus von js sagen. Erfahrene Programmierer sollten über dieses Wissen verfügen. Wenn Sie auch Java-Entwicklung durchgeführt haben, ist dieses Konzept zu vertraut.)

Hauptsächlich für die Kapselungsforschung, weil Sowohl Front- als auch Backends beinhalten objektorientierte Konzepte, die sehr wichtige Konzepte für die Kapselung, die Art und Weise der Kapselung, die Leistung der Kapselung usw. sind. Kapselung (das erste Konzept in der Programmierwelt, denke ich persönlich) gibt es überall auf der Welt. JQuery, EXT und Prototype.js kapseln Javascript, jQuery uI und jQuery mobile kapseln jQuery, und JDBC in Java ist in Spirng, Hibernate und anderen Frameworks enthalten Hier sind einige Beispiele, aber es gibt noch viele weitere, die ich nicht einzeln vorstellen werde.

Zurück zum Thema JavaScript-Kapselung. Schauen wir uns zunächst eine einfache

function hello(){
 var a = 'hello';
 alert(a);
}

js-Funktion an, die die originellste und grundlegendste Kapselung ist Verstehen Sie js. Wenn Ihre Seite keine interaktiven JS-Vorgänge benötigt, können Sie diese auf einfache Weise ausführen. Wenn Sie JQuery verwenden möchten, müssen Sie es wie folgt schreiben:

$(function(){
 $('#id').click(function(){
 alert('hello');
 })
});

Wenn Sie Node.js verwenden , es ist komplizierter, weil Node.js wie folgt geschrieben werden muss:

var http = require('http');
http.createServer(function(req,res){
 res.writeHead(200,{'Content-Type':'text/html'});
 res.write('<p>hello</p>');
}).listen(8080);

Wenn Sie auf eine große Anzahl stoßen, kapseln Sie die Schreibmethode Bei js-Operationen kann jede kleine Funktion diese nicht erfüllen, da sie in einer gemeinsamen Domäne vorhanden sind. Viele und verstreute Schreibmethoden können leicht viele Fehlerfaktoren verursachen und müssen reguliert werden. Der Ersteller von js stellt uns eine Funktion namens „anonyme Funktion“ zur Verfügung. Wie der Name schon sagt, ist eine anonyme Funktion eine Funktion ohne tatsächlichen Namen. Sie hat viele Formate. function(){}(),(function(){})(),(function(){}()),new function(){},void function(){}();JQuery.js ist eine anonyme Schauen wir uns zur Funktionskapselung zunächst die am häufigsten verwendeten

 (function(){
 star.init = (function(name){
 var e = new Editor(name, Data.toolbarData);
 });
 })();

an. Wenn Sie einige js-Komponenten entwickeln, können Sie zunächst ein Objekt erstellen und diesem Objekt Attribute zuweisen und Methoden. Erlauben Sie diesem Objekt, alleine zu arbeiten und mit anderen Objekten zusammenzuarbeiten

var klm = klm || {};
 klm = (function(){
 //第一个写法
 klm.init = function(){
  alert('hello');
 }

 //第二个写法
  klm.browser = (function(ua){
  var b = {
  msie:/msie/.test(ua) && !/opera/.test(ua),
  opera:/opera/.test(ua),
  safari:/webkit/.test(ua) && !/chrome/.test(ua),
  firefox:/firefox/.test(ua),
  chrome:/chrome/.test(ua)
  };
  })(window.navigator.userAgent.toLowerCase());
  //将其定义方法以接口方式返回给外界引用
  return{
  init: klm.init,
  browser:klm.browser 
  }
 })();

Die nächste Methode zum Schreiben von js-Kapselungen ist das, was ich bevorzuge

var myOpinion = myOpinion || {};
 myOpinion.prototype={
 init:function(obj,i){
  alert('hello');
  },
  closeWindow:function(obj,d){
  obj.click(function(){
  d.hide();
  });
  }
 }
 $(function(){
  var my = myOpinion.prototype;
  my.init($(".z-sidebar li em"),$("#contact")); 
  $("#contact").add(my.closeWindow($(".z-sidebar li em"),$("#contact")));
 });

Dies Die erste Möglichkeit besteht darin, jede kleine Operation durch Prototypenvererbung in die Attribute init und closeWindow zu kapseln. Anschließend kann sie initialisiert und geladen werden, z. B. my.init(); sie kann auch an ein Operationsereignis wie $( gebunden werden. "#contact" ).add(my.closeWindow()); Diese Pakete werden auf einmal gebildet.

Es ist auch eine einzelne Attributkapselung definiert

 WinShow.create = function(c,body){ 
  var _head = '<p class="+ c.heacss +"><span class="+ c.concss +">' + c.title + '</span></p>';
  this.container.innerHTML = _head;
  return this.container;
  this.container.onclick = function(e){
  alert('hello');
  }
 }

Hier erstelle ich ein Erstellungsattribut, um einen Teil des HTML-Codes in Form einer anonymen Funktion zu kapseln und ein Klickereignis daran zu binden diesen HTML-Code.

Führen Sie oben mehrere js-Kapselungsformen auf, aber Xiaosheng erforscht sie noch. Diese Typen können den gleichen Vorgang ausführen, es gibt jedoch einige Unterschiede in der Schreibmethode. Jeder, der bessere Einblicke in die Leistung hat, kann kommentieren Mich. .

Verwandte Empfehlungen:

Zwei Möglichkeiten, JavaScript zum Parsen von URLs in das JSON-Format zu verwenden

5 JavaScript-Algorithmen zum Entfernen doppelter Elemente aus Arrays

Detaillierte Erläuterung der Drosselung und Anti-Shake-Entprellung der Javascript-Funktion

Das obige ist der detaillierte Inhalt vonVerschiedene Schreibmethoden der JavaScript-Kapselung. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!