可选属性

在使用一个对象实现了带有可选属性的接口时，可以自由选择是否在该对象中包含可选属性。编译器不会强制要求必须包含可选属性，但会在类型检查时提供相应的警告。
接口里的属性不全都是必需的。有些是只在某些条件下存在，或者根本不存在。可选属性在应用“option bags”模式时很常用，即给函数传入的参数对象中只有部分属性赋值了。下面是应用了“option bags”的例子：

interface SquareConfig {
  color?: string;
  width?: number;
}

function createSquare(config: SquareConfig): {color: string; area: number} {
  let newSquare = {color: "white", area: 100};
  if (config.color) {
    newSquare.color = config.color;
  }
  if (config.width) {
    newSquare.area = config.width * config.width;
  }
  return newSquare;
}

let mySquare = createSquare({color: "black"});

带有可选属性的接口与普通的接口定义差不多，只是在可选属性名字定义的后面加一个?符号。
可选属性的好处之一是可以对可能存在的属性进行预定义，好处之二是可以捕获引用了不存在的属性时的错误。比如，我们故意将createSquare里的color属性名拼错，就会得到一个错误提示：

interface SquareConfig {
  color?: string;
  width?: number;
}

function createSquare(config: SquareConfig): { color: string; area: number } {
  let newSquare = {color: "white", area: 100};
  if (config.color) {
    // Error: Property 'clor' does not exist on type 'SquareConfig'
    newSquare.color = config.clor;
  }
  if (config.width) {
    newSquare.area = config.width * config.width;
  }
  return newSquare;
}

let mySquare = createSquare({color: "black"});

注意点

在对可选属性进行访问时，需要注意进行空值检查，以防止出现空引用错误。可以使用可选链式操作符（?.）来进行安全访问，后面我们也会提到接口额外的属性检查。

if (person2.email) {
  console.log(`Email: ${person2.email}`);
} else {
  console.log('No email provided');
}

上述代码中，我们通过判断person2.email是否存在来进行安全访问，并在不存在时输出相应的提示。
使用可选属性可以灵活地定义接口，使其适应不同的对象结构，同时提供了对对象属性的选择性约束。这在处理可能存在不确定的属性或可选配置时特别有用。

可选属性 ​

注意点 ​

可选属性

注意点