Используйте TypeScript, чтобы избежать распространенных ошибок, таких как undefined и ошибки типа

TypeScript - это надмножество JavaScript, созданное для решения общих проблем JavaScript.

Проблема JavaScript заключается в том, что все объекты имеют динамические типы. Это означает, что у вас нет возможности узнать, какими свойствами обладает объект, без регистрации в отладчике.

Это создает много разочарований, поскольку вам приходится проверять каждый объект самостоятельно, что замедляет разработку. Без статических типов у вас также не может быть автозаполнения в вашем редакторе, поскольку нет способа узнать, что находится в этих объектах со 100% уверенностью.

Статическая типизация не является обязательной, поэтому вы все равно можете использовать объекты в качестве хэшей.

Тип проверки

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

Это создает проблемы, поскольку аргументы, которые вы должны были передать, но не передали, будут неопределенными, и тогда вы получите неопределенные ошибки. Также ничто не мешает вам приводить слишком много аргументов.

С помощью обеих проверок TypeScript упрощает понимание кода и его выполнение. Вам не нужно беспокоиться о том, что что-то сломается, когда вы меняете код, поскольку компилятор сообщит вам, что вы получили эти базовые ошибки.

Кроме того, внедрение зависимостей является частью TypeScript, что означает, что вам не нужно самостоятельно разрешать зависимости. Это также упрощает тестирование имитирующих зависимостей.

TypeScript предоставляет функции в следующих версиях JavaScript (которые еще не завершены), которые могут быть полезны некоторым разработчикам.

TypeScript добавляет типы к вашим объектам, определяя файлы типов для ваших объектов. Он работает путем настройки модуля и последующего включения в него файла module.d.ts.

Пример этого находится в Документах по TypeScript.

// Type definitions for [~THE LIBRARY NAME~] [~OPTIONAL VERSION NUMBER~]
// Project: [~THE PROJECT NAME~]
// Definitions by: [~YOUR NAME~] <[~A URL FOR YOU~]>
/*~ This is the module template file. You should rename it to index.d.ts
 *~ and place it in a folder with the same name as the module.
 *~ For example, if you were writing a file for "super-greeter", this
 *~ file should be 'super-greeter/index.d.ts'
 */
/*~ If this module is a UMD module that exposes a global variable 'myLib' when
 *~ loaded outside a module loader environment, declare that global here.
 *~ Otherwise, delete this declaration.
 */
export as namespace myLib;
/*~ If this module has methods, declare them as functions like so.
 */
export function myMethod(a: string): string;
export function myOtherMethod(a: number): number;
/*~ You can declare types that are available via importing the module */
export interface someType {
    name: string;
    length: number;
    extras?: string[];
}
/*~ You can declare properties of the module using const, let, or var */
export const myField: number;
/*~ If there are types, properties, or methods inside dotted names
 *~ of the module, declare them inside a 'namespace'.
 */
export namespace subProp {
    /*~ For example, given this definition, someone could write:
     *~   import { subProp } from 'yourModule';
     *~   subProp.foo();
     *~ or
     *~   import * as yourMod from 'yourModule';
     *~   yourMod.subProp.foo();
     */
    export function foo(): void;
}

Согласно примеру с веб-сайта, вы можете определить свойства верхнего уровня как строку кода. И вложенные свойства могут быть определены с помощью ключевого слова namespace.

Объединение типов

Вам не обязательно использовать отдельные типы в TypeScript. Несколько типов можно объединить в один. Типы пересечения - это типы данных, в которых несколько типов данных объединены в один.

Например:

function(foo: Foo, bar: Bar): Foo & Bar {
    const result: Partial<Foo & Bar> = {};
    for (const prop in foo) {
        if (foo.hasOwnProperty(prop)) {
            (result as Foo)[prop] = foo[prop];
        }
    }
    for (const prop in bar) {
        if (bar.hasOwnProperty(prop)) {
            (result as Bar)[prop] = bar[prop];
        }
    }
    return result as Foo& Bar;
}

Объект с комбинированным типом попадает в свойства от обоих типов.

Типы объединения - это тип данных, в котором объект может быть как того, так и другого типа. Например:

let foo: number|string;

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

TypeScript допускает статическую типизацию, сохраняя при этом гибкость.

Все эти функции доступны в TypeScript, ES6 или новее. let и const следует использовать, чтобы избежать конфликта областей видимости, который происходит с var.

Вы также получаете новые типы кортежей и перечислений. Вы можете определить кортеж, массив с фиксированным числом элементов и типом, выполнив:

let x: [string, number] = ["hello", 1]; 

Если вы установите x в [1, “hello”], компилятор TypeScript завершится ошибкой.

Вы можете определить тип enum для списка констант. Например:

enum Color {Red, Green, Blue} 
let green: Color = Color.Green;

В TypeScript массивы могут иметь фиксированные типы. Например, чтобы определить массив чисел, мы помещаем:

let x: number[] = [1,2,3];

Точно так же вы можете назначить массив, например:

let x: Array<number> = [1, 2, 3];

Если вы установите x на ['1','2','3'], компиляция завершится неудачно.

TypeScript также добавляет модификатор доступа к свойствам и методам. Вы можете дополнительно установить свойства и методы как public, private или protected.

public свойства и методы доступны для всех внешних классов. protected свойства и методы доступны для подклассов и текущего класса. private свойства и методы доступны только внутри класса.

Например:

class classA {
  public publicProp: number;
  private privateProp: number;
}
class classB{
  public a: classA;
}
let b: classB = new classB();
b.a: classA = new classA();
b.a.publicProp = 1; // OK
b.a.privateProp = 1; // error

Последняя строка выдаст ошибку, поскольку privateProp недоступен для внешних классов.

Чтобы включить TypeScript в свой проект, вы можете запустить следующее в папке проекта JavaScript:

$ npm install typescript --save-dev           

Вот некоторые основные и важные преимущества, которые предлагает TypeScript. Благодаря этим функциям вы сэкономите много времени на разработке приложений JavaScript!