Heim > Web-Frontend > js-Tutorial > Detaillierte Erläuterung der Fähigkeiten der objektorientierten JS-Programmierung_Javascript

Detaillierte Erläuterung der Fähigkeiten der objektorientierten JS-Programmierung_Javascript

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB
Freigeben: 2016-05-16 15:18:35
Original
1352 Leute haben es durchsucht

Da JavaScript auf Prototypen basiert und nicht über das Konzept von Klassen verfügt (ES6 hat es, reden wir jetzt nicht darüber), haben wir nur Zugriff auf Objekte, und alles ist wirklich ein Objekt

Wenn wir über Objekte sprechen, werden viele Schüler die Konzepte von typisierten Objekten und Objekten selbst verwechseln. Wir werden in der folgenden Terminologie keine Objekte erwähnen, um das Verständnis zu erleichtern 🎜>

Methode 1

Klasse (Funktionssimulation)

function Person(name,id){
 //实例变量可以被继承
 this.name = name;
 //私有变量无法被继承
 var id = id;
 //私有函数无法被继承
 function speak(){
  alert("person1");
 }
}
//静态变量,无法被继承
Person.age = 18;
//公有函数可以被继承
Person.prototype.say = function(){
 alert("person2");
}
Nach dem Login kopieren
Erben Sie die übergeordnete Klassenmethode und rufen Sie sie auf

function Person(name,id){
 //实例变量可以被继承
 this.name = name;
 //私有变量无法被继承
 var id = id;
 //私有函数无法被继承
 function speak(){
  alert("person1");
 }
}
//静态变量,无法被继承
Person.age = 18;
//公有静态成员可被继承
Person.prototype.sex = "男";
//公有静态函数可以被继承
Person.prototype.say = function(){
 alert("person2");
}
//创建子类
function Student(){
}
//继承person
Student.prototype = new Person("iwen",1);
//修改因继承导致的constructor变化
Student.prototype.constructor = Student;
var s = new Student();
alert(s.name);//iwen
alert(s instanceof Person);//true
s.say();//person2
Nach dem Login kopieren
Erben, überschreiben Sie die Methode der übergeordneten Klasse und implementieren Sie super()

function Person(name,id){
 //实例变量可以被继承
 this.name = name;
 //私有变量无法被继承
 var id = id;
 //私有函数无法被继承
 function speak(){
  alert("person1");
 }
}
//静态变量,无法被继承
Person.age = 18;
//公有静态成员可被继承
Person.prototype.sex = "男";
//公有静态函数可以被继承
Person.prototype.say = function(){
 alert("person2");
}
//创建子类
function Student(){
}
//继承person
Student.prototype = new Person("iwen",1);
//修改因继承导致的constructor变化
Student.prototype.constructor = Student;
//保存父类的引用
var superPerson = Student.prototype.say;
//复写父类的方法
Student.prototype.say = function(){
 //调用父类的方法
 superPerson.call(this);
 alert("Student");
}
//创建实例测试
var s = new Student();
alert(s instanceof Person);//true
s.say();//person2 student

Nach dem Login kopieren
Geerbte gekapselte Funktionen

function extend(Child, Parent) {

    var F = function(){};
    F.prototype = Parent.prototype;
    Child.prototype = new F();
    Child.prototype.constructor = Child;
    Child.uber = Parent.prototype;
  }

Nach dem Login kopieren
uber bedeutet, ein uber-Attribut für das untergeordnete Objekt festzulegen, das direkt auf das Prototypattribut des übergeordneten Objekts verweist. (Uber ist ein deutsches Wort, das „oben“ oder „eine Ebene höher“ bedeutet.) Dies entspricht dem Öffnen eines Kanals für das untergeordnete Objekt, und Sie können die Methode des übergeordneten Objekts direkt aufrufen. Diese Zeile wird hier nur platziert, um die Vollständigkeit der Vererbung zu gewährleisten, und dient ausschließlich Sicherungszwecken.

Methode 2

Äquivalent zum Kopieren wird das Objekt, das Sie erben möchten, über das definierte _this-Objekt übertragen. In diesem Fall kann die Vererbung durch Übergeben von _this erreicht werden, was einfacher zu verstehen ist als das obige

//创建父类
function Person(name,id){
 //创建一个对象来承载父类所有公有东西
 //也就是说_this承载的对象才会被传递给子类
 var _this = {};
 _this.name = name;
 //这样的是不会传递下去的
 this.id = id;
 //承载方法
 _this.say = function(){
  alert("Person");
 }
 //返回_this对象
 return _this;
}
//子类
function Student(){
 //获取person的_this对象,从而模仿继承
 var _this = Person("iwne",1);
 //保存父类的_this引用
 var superPerson = _this.say;
 //复写父类的方法
 _this.say = function(){
  //执行父类的say
  superPerson.call(_this);
  alert("Student");
 }
 return _this;
}
var s = new Student();
s.say();
Nach dem Login kopieren
Ich hoffe, dass es für alle hilfreich sein wird, Javascript-Programmierung zu lernen.

Verwandte Etiketten:
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
Aktuelle Ausgaben
Wo steht js?
Aus 1970-01-01 08:00:00
0
0
0
js-Dateicode nicht gefunden
Aus 1970-01-01 08:00:00
0
0
0
js addClass funktioniert nicht
Aus 1970-01-01 08:00:00
0
0
0
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage