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

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

WBOY
WBOYOriginal
2016-05-16 15:18:351276Durchsuche

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");
}
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
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

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;
  }

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();
Ich hoffe, dass es für alle hilfreich sein wird, Javascript-Programmierung zu lernen.

Stellungnahme:
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