객체 옵셔널체이닝 ?.

let user = {
	name:'lee',
    age:34
}

객체프로퍼티에 접근할때 .연산자 , []연산자를 사용하여 접근할 수 있다.

console.log( user.name );
console.log( user['age'] );

자바스크립트는 user.surname 존재하지 않는 프로퍼티에 접근했을때 에러를 발생시키지 않고 undefined를 반환한다.

console.log( user.surname ); // undefined
console.log( user.surname.length ); // error

user.surname;
속성접근자는 user객체에서 surname프로퍼티를 찾는다. 없다면 상위객체들에서 surname프로퍼터를 찾는다. 없으면 undefined를 반환한다.

user.surname.length;
속성접근자는 user객체에 접근하여 surname프로퍼티를 찾는데 없으므로 undefined가 반환된다.

속성접근자는 해당 변수의 메모리에 접근하는데 undefined가 참조하는 메모리는 없기때문에 에러가 발생되고 스크립트가 중단된다.

스크립트가 중지되지 않게하려면 아래와같이 예외처리를 해야한다.

let user ={
  name:'lee',
}

try {
  console.log(user.name1.length);  
} catch (error) {
  console.log(error.message);
}

자바스크립트는 객체의 구조상 위와같이 예상치못한 undefined인 프로퍼티에 접근하는 경우가 자주 발생할 수 있다.

그래서 자바스크립트는 객체옵셔널체이닝(?.)을 지원한다.
객체옵셔널체이닝은 연산자가 아니고 syntax construct다.

let user ={
  name:'lee',
}
console.log( user.name1?.length );  
console.log( user.name1?['length'] );  

name1이 undefined이면 undefined를 반환하고 length속성에 접근하지 않는다.

객체옵셔널체이닝은 구식브라우저에서 지원하지 않기때문에 아래 폴리필을 사용해야 한다.

let user ={
  name:'lee',
}
console.log(user.name1 && user.name1.length );  

let user ={
  name:'lee',
  sayHi(){
    return 'abd';
  }
}
console.log( user.sayBye?.() ); 

객체옵셔널체이닝으로 함수호출