>  기사  >  웹 프론트엔드  >  JavaScript 프로토타입 property_javascript 기술에 대한 심층 소개

JavaScript 프로토타입 property_javascript 기술에 대한 심층 소개

WBOY
WBOY원래의
2016-05-16 17:47:43930검색

각 함수는 기본적으로 생성자 속성과 Object 개체를 가리키는 숨겨진 속성인 __proto__를 포함하는 프로토타입 속성을 사용하여 생성됩니다. 생성자 속성의 값은 함수의 객체입니다. 앞에 new를 붙여서 함수를 호출하면 함수의 프로토타입 멤버(__proto__ 속성으로 연결됨)에 숨겨져 연결되는 새 객체가 생성되고, 함수의 this가 해당 새 객체에 바인딩됩니다.
함수는 항상 값을 반환합니다. 반환 값이 지정되지 않은 경우 생성자로 호출되고 반환 값이 객체가 아닌 경우 반환 값이 반환됩니다. 객체입니다. 생성자가 된다는 것은 말이 되지 않습니다!
[javascript]

코드 복사 코드는 다음과 같습니다.

함수 A( ){
this.p = '하하';
return {p:'heihei'}
}
var a = new A()
function A(); >this.p = '하하';
return {p:'heihei'};
}
var a = new A()
alert(a.p);//'heihei' 표시 , var a = A(); 와 같은 효과가 있습니다

함수 A는 내부적으로 함수 B를 직접 호출하고 B의 this는 외부 함수 A 대신 전역 개체에 바인딩됩니다. JS 디자인의 오류입니다. 이 문제를 해결하려면 A의 이 범위에 대한 참조를 저장하기 위해 A의 변수(일반적으로 해당 변수)를 사용하는 등 다른 방법을 사용해야 합니다.
JS 함수에는 함수 정의 시 지정된 형식 매개변수의 개수를 나타내는 길이 속성이 있습니다.
함수의 인수 속성에는 이러한 형식적 매개변수가 함수 선언에 정의되어 있는지 여부에 관계없이 함수를 호출할 때 전달된 모든 매개변수가 포함됩니다. 인수는 배열이 아니라 "배열과 유사한" 객체(실행 인수) 함수 Array의 instanceof는 false를 반환합니다. Array.prototype.slice.apply(arguments)를 통해 JS 배열로 변환할 수 있습니다.
자바스크립트 함수의 프로토타입에 메소드를 추가하면 모든 (생성자) 함수를 사용할 수 있습니다! 예를 들어 JS 함수 생성자 Function의 프로토타입에 메서드 메서드를 추가하면 Object, Number 및 기타 생성자를 포함한 모든 함수가 이 메서드를 상속합니다.
[javascript]

코드 복사 코드는 다음과 같습니다.
Function.prototype.method = function(name, func) {
this.prototype[name] = func;
return this;
};
Function.prototype.method = function(name, func){
this.prototype[name] = func;
return this;
};

이런 방식으로 Object.method 메서드를 호출하면 모든 JS 개체(Function 개체 포함)에 새 메서드를 추가할 수 있습니다. Number.method 메소드를 사용하면 모든 숫자 유형에 대해 새 메소드를 추가할 수 있습니다. 다음은 이에 대한 예입니다. Object 및 Number와 같은 유형의 객체는 현재 메소드 메소드를 상속하지 않습니다. 이 목표를 달성하려면 다음과 유사한 명령문을 실행할 수 있습니다.
[javascript]

코드 복사 코드는 다음과 같습니다.
Object.method('method',Object.method)
Object.method('method',Object.method)

수정 가능 숫자 유형의 프로토타입은 숫자 유형에 새로운 메소드를 추가하는 데 사용됩니다. 여기서는 이전 기사에서 언급한 메소드 메소드를 빌려 Number의 프로토타입에 부정 메소드를 추가합니다.
[javascript ]

코드 복사 코드는 다음과 같습니다.
Number.method(negative,function( ){
return 0–this;
})
Number.method(negative,function(){
return 0–this;
})


메서드를 호출할 때 약간의 비틀림이 있습니다. JavaScript의 구문에서는 숫자 바로 뒤에 마침표가 붙은 다음 메서드 호출이 오는 구문이 잘못되었습니다. 즉, 3.negative()를 이렇게 쓰는 것은 잘못된 것입니다. 숫자 유형 메소드를 호출하려면 숫자 뒤에 n 공백(n>=1)을 추가하거나 괄호를 사용하여 숫자를 묶어 표현식으로 강제 변환한 다음 메소드를 호출하거나 간단히 변수가 수행할 수 있는 값을 정의해야 합니다. 메소드를 직접 호출할 수도 있습니다. 즉, 다음 작성 방법이 맞습니다:
(3).negative()
3 .negative()
var n = 3; ;
3['negative']();
3 .negative()
n.negative(); 3['negative']();
함수 표현 방식을 사용하여 함수를 정의할 때 함수 뒤의 함수 이름을 사용하여 자신을 재귀적으로 호출할 수 있으며 이 이름은 덮어쓰이지 않습니다! 다음 예시를 살펴보겠습니다.
[javascript]



코드 복사 코드는 다음과 같습니다. function a(n){
if(n>1)
return a(n-1) 1
else
return 1; a(n ){
if(n>1)
return a(n-1) 1; else
return 1


위의 코드 정의 함수 a가 있고 내부적으로 자신을 재귀적으로 호출합니다. 이제 새 참조 aa를 사용하여 함수 a를 가리키고 원래 a를 예를 들어 정수 1로 변경한 다음 함수 aa, 다음 코드에 표시된 대로 표시:
[javascript]



코드 복사


코드는 다음과 같습니다.
var aa = a a = 1; aa(3) var aa = a aa(3) ;

제어 스테이션에서 오류를 보고했습니다. TypeError: 개체 [object Window]의 'a' 속성은 함수가 아닙니다. 원래 재귀 함수가 삭제되었습니다. 이 문제와 관련하여 a를 함수 a 내부의 인수.callee.caller로 바꾸거나 함수 표현식을 사용하여 함수를 정의할 수 있습니다.
[javascript]




복사 code


코드는 다음과 같습니다.
var b = function a(n){ if(n>1) return a( n -1) else return 1; var bb = b
a = 3; a(n){
if(n>1)
return a(n-1) 1
else
return 1
}; 🎜>a = 3;
bb(3);


이 시점에서 bb 함수는 우리가 원하는 결과를 정확하게 반환할 수 있습니다.
JavaScript 함수의 캡슐화를 개선하기 위해 함수 생성자를 정의할 수 있습니다. 다음은 예입니다.




코드 복사


코드는 다음과 같습니다.

[javascript]
var funcCons = function(spec){
var that = {}
that.getName = function(){
return spec.name; }; return spec.saying || return that; ; var myFunc = funcCons({name:'NearEast'}); var funcCons = function(spec){ var that = {}; that.getName = function(){
return spec.name;
};
return spec.saying ||
return that; ;
var myFunc = funcCons({name:'NearEast'});


이러한 방식으로 생성자에서 사전 테이블과 같은 일부 개인 변수와 함수를 정의할 수 있습니다. 모두 노출되도록 합니다.
성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.