I cant use variable out of function

Question

I declared a variable names with an empty array value out of the function, then used it inside the function to assign returned value, then I want to use it outside this function, but outside the function this variable remains empty. Please explain what I'm doing wrong.

  handleUpdateInputBusinessName = (searchText) => {
    var names = [];
    var displaySuggestions = function(predictions, status) {
      if (status !== google.maps.places.PlacesServiceStatus.OK) {
        alert(status);
        return;
      }

      predictions.forEach(function(prediction) {
        let name = prediction.description;
        names.push(name);
      });

      console.log('names_in:', names); // valid predictions from Google Maps Service
      return names;    
    };

    console.log('names_out:', names); // []

    var service = new google.maps.places.AutocompleteService();
    service.getQueryPredictions({ input: searchText, types: '(cities)'    
    }, displaySuggestions);

Have you considered working with `state` instead? – Nocebo Aug 27 '17 at 11:45 — Nocebo, Aug 27 '17 at 11:45
remove var names = []; this line inside function. – Dinesh undefined Aug 27 '17 at 11:48 — Dinesh undefined, Aug 27 '17 at 11:48

score 0 · Answer 1 · answered Aug 27 '17 at 11:51

Here's the boiled down version:

a = [];
var b = () => {
  a.push(1);
  console.log('inside:', a)
};
console.log('outside:', a);
b();

The "outside" console log is running before the displaySuggestions function is called, so the data is not yet populated in the array.

score 0 · Answer 2 · answered Aug 27 '17 at 12:00

you have to use js anonymous function syntax to increse the scope of names array below is the code.

 handleUpdateInputBusinessName = (searchText) => {
    var names = [];
    var displaySuggestions = (predictions, status) => {
      if (status !== google.maps.places.PlacesServiceStatus.OK) {
        alert(status);
        return;
      }
  predictions.forEach((prediction) => {
    let name = prediction.description;
    names.push(name);
  });

  console.log('names_in:', names); // valid predictions from Google Maps Service
  return names;    
};

console.log('names_out:', names); // []

var service = new google.maps.places.AutocompleteService();
service.getQueryPredictions({ input: searchText, types: '(cities)'    
}, displaySuggestions);

hope this heps.

I cant use variable out of function

2 Answers2