How can I stop my function from returning "Reference error: (...) is not defined"

Question

I've got this code and it's returning that reference error, but I have no idea why, I've seen lots of Q&As about reference errors, but I still can't find it. Any help is appreciated.

Thanks in advance and may the force be with you.

My code:

 var data = '[{"name":"node1","id":1,"is_open":true,"children":[{"name":"node2","id":6,"children":[{"name":"child3","id":7}]},{"name":"child1","id":2}]}]';

 var dadSon = [];

 (function printDadSon(data, parent) {
   if (!data) return;
   for (var i = 0; i < (data.length); i++) {
     if (parent && parent != 'undefined') {
       console.log('Dad: ' + parent + ' & Son: ' + data[i].id);
       dadSon += ('Dad: ' + parent + ' & Son: ' + data[i].id);
     }

     printDadSon(data[i].children, data[i].id);

   }
 })(JSON.parse(data));

 printDadSon(data);

Good reading regarding JS variable scope: http://stackoverflow.com/a/500459/1139130 — Kerem, Aug 04 '15 at 11:56

Denys Séguret · Accepted Answer · 2015-08-04T11:56:57.277

You're only declaring the function in the scope of your immediately called named function expression. So it's not visible on the line after, when you call it.

You could choose to declare the function as in

 var data = '[{"name":"node1","id":1,"is_open":true,"children":[{"name":"node2","id":6,"children":[{"name":"child3","id":7}]},{"name":"child1","id":2}]}]';

 var dadSon = [];

 function printDadSon(data, parent) {
   if (!data) return;
   for (var i = 0; i < (data.length); i++) {
     if (parent && parent != 'undefined') {
       console.log('Dad: ' + parent + ' & Son: ' + data[i].id);
       dadSon += ('Dad: ' + parent + ' & Son: ' + data[i].id);
     }

     printDadSon(data[i].children, data[i].id);

   }
 }
 printDadSon(JSON.parse(data));

But you don't need to call it after, the line after is useless (and wrong in your code as you don't parse the JSON), just use

 var data = '[{"name":"node1","id":1,"is_open":true,"children":[{"name":"node2","id":6,"children":[{"name":"child3","id":7}]},{"name":"child1","id":2}]}]';

 var dadSon = [];

 (function printDadSon(data, parent) {
   if (!data) return;
   for (var i = 0; i < (data.length); i++) {
     if (parent && parent != 'undefined') {
       console.log('Dad: ' + parent + ' & Son: ' + data[i].id);
       dadSon += ('Dad: ' + parent + ' & Son: ' + data[i].id);
     }

     printDadSon(data[i].children, data[i].id);

   }
 })(JSON.parse(data));

The advantage of the second version is that it doesn't pollute the external scope with a function declaration that you don't need.

thanks for providing such a neat and object answer, I'll mark it as the answer as soon as the StackOverflow allows me :) +1 — Kyle, Aug 04 '15 at 11:56

score 1 · Answer 2 · answered Aug 04 '15 at 11:54

printDadSon is created using a named function expression.

Named function expressions create a variable (matching their name) in their own scope.

printDadSon(data[i].children, data[i].id);

The above line is in the scope of the function, so it can access that variable.

printDadSon(data);

The above line is not.

However, it is passing a string and the earlier line ((JSON.parse(data)) is already calling it with an actual array, so just remove that line because it isn't doing (or trying to do) anything useful.

What a neat and descriptive answer, I'd mark it as the answer but the first guy, well, was the first, but thank you so much for taking the time to help me +1 — Kyle, Aug 04 '15 at 12:08

How can I stop my function from returning "Reference error: (...) is not defined"

2 Answers2