根据评论更新

Question

这2个typeScript代码有什么区别？（我使用的是typeScript 1.7.5）

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

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

var obj = {color1: "black"};
var mySquare = createSquare(obj);

编译时不是错误但是代码生成错误。

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

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

var mySquare = createSquare({color1: "black"});

错误：

test.ts（18,30）：错误TS2345：类型的参数＆＃39; {color1：string; }＆＃39;不能分配给＆＃39; SquareConfig＆＃39;类型的参数。对象文字只能指定已知属性，并且＆lt; color1＆＃39;类型＆＃39; SquareConfig＆＃39;。
中不存在

Answer 1

您的两个示例都有相同的（感知的）错误，即您指定了SquareConfig未知的属性，这通常意味着您输入了错误的属性名称。

在您的情况下，您已指定color1您可能打算使用color。

在添加检查未指定属性的附加功能之前，此代码将使用旧版本的TypeScript进行编译。

...修复

选项一，指定正确的属性：

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

选项二，你故意打算包含一些其他属性，使用类型断言来告诉编译器你知道的比它更好（只要你确定你确实知道它比它更好！）：< / p>

var mySquare = createSquare(<SquareConfig>{color1: "black"});

根据评论更新

编译器越严格，你所拥有的“分离度”越少......例如：

// Error
var obj: SquareConfig = {color1: "black"};

// OK
var obj = {color1: "black"};
var obj2: SquareConfig = obj;

让我们看一下第一个例子，我们说“我打算创建一个SquareConfig”。编译器说，“好吧，没有必需的项目，因为一切都是可选的，但是你创建的对象具有我不认识的属性 - 所以我会警告你”。

第二个例子略有不同。我们说“我打算使用我拥有的SquareConfig”对象。编译器说，“你打算使用的对象是否缺少任何必需的属性......并且每个属性都有正确的类型作为SquareConfig的结构匹配 - 是的。”

如果第二个场景警告您目标结构上不存在的属性，那么您将无法利用结构类型系统提供的超级多态性。

这2个typeScript代码有什么区别？

1 个答案:

根据评论更新