> 웹 프론트엔드 > JS 튜토리얼 > js 생성자 메서드란 무엇입니까?

js 생성자 메서드란 무엇입니까?

PHP中文网
풀어 주다: 2017-06-28 11:46:09
원래의
1131명이 탐색했습니다.

다음은 js 생성자의 메소드와 프로토타입에 대한 간략한 소개입니다. 에디터가 꽤 좋다고 생각해서 지금 공유해서 참고용으로 올려보겠습니다.

생성자에 메소드가 작성되면 함수 내에서 메소드라고 부르고, 프로토타입 속성에 메소드가 작성되면 프로토타입에서 메소드라고 부릅니다.

•함수 내 메서드: 함수 내 메서드를 사용하면 생성자 new에서 가져온 개체가 생성자 내 개인 변수를 작동해야 하는 경우 함수 내 개인 변수에 액세스할 수 있습니다. 이때 우리는 함수 내에서 메서드를 사용하는 것을 고려해야 합니다.

•프로토타입의 메서드: 함수를 통해 많은 수의 객체를 생성해야 하고 이러한 객체에도 많은 메서드가 있을 때, 고려하십시오. 함수의 프로토타입에 이러한 메서드를 추가하세요. 이 경우 코드의 메모리 공간은 상대적으로 작습니다.

•실제 응용 프로그램에서는 이 두 가지 메서드가 종종 조합되어 사용되므로 먼저 필요한 것이 무엇인지 이해해야 합니다.


// 构造函数A
function A(name) {
  this.name = name || 'a';
  this.sayHello = function() {
    console.log('Hello, my name is: ' + this.name);
  }
}

// 构造函数B
function B(name) {
  this.name = name || 'b';
}
B.prototype.sayHello = function() {
  console.log('Hello, my name is: ' + this.name);
};

var a1 = new A('a1');
var a2 = new A('a2');
a1.sayHello();
a2.sayHello();

var b1 = new B('b1');
var b2 = new B('b2');
b1.sayHello();
b2.sayHello();
로그인 후 복사

두 개의 생성자를 작성했습니다. 첫 번째는 A입니다. 이 생성자는 sayHello 메서드를 포함합니다. 두 번째는 생성자 B입니다. 해당 메서드를 생성자 B의 프로토타입 속성에 넣습니다. 생성자 내부에 메서드를 작성하면 생성자를 통해 개체를 초기화하는 비용이 증가합니다. 프로토타입 특성에 메서드를 작성하면 이 비용이 효과적으로 줄어듭니다. 개체에 대한 메서드를 호출하는 것이 해당 프로토타입 체인에 대한 메서드를 호출하는 것보다 훨씬 빠르다고 느낄 수도 있습니다. . 사실 그렇지 않습니다. 객체에 프로토타입이 많지 않으면 속도는 실제로 거의 같습니다

또한 참고할 사항:

•우선, 함수의 프로토타입 속성에 메서드를 정의할 때, 메서드를 변경하면 이 생성자에 의해 생성된 모든 개체의 해당 메서드가 변경된다는 점을 명심하세요.

• 또 다른 요점은 변수 승격 문제입니다. 다음 코드를 살펴보세요.


func1(); // 这里会报错,因为在函数执行的时候,func1还没有被赋值. error: func1 is not a function
var func1 = function() {
  console.log('func1');
};

func2(); // 这个会被正确执行,因为函数的声明会被提升.
function func2() {
  console.log('func2');
}
로그인 후 복사

• 객체 직렬화 문제와 관련하여 함수의 프로토타입에 정의된 속성은 직렬화되지 않습니다. 다음 코드를 볼 수 있습니다.


function A(name) {
  this.name = name;
}
A.prototype.sayWhat = 'say what...';

var a = new A('dreamapple');
console.log(JSON.stringify(a));
로그인 후 복사

We 출력 결과가 {"name":"dreamapple"}

임을 알 수 있습니다.

위 내용은 js 생성자 메서드란 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿