전단 면접 문제에서 흔히 볼 수 있는 실수할 수 있는 문제 - 작용역 체인 분석

인터넷에서 많은 전단 면접 문제를 찾을 수 있는데 대부분이 기초적인 것이다. 그러나 아직도 많은 어린이 신발이 틀릴 수 있다. 그들의 기술이 부족하기 때문이 아니라 가장 기초적인 것을 잊어버릴 때가 많다.
간단한 프런트엔드 면접 문제 코드를 살펴보겠습니다.

var data = [];
for(var i=0;i<3;i++){
    data[i] = function(){
        console.log(i);
    };
}
data[0]();
data[1]();
data[2]();

아주 간단한 문제입니다. 경험이 풍부한 앞부분은 한눈에 이곳에 구덩이가 있다는 것을 알 수 있습니다. 세 번 출력한 것은 모두 3이고 경험이 부족한 앞부분은 종종 출력 012라고 생각할 수 있습니다. (그래요. 사실 저도 그중의 한 사람이었어요. 하하) 그러면 도대체 어떤 이유가 우리의 생각을 실제와 다르게 할까요?원인은 다음과 같다. 모든 함수는 같은 작용역을 가지고 있기 때문에 이 속성의 순환계수기의 값은 마지막으로 부여된 값이다.자세한 내용은 다음과 같습니다.
다음 두 단락의 js 문장은 등가이다.

for(var i=0;i<3;i++)   var i;for(i=0;i<3;i++)

for 순환에서 우리가 본 것은 모든 데이터[i]가 하나의 함수이고 구체적인 기능은 i의 값을 출력하는 것이다. 그리고 여기는 함수의 성명과 정의일 뿐 이 함수를 호출하지 않았다. for 순환을 종료할 때 이때의 i의 값은 3(i=3일 때 for 순환을 종료하고 i의 값은 변하지 않는다)이다. 그리고 데이터[0](), 데이터[1](), 데이터[2]()를 통해 함수를 호출했다.이때 함수에서 i의 값을 출력하려면 i의 작용역을 찾아야 한다. 그러나 이때 i의 값이 3이 되면 경험이 부족한 앞부분에 실제와 이론의 차이가 생긴다. 그러면 해결 방법은 다음과 같다.

var data = [];
for(var i=0;i<3;i++){
    data[i] = (function(i){
        console.log(i);
    })(i);
}

이것은 for 순환에 있는 i를 즉시 실행하는 함수를 사용합니다. 이때 얻은 i는 for 순환에 들어갈 때마다 i의 값으로 우리의 012의 값을 정상적으로 얻을 수 있습니다.물론 우리는 이 함수를 직접 실행하고 싶지 않다. 우리는 자신의 호출을 통해 호출하고 싶지만 i의 값은 예상치 못한 효과가 나타나지 않는다. 그러면 이럴 때 클립을 사용하는 것을 고려할 수 있다. 코드는 다음과 같다.

var data = [];
for(var i=0;i<3;i++){
   data[i] = (function(i){
    return function () {
      console.log(i);
    };  
  })(i);
}
data[0](); 
data[1](); 
data[2]();

이렇게 하면 우리는 스스로 함수를 호출할 수 있고 i의 값이 예상치 못한 변화가 나타나지 않을 것을 보장할 수 있다(클로즈업에 관해서 모르는 어린이 신발이 있으면 인터넷에서 자료를 찾아보세요)