Heim > Web-Frontend > js-Tutorial > Hauptteil

Javascript objektorientiert – Kapselung

高洛峰
Freigeben: 2017-01-04 09:14:20
Original
804 Leute haben es durchsucht

Schritt 1: Erstellen Sie eine „Handyklasse“

var MobilePhone = (function(){
    …………
})()
Nach dem Login kopieren

Schritt 2: Betrachten Sie diese Klasse und welche privaten Attribute darin benötigt werden Ich möchte hier die Anzahl der Mobiltelefone definieren, die aus der Instanz stammen.

var MobilePhone = (function(){
 //私有属性
 var count = 0; //代表手机的数量
})()
Nach dem Login kopieren

Eine Initialisierung eines Objekts, z. B. die Initialisierung von Attributen und Methoden, die jedes Mobiltelefon haben wird Der Konstruktor hier ist auch ein Abschluss, sodass auf count zugegriffen werden kann und der Wert von count für eine lange Zeit im Speicher gespeichert wird (solange eine Referenz vorhanden ist). 🎜>

Schritt 4: Gemeinsame Methoden:

Das heißt, eine Methode, die von allen Mobiltelefonobjekten verwendet werden kann, die instanziiert werden, hier sollte das Mobiltelefon dazu in der Lage sein Ändern Sie den Preis, die Farbe und die Größe und zeigen Sie auch die Größe, Farbe und den Preis an.
var MobilePhone = (function(){
 //私有属性
 var count = 0; //代表手机的数量 
     //构造函数
     var creatphone = function(color,size,price){
         count++;
         this._color = color; //手机的颜色
         this._size = size; //手机的大小
         this._price = price; //手机的价格
         this.index = count; //手机索引,是第几台创建的手机手象
      }
})()
Nach dem Login kopieren

Die hier üblichen Methoden sollten im „Prototypobjekt“ platziert werden:

1. Alle von diesem Konstruktor instanziierten Objekte, also das erstellte Mobiltelefon, können das „Prototypobjekt“ verwenden. Methode in.

2. Wenn es im Konstruktor platziert wird, wird jedes Mal, wenn ein Mobiltelefonobjekt instanziiert wird, eine Reihe wiederholter Methoden generiert, die Speicher belegen.

3. „constructor“:creatphone Erklärung:

Weil creatphone.prototype ={...} den Verweis auf das vorherige Prototypobjekt ziemlich überschreibt. Um das Prototypobjekt mit dem Konstruktor zu verknüpfen, wird das Attribut „constructor“:creatphone gesetzt

Schritt 5: Privilegierte Methode , muss es eine Methode geben, die auf die privaten Variablen der Klasse zugreifen kann. Wie viele Mobiltelefonobjekte aus der Instanz stammen
var MobilePhone = (function(){
 //私有属性
 var count = 0;//代表手机的数量
    //构造函数
     var creatphone = function(color,size,price){
        count++;
        this._color = color; //手机的颜色
        this._size = size; //手机的大小
        this._price = price; //手机的价格
        this.index = count; //手机索引,是第几台创建的手机手象
      }
 //公有方法,存放在原型对象中
 creatphone.prototype = {
      "constructor":creatphone,
      //获取手机颜色
  "getColor" : function(){
  return this._color;
  },
      //设置手机颜色
  "setColor" : function(color){
  this._color = color;
  },
      //获取手机大小
  "getSize" : function(){
  return "width:"+this._size.width + " height:" + this._size.height;
  },
      //设置手机大小
  "setSize" : function(size){
  this._size.width = size.width;
  this._size.height = size.height;
  },
      //获取手机价格
  "getPrice" : function(){
  return this._price;
  },
      //设置手机价格
  "setPrice" : function(price){
  this._price = price
  }
 }
})()
Nach dem Login kopieren

Verwenden Sie zum Testen eine oben gekapselte Mobiltelefonklasse
var MobilePhone = (function(){
 //私有属性
 var count = 0;//代表手机的数量
 var index = 0;//代表手机的索引
     //构造函数
     var creatphone = function(color,size,price){
         count++;
         this._color = color; //手机的颜色
         this._size = size; //手机的大小
         this._price = price; //手机的价格
         this.index = count; //手机索引,是第几台创建的手机手象
       }
     //公有方法,存放在原型对象中
 creatphone.prototype = {
  "constructor":creatphone,
  "getColor" : function(){
  return this._color;
  },
  "setColor" : function(color){
  this._color = color;
  },
  "getSize" : function(){
  return "width:"+this._size.width + " height:" + this._size.height;
  },
  "setSize" : function(size){
  this._size.width = size.width;
  this._size.height = size.height;
  },
  "getPrice" : function(){
  return this._price;
  },
  "setPrice" : function(price){
  this._price = price
  }
 }
 //特权方法
 creatphone.get_count_index = function(){
  return count
 }
 return creatphone;
})()
Nach dem Login kopieren

Weitere Aspekte von Javascript Für Artikel zum Thema Objektkapselung beachten Sie bitte die chinesische PHP-Website!

var anycall = new MobilePhone(); //实例一个三星手机对象
var HTC = new MobilePhone(); //实例一个HTC手机对象
var Iphone4s = new MobilePhone(); //实例一个苹果4S手机对象
console.log("三星是第:"+anycall.index+"台"); //FF的控制台输出三星手机对象是第几台创建的,即索引;
console.log("HTC是第:"+HTC.index+"台"); //FF的控制台输出HTC手机对象是第几台创建的,即索引;
console.log("Iphone4s是第:"+Iphone4s.index+"台");  //FF的控制台输出个苹果4S手机对象是第几台创建的,即索引;
console.log("总共造出了"+MobilePhone.get_count_index()+"手机"); //FF的控制台输出总共创建了几台手机;
console.log(anycall.constructor === MobilePhone); //实例出来的对象,的原形象中的constructor,是否还指向MobilePhone
Nach dem Login kopieren


Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!