JS 객체지향 프로그래밍_javascript 기술에 대한 자세한 설명-JS 튜토리얼-php.cn

JS 객체지향 프로그래밍_javascript 기술에 대한 자세한 설명

WBOY

풀어 주다： 2016-05-16 15:18:35

원래의

1281명이 탐색했습니다.

JavaScript는 프로토타입을 기반으로 하고 클래스 개념이 없기 때문에(ES6에 클래스가 있으므로 지금은 이에 대해 이야기하지 않겠습니다.) 우리가 액세스할 수 있는 것은 객체뿐이며 모든 것이 진정한 객체입니다

그래서 객체에 대해 이야기할 때 많은 학생들이 Typed Object와 객체 자체의 개념을 혼동하게 됩니다. 이해를 돕기 위해 다음 용어에서는 객체를 언급하지 않습니다.

방법 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는 "위" 또는 "한 레벨 위"를 의미하는 독일어입니다.) 이는 하위 개체에 대한 채널을 여는 것과 동일하며 상위 개체의 메서드를 직접 호출할 수 있습니다. 이 줄은 상속의 완전성을 달성하기 위해 여기에 배치되었으며 순전히 백업 목적으로 사용됩니다.

방법 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();

로그인 후 복사

자바스크립트 프로그래밍을 배우시는 모든 분들에게 도움이 되었으면 좋겠습니다.