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