상해 구조 함수 모드

2076 단어 js 진급
선언:
ECMAScript는 기술적으로는 대상을 향한 언어이지만 전통적인 대상을 향한 언어가 지원하는 클래스와 인터페이스 등 기본 구조를 갖추지 못한다.그러나 ES5에는 클래스와 비슷한 참조 유형이 있습니다.인용 유형은 한 유형의 대상이 가지고 있는 속성과 방법을 설명하고 인용 유형의 값(대상)은 인용 유형의 실례이기 때문에 대상 정의라고도 부른다.
새 대상은 new 조작부호를 사용한 후 구조 함수와 함께 만들어집니다.ES5는 Object, Array, Date, Function, RegExp 등 다양한 기본 참조 유형을 제공하며, 사용자 정의 구조 함수를 만들어 사용자 정의 객체 유형을 정의하는 것도 지원합니다.
1: 객체 유형 사용자 정의
Person 구조 함수를 만드는 경우:
function Person(name,age) {
	this.name = name;
	this.age = age;
	this.sayName = function() {
		alert(this.name);
	}
} 

다음은 새 연산자를 사용하여 Person의 새 인스턴스를 만듭니다.
var person1 = new Person("Tom", 22);
var person2 = new Person("Jerry", 27); 

이렇게 구조 함수를 호출하면 다음 4단계를 거칩니다.
(1) ;
(2) ( this );
(3) ( );
(4) 。

person1과 person2는 Object의 실례이자 Person의 실례이며 모두 하나의 constructor(구조 함수) 속성이 Person을 가리킨다.
2. 구조 함수와 기타 함수의 대비
구조 함수도 사실 함수이다. 어떤 함수든 new 조작부호를 통해 호출하면 구조 함수로 사용할 수 있다.만약 new 호출을 사용하지 않는다면, 그것은 바로 일반 함수이다.그래서 사실상 이른바'구조 함수'는 존재하지 않고 함수에 대한'구조 호출'만 존재한다.위의 Person() 함수와 같이 다음 두 가지 호출 방법이 있습니다.
// 
var person = new Person("Tom",22);
person.sayName();//"Tom"

// 
Person("Jerry",27);
window.sayName();//"Jerry"

셋째: 구조 함수의 문제
구조 함수를 사용하여 여러 개의 실례 대상을 만들 때 구조 함수 모델의 단점이 드러난다.모든 방법은 모든 실례에 다시 한 번 만들어야 한다.즉, 앞의 예에서person1과person2는 각각sayName () 방법이 있고 이 두 동명 함수는 같지 않다는 것이다.따라서 구조 함수 모드에서 같은 작업을 수행하는 두 개의 함수를 만들었는데 이것은 필요없기 때문에 코드를 다음과 같이 바꿀 수 있다.
function Person(name,age) {
	this.name = name;
	this.age = age;
	this.sayName = sayName;
}

function sayName(){
	alert(this.name);
}
var person1 = new Person("Tom", 22);
var person2 = new Person("Jerry", 27);

위 코드에서, 우리는sayName () 함수를 구조 함수 내부에서 옮겼고, 구조 함수 내부에서sayName 속성을sayName () 함수로 정의했다.이렇게 하면person1과person2는 전역 작용 영역의 같은 함수를 공유할 수 있다.그러나 이렇게 하면 또 새로운 문제가 발생할 수 있다. 만약 대상이 여러 가지 방법을 정의해야 한다면, 여러 개의 전역 함수를 정의해야 한다. 그러면 우리가 정의한 인용 유형은 조금도 봉인성이 없다.그래서 우리는 원형 모델을 도입하여 해결했다.다음 편에서는 원형 모델을 살펴본다.

좋은 웹페이지 즐겨찾기