How to use the variable beyond it's scope in Javascript?

Question

I want to use the "labels" variable beyond its scope, how can I do it ? I know its not a good practice but I still want to use the values in labels array. I tried cloning the variable but the scope issue persists

const client = new vision.ImageAnnotatorClient();
// Performs label detection on the image file
client
    .labelDetection(`${filename}`)
    .then(results => {
        var labels = results[0].labelAnnotations;

        console.log('Labels: ');
        labels.forEach(label => console.log(label.description));
    })

    .catch(err => {
        console.error('ERROR: ', err);
    });

EDIT 1: I want to use the label this way

const client = new vision.ImageAnnotatorClient();
    // Performs label detection on the image file
    client
        .labelDetection(`${filename}`)
        .then(results => {
            var labels = results[0].labelAnnotations;

            console.log('Labels: ');
            labels.forEach(label => console.log(label.description));
        })

        .catch(err => {
            console.error('ERROR: ', err);
        });

console.log('Labels: ');
                labels.forEach(label => console.log(label.description));

But the console shows the error "Cannot use undefined for forEach"

You should return the labels from inside the `.then()`. Using async / await, you can then access the values outside of the promise scope. — Kobe, Feb 17 '20 at 10:32

score 0 · Answer 1 · answered Feb 17 '20 at 10:44

You can only access the value using a .then(), or outside of the promise when you're in an async context:

(async () => {
  const client = new vision.ImageAnnotatorClient();
  const labels = client
    .labelDetection(`${filename}`)
    .then(results => results[0].labelAnnotations)
    .catch(err => console.error('ERROR: ', err))

  console.log('Labels: ');
  labels.forEach(label => console.log(label.description));
})()

Here's a working example, where getLabels is a substitute for your current code:

(async () => {
  const fakeData = [{
    labelAnnotations: [
      { description: 'label 1' },
      { description: 'label 2' },
      { description: 'label 3' },
    ]
  }]

  const getLabels = () => new Promise(r => setTimeout(r, 1000, fakeData))
  const results = await getLabels()
  const labels = results[0].labelAnnotations
  
  console.log('Labels: ');
  labels.forEach(label => console.log(label.description));
})()

score -1 · Answer 2 · answered Feb 17 '20 at 09:50

Simply define labels outside of the promise:

const client = new vision.ImageAnnotatorClient();
let labels = null;

// Performs label detection on the image file
client
    .labelDetection(`${filename}`)
    .then(results => {
        labels = results[0].labelAnnotations;

        console.log('Labels: ');
        labels.forEach(label => console.log(label.description));
    })

    .catch(err => {
        console.error('ERROR: ', err);
    });

Not sure where you want to use it, but you will only be able to use its value after the promise is resolved. In which case a better approach would be:



I want to use the "labels" variable beyond its scope, how can I do it ? I know its not a good practice but I still want to use the values in labels array. I tried cloning the variable but the scope issue persists

const client = new vision.ImageAnnotatorClient();
// Performs label detection on the image file
client
    .labelDetection(`${filename}`)
    .then(results => {
        var labels = results[0].labelAnnotations;

        console.log('Labels: ');
        labels.forEach(label => console.log(label.description));
        return labels;
    })

    .then(labels => {
        console.error('Some other usage for labels: ', labels);
    });


    .catch(err => {
        console.error('ERROR: ', err);
    });

How to use the variable beyond it's scope in Javascript?

2 Answers2