ホームページ > ウェブフロントエンド > jsチュートリアル > JSオブジェクト指向プログラミング_JavaScriptスキルを詳しく解説

JSオブジェクト指向プログラミング_JavaScriptスキルを詳しく解説

WBOY
リリース: 2016-05-16 15:18:35
オリジナル
1303 人が閲覧しました

JavaScript はプロトタイプに基づいており、クラスの概念がないため (ES6 にはクラスの概念があります。今は説明しません)、アクセスできるのはオブジェクトだけであり、すべてが真のオブジェクトです

したがって、オブジェクトについて話すとき、多くの学生は型付きオブジェクトとオブジェクト自体の概念を混同します。理解を容易にするために、以下の用語ではオブジェクトについては言及しません。 🎜>

方法 1

クラス (関数シミュレーション)

function Person(name,id){
 //实例变量可以被继承
 this.name = name;
 //私有变量无法被继承
 var id = id;
 //私有函数无法被继承
 function speak(){
  alert("person1");
 }
}
//静态变量,无法被继承
Person.age = 18;
//公有函数可以被继承
Person.prototype.say = function(){
 alert("person2");
}
ログイン後にコピー
親クラスのメソッドを継承して呼び出します

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
ログイン後にコピー
親クラスのメソッドを継承、オーバーライドし、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

ログイン後にコピー
継承されたラッパー関数

function extend(Child, Parent) {

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

ログイン後にコピー
uber は、子オブジェクトの uber 属性を設定することを意味します。この属性は、親オブジェクトのプロトタイプ属性を直接指します。 (Uber は「上」または「1 レベル上」を意味するドイツ語です。)これは、子オブジェクトでチャネルを開くことと同等であり、親オブジェクトのメソッドを直接呼び出すことができます。この行は、継承を完全にするためだけにここに配置されており、純粋にバックアップの目的で使用されています。

方法 2

コピーと同じで、継承したいオブジェクトは定義された _this オブジェクトを介して引き継がれます。この場合、_this を渡すことで継承が実現できます。これは、上記の

よりも理解しやすいです。

//创建父类
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();
ログイン後にコピー
皆さんの JavaScript プログラミングの学習に役立つことを願っています。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート