Ответ 1

2019: обновление на различия и использования

Во-первых, есть очевидная разница: синтаксис. Это простая, но необходимая для понимания разницы: свойства интерфейса могут заканчиваться запятыми или точками с запятой, однако свойства класса могут заканчиваться только точками с запятой. Теперь интересные вещи. Разделы о том, когда использовать и не использовать, могут быть субъективными - это рекомендации, которые я даю людям в моей команде, но возможно, что у других команд будут другие рекомендации по уважительным причинам. Не стесняйтесь комментировать, если ваша команда делает это по-другому, я хотел бы узнать, почему.

Интерфейсы: позволяют определить тип, который будет использоваться во время разработки, и время компиляции для строгой типизации. Они могут быть "реализованы" или "расширенные", но не могут быть созданы (вы не можете new их). Они удаляются при переносе в JS, поэтому они не занимают места, но они также не могут быть проверены на тип во время выполнения, поэтому вы не можете проверить, реализует ли переменная определенный тип во время выполнения (например, foo instanceof bar), за исключением проверки свойства, которые он имеет: Проверка типа интерфейса с помощью Typescript.

Когда использовать интерфейсы: используйте их, когда вам нужно создать контракт свойств и функций для объекта, который будет использоваться в нескольких местах вашего кода, особенно в нескольких файлах или функциях. Также используйте, когда вы хотите, чтобы другие объекты запускались с этим базовым набором свойств, например, с интерфейсом Vehicle который несколько классов реализуют как конкретные типы транспортных средств, таких как Car, Truck, Boat (например, class Car implements Vehicle).

Когда не использовать интерфейсы: Когда вы хотите иметь значения по умолчанию, реализации, конструкторы или функции (а не только подписи).

Классы: также позволяют определять тип, который будет использоваться во время разработки, и время компиляции для строгой типизации и, кроме того, могут использоваться во время выполнения. Это также означает, что код не скомпилирован, поэтому он займет место. Это одно ключевое отличие, упомянутое @Sakuto, но оно имеет больше последствий, чем просто пространство. Это означает, что классы могут быть проверены на типизацию, сохраняя понимание того, "кто они" даже в переданном JS-коде. Дальнейшие различия включают в себя: классы могут быть созданы с использованием new и могут быть расширены, но не реализованы. Классы могут иметь конструкторы и фактический код функции наряду со значениями по умолчанию.

Когда использовать классы: когда вы хотите создать объекты, в которых есть действительный код функции, есть конструктор для инициализации и/или вы хотите создавать их экземпляры с помощью new. Также для простых объектов данных вы можете использовать классы для установки значений по умолчанию. Другой раз, когда вы захотите их использовать, это когда вы выполняете проверку типов, хотя при необходимости есть обходные пути для интерфейсов (см. Раздел OS раздела link).

Когда не использовать классы: когда у вас есть простой интерфейс данных, вам не нужно создавать его экземпляр, когда вы хотите, чтобы он был реализован другими объектами, когда вы хотите просто поместить интерфейс в существующий объект (файлы определения типов думать) или когда пространство, которое это займет, является запретительным или необоснованным. В качестве примечания, если вы посмотрите в файлах .d.ts, вы заметите, что они используют только интерфейсы и типы, и, таким образом, это полностью удаляется при передаче в TS.

Последнее замечание, есть два других варианта, кроме классов и интерфейсов, первый из них называется "тип", который очень похож на интерфейс, но посмотрите этот пост SO, в частности ответ на обновление 2019 года: Typescript: Interfaces vs Types. Последний вариант - использовать функциональный стиль программирования (не ООП) с TS.

Для полной истории с примерами посетите PassionForDev.com, а для получения более подробной информации о классах и наследовании с примерами посетите https://jameshenry.blog/typescript-classes-vs-interfaces/.

Ответ 2

В соответствии со стилевым руководством Angular 2 для набора текста рекомендуется использовать Class over Interface. Основное отличие состоит в том, что class будет сохраняться при компиляции, в то время как Interface удаляется только потому, что он не используется.

Просто оставайтесь последовательными на протяжении всего проекта и предпочитайте стилевой подход к class, который знает, может быть, однажды вам нужно будет добавить method в ваши models.

Проверьте ответ ниже для более подробной информации: fooobar.com/questions/843313/...

Ответ 3

Просто класс предназначен для создания объектов, а интерфейс помогает вам, что эти объекты должны содержать.

Класс похож на шаблон/шаблон, с помощью которого мы можем создавать объекты. Интерфейс подобен договору, по которому класс должен договориться о реализации этого интерфейса или определить, что должен содержать этот план.

Простой класс:

class Car {
    engine: string; // 'var' is not used;

    constructor(engine: string) { // This is how we create constructor
        this.engine = engine;
    }

    display(): void { // 'function' keyword is not used here.
        console.log('Engine is ${this.engine}'); // just a log.
    }
}

var objCar = new Car('V8'); // creates new onject
objCar.display(); // output: Engine is V8
console.log(objCar.engine); // output: V8 (accessing member here)

Простой интерфейс:

    interface IPerson { // This is how we create an interface.
        firstName: string, // use commas to separate.
        lastName: string, // In classes we use semi-colon to separate.
        displayDetails: (number) => string
    }

    // We are going to store 'interface object' in a variable.
    // i.e. we are implementing interface with variable(not class!!)
    var customer: IPerson = {

        firstName: 'jose jithin', // 'implements' variables
        lastName: 'stanly',

        // Now method implementation.
        // Note: the syntax of 'displayDetails' maybe a bit confusing (given below)
        // as two colons are used.
        // It specifies a return type(string) here for this method. 
        displayDetails: (rank): string => { return 'This person has rank ${rank}. ' }  

        // It can be rewritten as following too.
        displayDetails: (rank) => { return 'This person has rank ${rank}. ' };
        // i.e. return type need not be specified, just like a normal method definition syntax.
    }

    console.log(customer.firstName); // output: jose jithin

    console.log(customer.lastName);  // output: stanly

    console.log(customer.displayDetails(1)); // output: This person has rank 

Я подробно описал класс и интерфейс в моей статье. Это может помочь вам понять.

Ответ 4

Используйте машинопись для создания модели данных вместо класса, так как компилятор не будет генерировать соответствующий код JavaScript для интерфейса во время выполнения. Принимая во внимание, что если вы используете класс для простого создания модели данных, то компилятор создаст соответствующий код JS для него, следовательно, будет занимать память.

Фрагмент из руководства по стилю Angular: https://angular.io/guide/styleguide#interfaces

"Подумайте об использовании класса вместо интерфейса для сервисов и объявлений (компонентов, директив и каналов)".

" Подумайте об использовании интерфейса для моделей данных ".

Ответ 5

Я использую угловые последние 2 года и простыми словами, когда я хочу добавить любое поведение к своему объекту, я использую класс, например, для любого класса, я хочу добавить метод get, который возвращает обработанные данные, и когда нет никакого поведения, добавленного к объекту и Я хочу получить прямой доступ к объекту. Я буду использовать интерфейс. Используя класс, если вы определяете конструктор, вы ограничиваете пользователя определением определенной переменной для инициализации перед созданием любого объекта.