javascript 在Typescript中,类型和接口有什么区别?

w46czmvw  于 2023-01-01  发布在  Java
关注(0)|答案(6)|浏览(144)

以下两者有何区别?

type Foo = { 
    foo: string 
};
interface Foo {
   foo: string;
}
qojgxg4l

qojgxg4l1#

接口可以 * 扩展 *

interface A {
  x: number;
}
interface B extends A {
  y: string;
}

同时也被 * 增强 *

interface C {
  m: boolean;
}
// ... later ...
interface C {
  n: number;
}

但是,类型别名可以表示接口所不能表示的某些内容

type NumOrStr = number | string;
type NeatAndCool = Neat & Cool;
type JustSomeOtherName = SomeType;

一般来说,如果你只有一个普通的对象类型,如你的问题所示,接口通常是一个更好的方法,如果你发现自己想写一些不能写接口的东西,或者只是想给予一些东西一个不同的名字,类型别名是更好的方法。

edqdpe6u

edqdpe6u2#

正确看待事物

let myAge = 25;
let totalStatesInMyCountry = 25

看,两个变量是相等的,也就是(myAge === totalStatesInMyCountry),但是它们的上下文完全不同。
对于 typescript 的typesinterfaces,情况类似。

type Foo = {
    text: string
};
interface Foo {
    text: string;
}

Foo作为type和作为interface看起来是一样的,类似于(myAge === totalStatesInMyCountry),但这只是特例,它们的上下文完全不同。

何时考虑使用interface而不是types

1.你强制这个类必须有这些方法,你考虑的是接口而不是类型。
1.你想为同一个合约创建多个实现。比如合约toHumanReadableNumber(number),需要的不同实现是100000 -> 100,000100000 -> 100K100000 -> 100 Thousands。假设你通过为每个需求创建不同的类来解决这个问题。你考虑的是classes and interfaces而不是classes and types
1.接口的存在使得系统松散耦合,就像实现SOLID原则一样。
1.接口是多重继承的替代。一个类只能继承单个类,但可以有多个接口。
1.对于class Point{ x:number,y:number, distanceFromCenter():number},在接口上下文中,只有distanceFromCenter():number是重要的。

  • --------x----------

旧答案(2022年12月31日前)

这些之间的差异也已经在这个线程。

type Foo = {
    foo: string
};
interface Foo {
    foo: string;
}

这里type Foointerface Foo看起来几乎相似,所以很混乱。
interface是一个对象中应该有以下属性(这里是foo:string)的约定。interface不是class。它在语言不支持多重继承时使用。因此interface可以是不同类之间的公共结构。

class Bar implements Foo {
    foo: string;
}

let p: Foo = { foo: 'a string' };

但是typeinterface在非常不同的上下文中使用。

let foo: Foo;
let today: Date = new Date();

这里footypeFootodayDate。它就像一个变量decleration,保存了其他变量的类型信息。type就像一个超集,接口,类,函数签名,其他类型甚至值(如type mood = 'Good' | 'Bad')。最后type描述了变量的可能结构或值。

jckbn6z7

jckbn6z73#

说“接口可以实现”是错误的,因为类型也可以实现

type A = { a: string };

class Test implements A {

    a: string;
}

虽然你可以这样做,但你不能实现一个类型的联合,这是完全有意义的诚实:)

oxcyiej7

oxcyiej74#

类型有点像接口,反之亦然:两者都可以通过类来实现,但有一些重要的区别:1.当Type由类实现时,属于Type的属性必须在类内部初始化,而对于Interface,它们必须声明。2.如@ryan所述:接口可以扩展另一个接口。类型不能。

type Person = {
    name:string;
    age:number;
}

// must initialize all props - unlike interface
class Manager implements Person {
    name: string = 'John';
    age: number = 55;

    // can add props and methods
    size:string = 'm';
}

const jane : Person = {
    name :'Jane',
    age:46,

    // cannot add more proprs or methods
    //size:'s'
}
guicsvcw

guicsvcw5#

类型脚本中的类型用于引用已经存在的类型。它不能像interface那样扩展。type的示例如下:

type Money = number;
type FormElem = React.FormEvent<HTMLFormElement>;
type Person = [string, number, number];

可以在以下类型中使用“静止”和“扩散”:

type Scores = [string, ...number[]];
let ganeshScore = ["Ganesh", 10, 20, 30]
let binodScore = ["Binod", 10, 20, 30, 40]

另一方面,接口允许您创建一个新类型。

interface Person{
  name: string,
  age: number, 
}

Interface can be extended with extends keyword.
interface Todo{
  text: string;
  complete: boolean;
}

type Tags = [string, string, string]

interface TaggedTodo extends Todo{
 tags: Tags
}
zu0ti5jz

zu0ti5jz6#

同样,接口也可以被实现。

相关问题