비동기 함수의 변수 범위

Question

일부 변수를 반환하는 함수를 작성했습니다. 하지만 내 함수는 비동기 적으로 다른 함수를 사용합니다.

function getVariable() { 
    var myVariable; 
    asyncronousFunction(function(...){ 

    myVariable = ... 

    }); 
    return myVariable; 
} 

문제 myVariable 외부 및 내부 asyncronousFunction에서 다른 변수이다. 그래서 비동기 함수에서 myVariable 값을 할당 할 수 없습니다.

이 범위 문제를 해결하는 방법은 무엇입니까? 감사.

Answer 1

그들은 같은 변수 ,하지만 당신은 동기 비동기 함수 호출의 결과 return 수 없습니다 :

var value = getVariable(); 
// do whatever with value 
value++; 

는 이제해야 getVariable 함수에서 가져 왔습니다. myVariable의 값은 나중에 지정되지 않은 일부 시점에서 비동기 적으로 업데이트됩니다. 그러나 귀하의 함수는 값을으로 반환하고 있습니다. 그건 작동하지 않습니다.

즉, getVariable 기능이 비동기 적이므로 이러한 방식으로 디자인해야 함을 의미합니다. 예를 들어, asyncronousFunction처럼 콜백을 허용 할 수 있습니다.

Answer 2

그들은 하지 다른 변수는, 같은 변수입니다 ...하지만 당신은 함수의 끝에서 당신 return 그 전에 myVariable에 값을 할당하지 않았습니다.

여기서 올바른 패턴은 getVariable 및 asychronousFunction에 대해 asynchronousFunction이 실행을 완료 할 때 실행되는 콜백을 허용하는 것입니다.

function getVariable(callback) { 
    var myVariable; 
    asyncronousFunction(function(/* pass callback as one of the parameters */){ 

    myVariable = ... 

    }); 

    // Don't return myVariable, as it's useless at this point 
}; 

function asyncronousFunction(callback) { 
    // This simulates the asynchronous call. When the call finishes, invoke callback and pass the result as a parameter. 
    setTimeout(function() { 
     callback("result"); 
    }, 1000); 
} 

그런 다음 기능 getVariable()를 사용 어떻게 편집해야합니다.

그래서 당신은 있었다 수있는 위치 :

getVariable(function (value) { // value is now passed as a parameter 
    value++; 
});