Comparatif : de PHP 7 à TypeScript

Ce guide présente une comparaison de la syntaxe entre PHP (7 minimum) et JavaScript (ES6/ES2015 minimum) / TypeScript. C’est un supplément au comparatif de PHP à JavaScript ES6, par lequel vous devriez commencer.

Vous trouverez d’autres guides et une explication plus générale ici.

Pourquoi TypeScript ? En tant que développeur PHP travaillant avec des frameworks comme Symfony ou Zend, vous allez adorer, et on vous explique pourquoi ici. Ce guide précise clairement quand une fonctionnalité est propre à TypeScript. Tout le reste est du JavaScript standard.

Types de données simples

PHP a toujours permis d’expliciter les types, mais seulement pour faire une conversion. TypeScript verrouille les types, vous ne pouvez plus en changer après la déclaration de votre variable. Les nombres entiers et décimaux sont de même type en JavaScript.

<?php
$userMan = (bool) true;
$userAge = (int) 81;
$userAverage = (float) 10.5;
$userName = (string) 'Henri Bergson';
$userName = 10; // OK

view raw
types.php
hosted with ❤ by GitHub

let userMan: boolean = true;
let userAge: number = 81;
let userAverage: number = 10.5;
let userName: string = `Henri Bergson`;
userName = 10; // Error

view raw
types.ts
hosted with ❤ by GitHub

Listes de données

En PHP, vous pouvez seulement préciser que telle variable est un tableau. En TypeScript, vous précisez un tableau de quoi, étant donné qu’il s’agit seulement de listes homogènes en JavaScript.

<?php
$books = (array) ['Book 1', 'Book 2'];
$list = (array) ['a', 'b', 10]; // OK

view raw
array.php
hosted with ❤ by GitHub

let books: string[] = [`Book 1`, `Book 2`];
let list: string[] = ['a', 'b', 10]; // Error

view raw
array.ts
hosted with ❤ by GitHub

Comme les objets JavaScript sont comme des instances littérales, TypeScript vous permet d’utiliser les interfaces pour typer les objets.

interface User {
age: number;
name: {
first: string,
last: string
};
}
let user: User = {
age: 81,
name: {
first: `Henri`,
last: `Bergson`
}
};

view raw
interface.ts
hosted with ❤ by GitHub

Typage des fonctions

PHP a toujours permis de vérifier qu’un paramètre soit une instance d’une classe spécifique. TypeScript permet aussi le typage des fonctions.

<?php
function myMethod(User $someUser) {}

view raw
params.php
hosted with ❤ by GitHub

function myMethod(someUser: User) {}

view raw
params.ts
hosted with ❤ by GitHub

PHP 7 a introduit la vérification des types de données simples pour les paramètres, et la possibilité de typer la valeur de retour. Notez qu’en PHP les types ne sont imposés que sur demande.

<?php
/* PHP 7+ – default (automatic conversion) */
function myMethod(string $data): int {
$data; // '20'
return 10;
}
myMethod(20); // OK
/* PHP 7+ – strict types */
declare(strict_types=1);
function myMethod(string $data): int {
return 10;
}
myMethod(20); // Error

view raw
functions.php
hosted with ❤ by GitHub

function myMethod(data: string): int {
return 10;
}
myMethod(20); // Error

view raw
functions.ts
hosted with ❤ by GitHub

PHP 7.1 autorise à spécifier si une fonction ne retourne rien.

<?php
function myMethod(): void {}

view raw
void.php
hosted with ❤ by GitHub

function myMethod(): void {}

view raw
void.ts
hosted with ❤ by GitHub

Classes

TypeScript ajoute la pré-déclaration des propriétés, avec les modificateurs de visibilité, qui n’existent pas encore dans le standard JavaScript.

<?php
class User {
public $firstName;
protected $lastName;
private $age;
public function __construct() {}
}

view raw
class.php
hosted with ❤ by GitHub

class User {
public firstName: string;
protected lastName: string;
private age: int;
public constructor() {}
}

view raw
class.ts
hosted with ❤ by GitHub

TypeScript ajoute aussi les classes abstraites et les interfaces.

<?php
interface Movable {
public move();
}
class Vehicle implements Movable {
public move() {}
}
abstract class Test {}

view raw
interface.php
hosted with ❤ by GitHub

interface Movable {
move(): void;
}
class Vehicle implements Movable {
public move(): void {}
}
abstract class Test {}

view raw
interface.ts
hosted with ❤ by GitHub

Revenir au sommaire des guides JavaScript