>웹 프론트엔드 >JS 튜토리얼 >캡슐화를 구현하는 JS 시뮬레이션 방법

캡슐화를 구현하는 JS 시뮬레이션 방법

php中世界最好的语言
php中世界最好的语言원래의
2018-04-16 14:14:091278검색

이번에는 JS 시뮬레이션을 사용하여 캡슐화를 구현하는 방법을 알려드리겠습니다. JS 시뮬레이션을 사용하여 캡슐화를 구현할 때 주의사항은 무엇인가요? 아래에서 실제 사례를 살펴보겠습니다.

말보다 먼저

 상속은 하위 클래스를 사용하여 다른 상위 클래스를 상속하는 것입니다. 그러면 하위 클래스가 자동으로 상위 클래스의 모든 속성과 메서드를 갖게 됩니다. 이 프로세스를 상속이라고 합니다. JS에서 상속을 구현하는 방법은 여러 가지가 있습니다. 오늘은 그 중 세 가지를 소개하겠습니다.

1. Object 클래스에 확장 메서드

//声明一个父类
function Person(name){
 this.name=name;
 this.age=age;
 this.say=function(){
   alert("我叫"+this.name);
 }
}
//声明一个子类 
function Student(){
 this.no=no;
 this.study=function(){
  alert("我在学习!");
 }
}
// 通过循坏,将父类对象的所有属性和方法,全部赋给子类对象
Object.prototype.extend=function(parent){
 for(var i in parent){
   this[i].parent[i];
 }
}
var p=new Person("张三",12);
var s=new Student("1234567");
//子类对象调用这个扩展方法
s.extend()
console.log(s);
를 추가합니다.

상속 구현을 위한 위의 원칙: 루프를 통해 상위 클래스 객체의 모든 속성과 메서드가 하위 클래스 객체에 할당됩니다. 핵심은 for-in 루프이다. Object를 확장하지 않고도 간단한 루프를 통해 연산을 구현할 수 있다.

그러나 이러한 방식으로 상속을 구현하는 데에는 몇 가지 단점도 있습니다. ① 한 번의 인스턴스화를 통해 완전한 하위 클래스 객체를 직접 얻을 수는 없습니다. 먼저 상위 클래스 개체와 하위 클래스 개체를 가져온 다음 수동으로 병합해야 합니다. ②Object를 확장하는 상속 방법은 하위 클래스의 객체에도 유지됩니다.

상속을 구현하는 두 번째 방법을 살펴보겠습니다~

2. 프로토타입 상속을 사용하세요

이 방법을 소개하기 전에 프로토타입 객체와 프로토타입이라는 두 가지 개념에 대해 이야기해 보겠습니다

1. 프로토타입: 함수의 프로토타입 객체

①함수에만 프로토타입이 있고, 모든 함수에는 프로토타입이 있어야 합니다 ②프로토타입 자체도 오브제입니다!

③프로토타입은 현재 함수가 위치한 참조 주소를 가리킨다!

2.

proto

: 물체의 프로토타입!

①객체에만 proto가 있고, 모든 객체에는 proto가 있어야 합니다 ② proto도 객체이기 때문에 자신만의 proto도 가지고 있습니다. 이 선을 따라 찾는 순서가 프로토타입 체인입니다.

③함수와 배열은 모두 객체이며 자체 프로토타입을 가지고 있습니다

//声明父类
function Person(name,age){
   this.name=name;
   this.age=age;
   this.say=function(){
    alert("我叫"+this.name);
   }
}
//声明子类   
function Student(no){
   this.no=no;
   this.study=function(){
    alert("我在学习!我叫"+this.name+"今年"+this.age");
   }
}
//将父类对象赋给子类的prototype  
Student.prototype=new Person("张三",14);
//拿到子类对象时,就会将父类对象的所有属性和方法,添加到proto
var s=new Student(); 
s.study();

프로토타입 상속 사용 원칙:

상위 클래스 객체를 하위 클래스의 프로토타입에 할당하면 상위 클래스 객체의 속성과 메서드가 하위 클래스의 프로토타입에 나타납니다. 그런 다음 하위 클래스를 인스턴스화할 때 하위 클래스의 프로토타입은 하위 클래스 개체의 프로토에 있게 됩니다. 마지막으로 상위 클래스 개체의 속성과 메서드는 하위 클래스 개체의 프로토에 나타납니다.

이 상속의 특징:

① 하위 클래스 자체의 속성은 모두 멤버 속성이고, 상위 클래스로부터 상속받은 속성은 프로토타입 속성이다. ② 여전히 1단계 인스턴스화를 통해 완성된 하위 클래스 개체를 가져올 수 없습니다.

상속을 구현하는 세 번째 방법:

call(), apply() 및 바인딩(), 이 세 가지 메소드는 매개변수 전달만 다를 뿐 매우 유사합니다. rreee 세 가지 함수의 유일한 차이점은 func의 매개변수 목록을 받아들이는 방식입니다. 그 외에는 기능상의 차이가 없습니다.

세 가지 기능을 작성하는 방법(차이점):

호출 작성 방법: func.call(func, func 매개변수 1, func 매개변수 2,...이 가리키는 obj); 적용 작성 방법: func.apply(func에서 가리키는 obj, [func 매개변수 1, func 매개변수 2,...]);

바인딩 작성 방법: func.bind(func의 this가 가리키는 obj)(func 매개변수 1, func 매개변수 2,...)

자세한 내용은 이 기사의 사례를 읽은 후 방법을 마스터했다고 믿습니다. 흥미로운 정보가 있으니 다른 PHP 중국어 웹사이트 관련 기사도 주목해 주세요!

추천 도서:


위 내용은 캡슐화를 구현하는 JS 시뮬레이션 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.