>  기사  >  웹 프론트엔드  >  JS_Basic 지식으로 클래스와 객체를 생성하는 두 가지 방법

JS_Basic 지식으로 클래스와 객체를 생성하는 두 가지 방법

WBOY
WBOY원래의
2016-05-16 16:40:011049검색

JavaScript에서는 새 함수를 정의할 때 실제로는 새 클래스를 선언하며, 함수 자체는 클래스의 생성자와 동일합니다. 다음 코드는 새 Person 클래스를 생성하는 두 가지 방법을 보여 주며, Person.prototype의 정의는 함수 정의를 따릅니다.

var Person = function(name) { // 一个匿名函数, 并将这个函数赋值给一个Person变量, 此时Person成为一个类 

this.name = name; 

} 

function Person(name) { // 直接定义一个叫做Person的函数表示Person类 

this.name = name; 

} 

Person.prototype = { // 定义Person的prototype域 

printName: function() { // 定义一个print函数 

alert(this.name); 

} 

}

함수를 통해 클래스를 선언한 후 new 연산자를 통해 클래스를 인스턴스화할 수 있습니다. 이런 방식으로 클래스의 멤버 함수를 호출하여 논리를 완성할 수 있습니다.

var person = new Person("Joe Smith"); // 使用new操作符来新建一个Person的实例, 并赋给变量person 
person.printName(); // person就可以看作是一个实例的引用(reference), 所以可以通过这个引用来调用Person类中的成员函数

새 클래스의 인스턴스를 만드는 전체 프로세스와 단계를 요약해 보겠습니다.

1. 함수를 정의하여 새 클래스를 선언합니다(익명 또는 실제 이름 사용). 2. 필요한 경우 이 새 클래스의 프로토타입 필드를 정의합니다.
3. new 연산자 다음에 정의한 함수를 사용하여 새 클래스 인스턴스를 생성합니다. JavaScript 컴파일러가 new 연산자를 발견하면 실제로는 빈 클래스 인스턴스 변수가 생성됩니다.
4. 이 클래스의 프로토타입 필드에 있는 모든 특성과 메서드를 이 새 인스턴스에 복사하고 해당 멤버 함수의 모든 포인터가 새로 생성된 이 인스턴스를 가리킵니다.
5. 다음으로 new 연산자 바로 뒤에 있는 함수를 실행합니다.
6. 이 함수를 실행할 때 존재하지 않는 속성에 값을 할당하려고 하면 JavaScript 컴파일러가 이 인스턴스의 범위 내에서 자동으로 속성을 생성합니다.
7. 함수 실행 후 초기화된 인스턴스를 반환합니다.

Prototype에서는 Class 객체를 사용하여 비교적 간단한 방법으로 새 ​​객체를 선언할 수 있습니다. Class.create()를 사용하면 프로토타입이 기본 생성자 함수인 초기화()를 생성합니다. 이 함수를 구현하면 Java의 생성자 함수와 유사한 방식으로 클래스의 새 인스턴스를 생성할 수 있습니다.

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