undefined가 나오는 경우

1. 변수는 선언했는데 값을 할당하지 않은 경우

let x; 
console.log(x); //undefined 

2. 함수는 호출했는데 return문이 작성되어있지 않은 경우

function sayHello(name){
	console.log(`어서오세요 ${name}님!`);
 } 
 console.log(sayHello('해리포터')); //undefined 

3. 파라미터가 있는데 함수를 호출할 때 아무런 값도 전달하지 않는 경우

function sayHello(name){
	console.log(`어서오세요 ${name}님!`);
 } 
 sayHello(); // 어서오세요 undefined님!  

파라미터가 있는 함수에 아무런 값도 전달하지 않고 함수를 호출하는 경우에는 undefined값이 나오는데 필요에 따라서는 undefined가 아니라 다른 값이 자동으로 전달되게끔 파라미터에 기본값을 설정하는 방법이 있다. 함수를 전달할때 파라미터 값을 전달해도 되고 생략해도 되니까 선택적으로 전달을 받는다고 해서 이런 파라미터를 '옵셔널 파라미터'라고 부른다.

function introduce(name, age, nationality = '한국') //옵셔널 파라미터 
	console.log(`제 이름은 ${name}입니다.`)
    console.log(`나이는 ${age}살 이고,`) 
    console.log(`국적은 ${nationality}입니다.`) 
 } 
 
 introduce('해리포터', 18, '영국'); //값을 모두 전달한 경우 
 console.log(''); 
 introduce('아기상어', 6); // 파라미터 값을 생략한 경우 (옵셔널 파라미터 적용) 

콘솔에 나오는 값은 아래와 같다.

제 이름은 해리포터입니다.
나이는 18살 이고,
국적은 영국입니다. 

제 이름은 아기상어입니다.
나이는 6살 이고,
국적은 한국입니다. 

주의할 점은, 옵셔널 파라미터는 선언할 때 반드시 가장 뒤쪽으로 선언을 해주어야 한다. 중간에 파라미터가 들어가게 되면 undefined값이 나온다.