JavaScript のオプション (?.) 演算子について話しましょう

const userName = response ? (response.data ? (response.data.user ? response.data.user.name : null) : null) : null;

let userName = null;
if(response && response.data && response.data.user){
  userName = response.data.user.name;
}

const userName = response && response.data && response.data.user && response.data.user.name;

const userName = response?.data?.user?.name;

obj.val?.pro  // 如果`val`存在，则返回`obj.val.prop`，否则返回 `undefined`。

obj.func?.(args) // 如果 obj.func 存在，则返回 `obj.func?.(args)`，否则返回 `undefined`。

obj.arr?.[index] // 如果 obj.arr 存在，则返回 `obj.arr?.[index]`，否则返回 `undefined`。

const user = {
  name: "前端小智",
  age: 21,
  homeaddress: {
    country: "中国"
  },
  hobbies: [{name: "敲代码"}, {name: "洗碗"}],
  getFirstName: function(){
    return this.name;
  }
}

console.log(user.homeaddress.country); 
// 中国

console.log(user.officeaddress.country); 
// throws error "Uncaught TypeError: Cannot read property 'country' of undefined"

console.log(user.officeaddress?.country); 
// undefined

console.log(user.getFirstName());

console.log(user.getLastName()); 
// throws error "Uncaught TypeError: user.getLastName is not a function";

console.log(user.getLastName?.()); 
// "undefined"

console.log(user.hobbies[0].name); 
// "敲代码"

console.log(user.hobbies[3].name); 
// throws error "Uncaught TypeError: Cannot read property 'name' of undefined"

const country = user.officeaddress?.country;
console.log(country);
// undefined

const country = user.officeaddress?.country ?? "中国";
console.log(country);
// 中国