js objektorientierte Schreibmethode_Javascript-Kenntnisse

Dieser Artikel fasst mehrere gängige Methoden zum Schreiben objektorientierter JS zusammen und stellt sie Ihnen als Referenz zur Verfügung. Der spezifische Inhalt ist wie folgt
1.Fabrikmethode

var Circle = function() {
 var obj = new Object();
 obj.PI = 3.14159;
 
 obj.area = function( r ) {
  return this.PI * r * r;
 }
 return obj;
}

var c = new Circle();
alert( c.area( 1.0 ) );

2. Formelleres Schreiben

function Circle(r) {
  this.r = r;
}
Circle.PI = 3.14159;
Circle.prototype.area = function() {
 return Circle.PI * this.r * this.r;
}

var c = new Circle(1.0); 
alert(c.area()); 

3.json-Schreibmethode

var Circle={
 "PI":3.14159,
 "area":function(r){
   return this.PI * r * r;
  }
};
alert( Circle.area(1.0) );

4. Es gibt einige Änderungen, aber das Wesentliche ist das gleiche wie beim ersten

var Circle=function(r){
  this.r=r;
}
Circle.PI = 3.14159; 
Circle.prototype={
 area:function(){
  return this.r*this.r*Circle.PI;
 }
}
var obj=new Circle(1.0);
alert(obj.area()

Circle.PI = 3.14159; kann in das Attribut eingefügt und als this.PI=3.14159;

geschrieben werden

Häufig verwendet werden die erste und dritte Schreibweise sowie ein ausführliches Beispiel für die dritte Schreibweise

var show={
  btn:$('.div1'),
  init:function(){
   var that=this;
   alert(this);
   this.btn.click(function(){
     that.change();
     alert(this);
    })
   
  },
  change:function(){
   this.btn.css({'background':'green'});

  }
 }
 show.init();

Was dabei beachtet werden muss, ist das Zeigeproblem. Hier ist eine kleine Einführung dazu. Ich hoffe, sie wird für alle hilfreich sein. Zu Beginn wurde die Methode des dynamischen Prototyps verwendet, um benutzerdefinierte Objekte in js zu erstellen, und diese Methode wurde auch sehr reibungslos verwendet. Bei dieser Methode beginnen die Erstellung und Verwendung von Variablen innerhalb des Objekts mit „this.“
Beispiel: Das Objekt ContactModel hat drei Attribute

, crtnewFriendListLen, crtNewFriendList, crtFindedUserID und
vier Methoden requestContactList(), requestNewfriendList(), requestFindUser(), requestAddContact() Wenn Sie auf Ihre eigenen Eigenschaften innerhalb dieser Variablen zugreifen möchten, müssen Sie „this“ mitbringen.

var contactModel;
...
contactModel = new ContactModel();

function ContactModel()
{
 // this.contactList;
 this.crtnewFriendListLen;
 this.crtNewFriendList;
 this.crtFindedUserID = "-1";
 
 if(typeof ContactModel._initialized == "undefined")
 {
  ContactModel.prototype.requestContactList = function()
  {
   
  }
  
  ContactModel.prototype.requestNewfriendList = function()
  {
   
  }
 
  ContactModel.prototype.requestFindUser = function(userID)
  {
   $.getJSON(mainUrl + "User/getuserinfo",{"uid":userID},function(resultObj)
   {

　　　　　　　　　//　this.crtFindedUserID = userID
    contactModel.crtFindedUserID = userID;
    uiManager.contectAddPage.receiveFindUserResult(resultObj);
   });
  }
  
  ContactModel.prototype.requestAddContact = function(remark)
  {
   alert(this.crtFindedUserID);
    
  }
  
  ContactModel._initialized = true;
 };
}

Zu diesem Zeitpunkt tritt jedoch ein Problem auf: Wenn this.crtFindedUserID zum Speichern des vom Server gesendeten Werts verwendet wird, kann die crtFindedUserID nach dem Aufruf der requestAddContact()-Methode für dieses Objekt nicht abgerufen werden. Der in der Warnung angezeigte Anfangswert ist immer noch -1. Das Problem liegt in der Callback-Methode von $.getJSON(). Dies bezieht sich derzeit nicht auf die Instanz von ContactModel, sondern auf den Methodenkörper, also die Lösung hier ist Der Weg besteht darin, die Instanz von ContactModel in dieser Rückrufmethode abzurufen und dann dem Attribut crtFindedUserID dieser Instanz einen Wert zuzuweisen.

In der abhörenden Rückrufmethode der Ansichtskomponente innerhalb des Objekts verweist dies nicht auf das Objekt selbst, sondern auch auf den Hauptteil der Methode, die zurückgerufen wird. Wenn Sie zu diesem Zeitpunkt auf die Eigenschaften des Objekts selbst zugreifen möchten Für den Zugriff muss eine Instanz dieses Objekts abgerufen werden, anstatt dies zu verwenden.

Das Folgende ist eine
Standardschreibmethode für JS objektorientiert
:

<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"> 
<title>新建网页 1</title> 
<mce:script type=text/javascript><!-- 
 var person=function(name,age){//定义对象构造方法 
  this.name=name; 
  this.age=age; 
 } 
 person.prototype={ //封装方法 
  getName:function(){ 
   alert(this.name); 
  }, 
  getAge:function(){ 
   alert(this.age); 
  } 
 } 
 
 function test(){//声明调用 
  var man=new person('jack',12); 
  man.getName() 
  man.getAge() 
 } 
  
 var test2 ={ //类似静态方法 调用直接：test2.te();即可 
  te:function(){ 
   alert(); 
  }, 
  te1:function(){ 
   alert(); 
  } 
 } 
// --></mce:script> 
</head> 
<body> 
 <input type=button onclick="test()"/> 
</body> 
</html>

Ich hoffe, dass dieser Artikel für alle hilfreich ist, die JavaScript-Programmierung lernen.