[Error] Cannot destructure property 'name' of 'undefined' as it is undefined.

자바스크립트 함수에서 전달 받는 파라미터는 초기 값을 설정해주는 것도 가능하고,

배열로도 받을 수 있고, 

객체로도 전달이 가능하다. 

 

주로 객체나 배열로 전달하면 통체로 전달하지만

각각의 객체에 대한 프로퍼티를 보여주거나 배열의 각 항목별 선언된 내용이 필요한 경우 

해당 항목을 바로 사용할 수 있다. 

 

- 예시

// 이런 객체가 존재할때 
let student = {
    name: "name"
    age: 15
}

// 이름을 가지고 오고 싶은 함수라면
function getName (obj) {
	return obj.name
}

// 이런 방식도 가능하다
function getNameByParam({name}) {
    return name
}

 

 

아래처럼 썼을 때 장점은 

함수에서 전달받은 프로퍼티가 뭔지 알 수 있다는 점이다. 

객체의 크기가 커지고 파리미터가 많으면 그냥 객체로 보내고 주석으로 처리 해도 무방하다. 

 

그런데 위와 같은 

에러가 발생하는 경우에는 

전달 받은 변수 자체가 undefind 라서 생기는 오류 이다. 

 

- 예시

// 이름을 보내는 함수가 존재한다고 가정했을 때
function getName({name}) {
    return name
}

// error
getName()

// 1. 빈 객체 전달
getName({})

2. 초기화 선언
function getName({name} = {}) {
    return name
}

 

 

끝