Javascript: a function returned a value but when I console.log it, always shows undefined

Question

    var testData = [{'date': '10:45', 'electricity': 0.49, 'temp': 49},
            {'date': '11:00', 'electricity': 0.14, 'temp': 50},
            {'date': '11:15', 'electricity': 0.87, 'temp': 35}]
    function findData(time){
        testData.forEach(function(item){
            if(item['date'] == time){
                console.log('item: ', item);
                var result = new Array(item['electricity'], item['temp'])
                console.log('result: ', result)
                return result;
            }
        })
    }
    var a = findData('10:45');
    console.log(a)

Any idea why console.log(a) gives undefined? I have done some research but didn't get the answer:(

because your function `findData` does not return anything. The callback in `forEach` does, but that has nothing to do with `findData`. You probably want to use [`Array.find`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/find) — derpirscher, Jan 03 '22 at 20:56

score 0 · Accepted Answer · answered Jan 03 '22 at 20:59

You can not return from a callback for Array#forEach and you need at least a return statment in the function block to get a different value as undefined.

Instead, you could find the object with Array#find, destructure the wanted properties and return an array of values.

function findData(data, time) {
     const result = data.find(({ date }) => date === time);
     if (result) {
         const { electricity, temp } = result;
         return [electricity, temp];
     }
}

var testData = [{ date: '10:45', electricity: 0.49, temp: 49 }, { date: '11:00', electricity: 0.14, temp: 50 }, { date: '11:15', electricity: 0.87, temp: 35 }]

var a = findData(testData, '10:45');
console.log(a)

score 0 · Answer 2 · answered Jan 03 '22 at 20:59

0

Your function needs to return something. Also, returning something from the forEach() callback won't do it; you have to store that result in a variable that is visible to findData():

function findData(time){
    var r;
    testData.forEach(function(item){
        if(item['date'] == time){
            console.log('item: ', item);
            var result = new Array(item['electricity'], item['temp'])
            console.log('result: ', result)
            r = result;
        }
    })

    return r;
}

answered Jan 03 '22 at 20:59

kmoser

8,780
3
24
40

While this will probably work, why not just use the [`Array.find`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/find) function, which was defined for exactly that purpose? – derpirscher Jan 03 '22 at 21:00
@derpirscher The purpose of my post was to show why the original code wasn't working and how to fix it. Other people had already pointed out how to use `Array.find()`. – kmoser Jan 04 '22 at 05:21

score 0 · Answer 3 · answered Jan 03 '22 at 21:00

Because you didn't stop the forEach loop after it found result, so the loop keep going to the next index. There are many ways to achieve the result you need. Array.find is one way.

    var testData = [{'date': '10:45', 'electricity': 0.49, 'temp': 49},
            {'date': '11:00', 'electricity': 0.14, 'temp': 50},
            {'date': '11:15', 'electricity': 0.87, 'temp': 35}]
    function findData(time){
        const foundItem = testData.find(function(item){
            return item['date'] == time;
        });
        console.log('item: ', foundItem);
        const result = new Array(foundItem['electricity'], foundItem['temp'])
        console.log('result: ', result) 
        return result;
    }
    var a = findData('10:45');
    console.log(a)

Javascript: a function returned a value but when I console.log it, always shows undefined

3 Answers3