Q:

Javascript Array and assign them to variable, but first value as undefined. why?

When making an unordered list from JS by using Array, first value is undefined.
var list; //box for accumulating list tags
var arr = ['menu1', 'menu2', 'menu3', 'menu4'];

for(var i = 0; i < arr.length; i++) {
    list += '<li>' + arr[i] + '</li>';
}

document.getElementById('menu').innerHTML = list;

result: 
<ul id="menu">
undefined
<li>menu1</li>
<li>menu2</li>
<li>menu3</li>
<li>menu4</li>
</ul>

But assign null value at first, it will be fine.
var list = "";

So I want to know what the difference is.
If this question is redundant, I'll delete it soon.
Thank you for stopping by.

A:

Problem Part
That is because when you define a variable & don't initialize, it will be undefined. 
var list; //list is undefined here

So when you are first time saying 
list += arr[i]

So it is basically 
list = undefined + arr[0];

So last output will be 
'undefined<li>...'

Working Part
You are saying 
var list = '';

So first time it will be 
list = '' + arr[0];

So last output will be 
'<li>...'

