우리는 JS에서 클래스 개념이 없다는 것을 알고 있습니다. 클래스의 모든 인스턴스 객체는 동일한 프로토 타입 객체에서 속성을 상속합니다. 따라서 프로토 타입 객체는 클래스의 핵심입니다.
클래스는 객체의 추상화이며 객체는 클래스의 구체적인 인스턴스입니다. 클래스는 추상적이며 메모리를 차지하지 않으며 물체는 콘크리트이며 저장 공간을 차지합니다. --- Baidu 백과 사전
초기 JavaScript 요구 사항은 매우 간단했으며 기본적으로 기능으로 작성되었으며 프로세스 지향 작성이 뒤 따릅니다. 나중에, 객체 지향 개발 아이디어가 점차 소개되었고, 그 후 천천히 수업에 기록되었습니다.
JS에서 수업에 쓰는 본질은 기본적으로 생성자 + 프로토 타입입니다. 아래에서 JS 클래스를 작성하는 몇 가지 방법에 대해 논의 해 봅시다.
생성자 방법
/*** Person Class : 이름 속성 및 getName 메소드가있는 사람을 정의하십시오*/<cript> 함수 person (name) {this.name = name; this.getName = function () {reture this.Name; }} // 우리는 여기에 여러 객체를 인스턴스화합니다. var p1 = new Person ( "trigkit4"); var p2 = 새로운 사람 ( "Mike"); console.log (p1 인스턴스); // true console.log (p2 인스턴스); // true </script>위의 콘솔 출력에서 P1과 P2가 실제로 Person 클래스의 인스턴스 객체임을 알 수 있습니다. 연산자 인스턴스의 왼쪽에는 클래스의 객체가 감지되고 오른쪽에는 클래스를 정의하는 클래스의 생성자가 있습니다. 여기서 인스턴스는 객체 P1이 개인 클래스에 속하는지 여부를 감지하는 데 사용됩니다.
이 방법의 장점은 매개 변수에 따라 다른 개체 인스턴스를 구성 할 수 있다는 것입니다. 단점은 인스턴스 객체를 구성 할 때마다 getName 메소드가 생성되어 메모리 폐기물을 초래한다는 것입니다.
클래스 메소드 대신 외부 함수를 사용할 수 있으므로 각 객체가 동일한 메소드를 공유합니다. 다시 작성된 클래스는 다음과 같습니다.
// 외부 함수 <Script> function getName () {return this.name; } function person (name) {this.name = name; this.getName = getName; //} </script>프로토 타입 방법
<cript> function person () {}; person.prototype.name = "trigkit4"; // 클래스의 속성은 프로토 타입 person.prototype.getname = function () {return "ik" + this.name; } var p1 = 새로운 사람 (); var p2 = 새로운 사람 (); console.log (p1.name); // trigkit4 console.log (p2.getName ()); // I 'm trigkit4 </script>프로토 타입 방법의 단점은 매개 변수를 통해 객체 인스턴스를 구성 할 수 없다는 것입니다 (일반적으로 각 객체의 속성은 다릅니다). 장점은 모든 객체 인스턴스가 getName 메소드 (생성자 메소드와 관련하여)를 공유하고 메모리 폐기물이 없다는 것입니다.
생성자 + 프로토 타입
처음 두 가지의 장점을 취하십시오.
에이. 생성자를 사용하여 클래스 속성 (필드)을 정의하십시오.
비. 프로토 타입을 사용하여 클래스 방법을 정의하십시오.
<cript> 기능인 (이름) {this.name = 이름; } // 프로토 타입 기능을 사용하면 객체 인스턴스가 getName 메소드를 공유 할 수 있습니다. Person.getName = function () {return "ik" + this.name; } </스크립트>이런 식으로, 우리는 다른 속성을 가진 객체를 구성하고 객체 인스턴스가 메모리 폐기물을 유발하지 않고 메소드를 공유하게 할 수 있습니다.
JS 코드를보다 컴팩트하게 만들기 위해 프로토 타입 메소드 코드를 기능인의 교정기로 옮겼습니다.
<cript> 기능인 (이름) {this.name = 이름; person.prototype.getname = function () {return name; // this.name은 적합하지 않습니다}} var p1 = new Person ( 'trigkit4'); console.log (p1.getname ()); // trigkit4 </script>여기서는 클래스 정의를위한 몇 가지 방법을 알아야하며 위의 생성자 외에도 다음과 같습니다.
object.create () 메소드
이 방법을 사용하면 "클래스"는 함수가 아닌 객체입니다.
var person = {name : "trigkit4", age : 21, run : function () {alert ( "I Like Running"); }}그런 다음 객체를 사용하여 ()를 직접 사용하여 새로 사용하지 않고 인스턴스를 생성하십시오.
var p1 = object.create (person); alert (p1.age); // 21 p1.run (); // 실행이 마음에 듭니다
이 방법은 "생성자 메소드"보다 간단하지만 개인 속성과 개인 메소드를 구현할 수는 없으며 인스턴스 객체간에 데이터를 공유 할 수 없으므로 "클래스"의 시뮬레이션 만 포괄적이지 않습니다.
CreateNew () 메소드
이 방법에는이 방법과 프로토 타입이 필요하지 않습니다. 객체를 사용하여 클래스를 시뮬레이션 한 다음 클래스를 시뮬레이션 한 다음 클래스에서 생성자 Createnew ()를 정의한 다음 reatenew ()에서 인스턴스 개체를 정의 하고이 인스턴스 개체를 리턴 값으로 사용하는 것입니다.
<cript> var persam = {createenew : function () {var person = {}; person.name = "trigkit4"; person.run = function () {alert ( "I Like Running"); }; 귀환 담당자; }} </script>그것을 사용할 때는 createNew () 메소드를 호출하여 인스턴스 객체를 가져옵니다.
var p1 = person.createnew (); p1.run (); // 실행이 마음에 듭니다
이 글쓰기 방법은 실제로 쉼표로 분리되고 다른 하나는 세미콜론으로 분리된다는 점을 제외하고는 물체 리터럴의 쓰기 방법과 매우 유사합니다.
위는이 기사의 모든 내용입니다. 모든 사람의 학습에 도움이되기를 바랍니다. 모든 사람이 wulin.com을 더 지원하기를 바랍니다.