js 적용/호출/호출자/호출자/바인드 사용법 및 차이점 분석_javascript 기술

1. 호출 메소드
현재 객체를 다른 객체로 대체하기 위해 객체의 메소드를 호출합니다(실제로 객체의 내부 포인터를 변경하는 것, 즉 객체의 this가 가리키는 내용을 변경하는 것) ).
Js 코드
call([thisObj[,arg1[, arg2[, [,.argN]]]]])
매개변수
thisObj
선택 사항. 현재 객체로 사용될 객체입니다.
arg1, arg2, , argN
선택 사항. 일련의 메소드 매개변수가 전달됩니다.
설명
call 메서드는 다른 개체 대신 메서드를 호출하는 데 사용할 수 있습니다. call 메소드는 함수의 객체 컨텍스트를 초기 컨텍스트에서 thisObj가 지정한 새 객체로 변경합니다. thisObj 매개변수가 제공되지 않으면 전역 개체가 thisObj로 사용됩니다.
Js 코드

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

<입력 유형 ="text " id="myText" value="input text"> 코드
function Obj(){this.value="Object! ";}
var value="전역 변수"; function Fun1( ){alert(this.value);}
window.Fun1(); //전역 변수
Fun1.call(window); //전역 변수
Fun1.call(document.getElementById ('myText')); //텍스트 입력
Fun1.call(new Obj());

Js 코드
코드

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

var first_object = {
num: 42
}
var second_object = {
num: 24
}
function Multiply(mult) {
return this .num * mult;
}
multiply.call(first_object, 5); // 42 * 5를 반환합니다.
multiply.call(second_object, 5) // 24 * 5를 반환합니다. >

2. 적용 메소드
적용 메소드의 첫 번째 매개변수도 현재 객체에 전달할 객체, 즉 함수 내부의 this입니다. 다음 매개변수는 현재 객체에 전달되는 매개변수입니다. Apply와 Call은 동일한 기능을 갖고 있지만, 매개변수에 차이가 있습니다. 첫 번째 매개변수의 의미는 동일하지만 두 번째 매개변수의 경우 apply는 매개변수 배열로 전달됩니다. 즉, 여러 매개변수가 배열로 결합되어 전달되는 반면 call은 call의 매개변수로 전달됩니다( 두 개의 매개변수로 시작).
예를 들어 func.call(func1,var1,var2,var3)의 해당 Apply 작성 방법은 func.apply(func1,[var1,var2,var3])입니다. Apply의 두 번째 매개변수로 전달되는 현재 함수의 인수 객체를 직접 추가할 수 있다는 것입니다.
Js 코드

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

var func=new function() {this.a="func"}

var myfunc=function(x,y){
var a="myfunc";
alert(this.a); x y);
}
myfunc.call(func,"var"," fun");// "func" "var fun"
myfunc.apply(func,["var"," fun "]) ;// "func" "var fun"



3. 호출자 속성

은 호출하는 함수 본문인 함수에 대한 참조를 반환합니다. 현재 기능. functionName.caller: functionName 개체는 실행 중인 함수의 이름입니다.
참고: 함수의 경우 호출자 속성은 함수가 실행될 때만 정의됩니다. 함수가 JScript 프로그램의 최상위 수준에서 호출되는 경우 호출자에는 null 이 포함됩니다. 호출자 속성이 문자열 컨텍스트에서 사용되는 경우 결과는 functionName.toString과 동일합니다. 즉, 함수의 디컴파일된 텍스트가 표시됩니다.
Js 코드

코드 복사 코드는 다음과 같습니다. 함수 CallLevel() {

if (CallLevel.caller == null)

alert("CallLevel이 최상위 수준에서 호출되었습니다.")
else
alert("CallLevel이 다른 함수에 의해 호출되었습니다:n" CallLevel .caller) ;
}
function funCaller(){
CallLevel()
}
CallLevel()
funCaller()


4. 호출 수신자 속성
지정된 Function 개체의 본문인 실행 중인 Function 개체를 반환합니다.
[function.]arguments.callee: 선택적 함수 매개변수는 현재 실행 중인 함수 개체의 이름입니다.
참고:
호출자 속성의 초기 값은 실행 중인 Function 개체입니다.
callee 속성은 인수 객체의 멤버입니다. 이는 함수 객체 자체에 대한 참조를 나타냅니다. 이는
함수의 재귀를 숨기거나 함수의 캡슐화를 보장하는 데 도움이 됩니다. 예제는 1부터 n까지의 자연수를 재귀적으로 계산합니다. 그리고 이 속성
은 해당 기능이 실행 중일 때만 사용할 수 있습니다. 피호출자에게는 때때로 확인을 위해
사용되는 길이 속성이 있다는 점에 유의해야 합니다. args.length는 실제 매개변수 길이이고,args.callee.length는
형식 매개변수 길이를 통해 호출 시 형식 매개변수 길이가 실제 매개변수 길이와 일치하는지 확인할 수 있습니다.
Js 코드

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

//callee can 자체 인쇄
function calleeDemo() {
alert(arguments.callee);
}
//매개변수 확인에 사용됨
function calleeLengthDemo(arg1, arg2) {
if(인수 .length ==arguments.callee.length) {
window.alert("형식 및 실제 매개변수 길이가 올바른지 확인하세요!")
return;
} else {
alert(" 실제 매개변수 길이: "args.length);
alert("공식 매개변수 길이: "args.callee.length);
}
}
//재귀 계산
var sum = function(n){
if (n <= 0)
return 1;
else
return n ＋arguments.callee(n - 1)
}

5. 바인딩
Js 코드

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

var first_object = {
num: 42
};
var second_object = {
num: 24
}
function Multiply(mult) {
return this.num * mult ;
}
Function.prototype.bind = function(obj) {
var method = this,
temp = function() {
return 메서드. apply(obj, 인수);
return temp;
}
var first_multiply = Multiplier.bind(first_object); //first_multiply(5); 🎜>var second_multiply = Multiply.bind(second_object);
second_multiply(5); // 24 * 5를 반환합니다.



6. JS 클로저(Closure)

소위 "클로저"는 다수의 변수와 이러한 변수가 바인딩되는 환경을 포함하여 이러한 변수가 표현식의 일부가 되는 표현식(일반적으로 함수)을 의미합니다. 클로저에 관해 가장 간단한 설명은 ECMAScript가 내부 함수의 사용을 허용한다는 것입니다. 즉, 함수 정의와 함수 표현식이 다른 함수의 함수 본문에 위치합니다. 또한 이러한 내부 함수는 모든 지역 변수, 매개변수 및 해당 함수가 존재하는 외부 함수에 선언된 기타 내부 함수에 액세스할 수 있습니다. 이러한 내부 함수 중 하나가 이를 포함하는 외부 함수 외부에서 호출되면 클로저가 형성됩니다. 즉, 외부 함수가 반환된 후에 내부 함수가 실행됩니다. 이 내부 함수가 실행되면 여전히 외부 함수의 지역 변수, 매개변수 및 기타 내부 함수에 액세스해야 합니다. 이러한 지역 변수, 매개변수, 함수 선언(초기)의 값은 외부 함수가 반환될 때의 값이지만 내부 함수의 영향도 받습니다. 간단히 말해서 클로저의 기능은 out 함수가 실행되고 반환된 후 Javascript의 가비지 수집 메커니즘인 GC가 out 함수가 점유한 리소스를 회수하는 것을 방지하는 것입니다. 실행은 out 함수의 변수에 따라 달라집니다.
클로저의 두 가지 특징:
1. 함수 변수에 대한 참조로서 - 함수가 반환될 때 활성화됩니다.
2. 클로저는 함수가 반환될 때 리소스를 해제하지 않는 스택 영역입니다.
예시 1:
HTML 코드

코드 복사 코드는 다음과 같습니다. < ;script type="text/javascript">

function setupSomeGlobals() {

// 클로저 내에서 끝나는 지역 변수
var num = 666>// 일부 참조 저장 함수를 전역 변수로 사용
gAlertNumber = function() { Alert(num) }
gIncreaseNumber = function() { num }
gSetNumber = function(x) { num = x }; }

생성 - setupSomeGlobals()
출력 value - gAlertNumber()
증가 - gIncreaseNumber()

예시 2:
HTML 코드

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

< ;script type="text/javascript">
function newClosure(someNum, someRef) {
// 클로저 내에서 끝나는 지역 변수
var num = someNum; = [1 ,2,3];
var ref = someRef;
return function(x) {
num = x
alert('num) : ' num
' nanArray ' anArray.toString()
' nref.someVar ' ref.someVar)
}
}
var closure1 = newClosure(40, {someVar:' never -online' })
var closure2 = newClosure(99, {someVar:' BlueDestiny'})
closure1(4)
closure2(3)
>
예제 3:
Js 코드

코드 복사

코드는 다음과 같습니다.


설명: 핵심 요령은 인라인 함수 표현식을 실행하여 추가 실행 환경을 만드는 것입니다. 외부 코드에 사용된 함수로 함수 표현식에 의해 반환된 내부 함수입니다. 이때 버퍼배열은 함수식의 지역변수로 정의된다. 함수 표현식은 한 번만 실행하면 되며, 배열은 한 번 생성되고 이에 의존하는 함수에서 재사용될 수 있습니다.
7. 프로토타입 체인
ECMAScript는 객체 유형에 대한 내부 [[prototype]] 속성을 정의합니다. 이 속성은 스크립트를 통해 직접 액세스할 수 없지만 속성 접근자의 구문 분석 프로세스 중에 이 내부 [[prototype]] 속성이 참조하는 개체 체인(프로토타입 체인)이 필요합니다. 내부 [[prototype]] 속성에 해당하는 프로토타입 객체는 공개 프로토타입 속성을 통해 할당하거나 정의할 수 있습니다.
예시 1:

Js 코드




코드 복사

코드는 다음과 같습니다.

0 0 0