サンプルコードで身につける: オプショナルプロパティ ?

const simplePost: { title: string; subtitle?: string } = { title: "今日の日記" };
const detailedPost: { title: string; subtitle?: string } = {
  title: "旅行記",
  subtitle: "京都編",
};

console.log(simplePost.title);
console.log(simplePost.subtitle); // 省略されたので undefined
console.log(detailedPost.subtitle);

function introduce(profile: { userName: string; hobby?: string }): string {
  if (profile.hobby !== undefined) {
    return profile.userName + "の趣味は" + profile.hobby + "です";
  }
  return profile.userName + "の趣味は未登録です";
}

console.log(introduce({ userName: "Taro", hobby: "読書" }));
console.log(introduce({ userName: "Hanako" }));

function buildPageSetting(options: { pageSize?: number; showHeader?: boolean }): string {
  const pageSize = options.pageSize !== undefined ? options.pageSize : 10;
  const showHeader = options.showHeader !== undefined ? options.showHeader : true;
  return "1ページ" + pageSize + "件 / ヘッダー" + (showHeader ? "あり" : "なし");
}

console.log(buildPageSetting({})); // 全部省略すると既定値になる
console.log(buildPageSetting({ pageSize: 50 }));
console.log(buildPageSetting({ pageSize: 20, showHeader: false }));

const products = [
  { productName: "コーヒー", price: 480 },
  { productName: "紅茶", price: 400 },
  { productName: "ケーキ", price: 950 },
];

function searchProducts(condition: { minPrice?: number; maxPrice?: number }) {
  return products.filter(function (product) {
    if (condition.minPrice !== undefined && product.price < condition.minPrice) return false;
    if (condition.maxPrice !== undefined && product.price > condition.maxPrice) return false;
    return true;
  });
}

console.log(searchProducts({ maxPrice: 500 }));
console.log(searchProducts({ minPrice: 450, maxPrice: 1000 }));

function formatAddress(address: {
  prefecture: string;
  city: string;
  building?: string;
  deliveryNote?: string;
}): string {
  let result = address.prefecture + address.city;
  if (address.building !== undefined) {
    result = result + " " + address.building;
  }
  if (address.deliveryNote !== undefined) {
    result = result + "(" + address.deliveryNote + ")";
  }
  return result;
}

console.log(formatAddress({ prefecture: "東京都", city: "千代田区1-1" }));
console.log(formatAddress({ prefecture: "大阪府", city: "北区2-3", building: "梅田ビル401", deliveryNote: "置き配希望" }));