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.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<?php | |
$userMan = (bool) true; | |
$userAge = (int) 81; | |
$userAverage = (float) 10.5; | |
$userName = (string) 'Henri Bergson'; | |
$userName = 10; // OK |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
let userMan: boolean = true; | |
let userAge: number = 81; | |
let userAverage: number = 10.5; | |
let userName: string = `Henri Bergson`; | |
userName = 10; // Error |
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.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<?php | |
$books = (array) ['Book 1', 'Book 2']; | |
$list = (array) ['a', 'b', 10]; // OK |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
let books: string[] = [`Book 1`, `Book 2`]; | |
let list: string[] = ['a', 'b', 10]; // Error |
Comme les objets JavaScript sont comme des instances littérales, TypeScript vous permet d’utiliser les interfaces pour typer les objets.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
interface User { | |
age: number; | |
name: { | |
first: string, | |
last: string | |
}; | |
} | |
let user: User = { | |
age: 81, | |
name: { | |
first: `Henri`, | |
last: `Bergson` | |
} | |
}; |
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.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<?php | |
function myMethod(User $someUser) {} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
function myMethod(someUser: User) {} |
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.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<?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 |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
function myMethod(data: string): int { | |
return 10; | |
} | |
myMethod(20); // Error |
PHP 7.1 autorise à spécifier si une fonction ne retourne rien.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<?php | |
function myMethod(): void {} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
function myMethod(): void {} |
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.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<?php | |
class User { | |
public $firstName; | |
protected $lastName; | |
private $age; | |
public function __construct() {} | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
class User { | |
public firstName: string; | |
protected lastName: string; | |
private age: int; | |
public constructor() {} | |
} |
TypeScript ajoute aussi les classes abstraites et les interfaces.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<?php | |
interface Movable { | |
public move(); | |
} | |
class Vehicle implements Movable { | |
public move() {} | |
} | |
abstract class Test {} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
interface Movable { | |
move(): void; | |
} | |
class Vehicle implements Movable { | |
public move(): void {} | |
} | |
abstract class Test {} |