Elm (langage)

Elm est un langage de programmation fonctionnel qui permet de créer des interfaces graphiques pour le web. Il compile le code en JavaScript.

Elm (langage)
Date de première version	2012
Paradigme	fonctionnel
Auteur	Evan Czaplicki
Dernière version	0.19.1 (21 Octobre 2019)
Typage	statique
Influencé par	Haskell
Écrit en	Haskell
Système d'exploitation	Linux, Windows et Mac
Licence	Licence BSD
Site web	https://elm-lang.org/
Extension de fichier	elm
modifier

Historique

Elm a été créé par Evan Czaplicki en 2012^[1]. La première version d'Elm vient avec quelques exemples et un éditeur en ligne, pour tester le langage^[2]. Evan Czaplicki rejoint Prezi en 2013 pour travailler sur Elm^[3], et en 2016, il lance la fondation Elm Software Foundation^[4].

L'implémentation initiale d'Elm cible HTML, CSS et Javascript. Les outils se sont étendus avec désormais un REPL^[5], un gestionnaire de paquets^[6], un « débogueur dans le temps »^[7] ainsi qu'un installateur pour Windows et Mac^[8].

Caractéristiques

Elm possède peu de structures de langage mais celles-ci sont très expressives : if, let, case, fonctions anonymes et interpolation de listes^[9],[10]. Ses principales caractéristiques sont : les souscriptions, l'immutabilité, le typage statique et l'interopérabilité avec HTML, CSS et JavaScript.

Souscriptions

La grande abstraction d'Elm est appelée « Sub ». Il s'agit d'un évènement qui déclenche une fonction :

import Html exposing (Html)
import Html.App as Html
import Svg exposing (..)
import Svg.Attributes exposing (..)
import Time exposing (Time, second)

main =
  Html.program
    { init = init
    , view = view
    , update = update
    , subscriptions = subscriptions
    }

type alias Model = Time

init : (Model, Cmd Msg)
init =
  (0, Cmd.none)

type Msg
  = Tick Time

update : Msg -> Model -> (Model, Cmd Msg)
update action model =
  case action of
    Tick newTime ->
      (newTime, Cmd.none)

subscriptions : Model -> Sub Msg
subscriptions model =
  Time.every second Tick

view : Model -> Html Msg
view model =
  let
    angle =
      turns (Time.inMinutes model)

    handX =
      toString (50 + 40 * cos angle)

    handY =
      toString (50 + 40 * sin angle)
  in
    svg [ viewBox "0 0 100 100", width "300px" ]
      [ circle [ cx "50", cy "50", r "45", fill "#0B79CE" ] []
      , line [ x1 "50", y1 "50", x2 handX, y2 handY, stroke "#023963" ] []
      ]

Immutabilité

Toutes les valeurs d'Elm sont immutables, cela signifie qu'une valeur ne peut pas changer après avoir été créée.

Typage statique

Elm est statiquement typé.

Modules

Elm fonctionne avec des modules.

Interopérabilité avec HTML, CSS et JavaScript

Elm utilise une abstraction nommée port pour communiquer avec JavaScript.

Exemple de code

-- Commentaire sur une ligne

{- Ceci est un commentaire multiligne.
   Il peut continuer sur plusieurs lignes.
-}

{- Il est possible {- d'imbriquer -} les commentaires multilignes -}

-- Définition d'une valeur nommée « greeting ». Le type est inféré comme un « String ».
greeting =
    "Hello World!"

-- Il est préférable d'ajouter l'annotation des types pour les déclarations de haut-niveau.
hello : String
hello =
    "Hi there."

-- Les fonctions sont déclarées de la même façon, avec les arguments qui suivent le nom de la fonction.
add x y =
    x + y

-- Il est préférable d'annoter les types pour les fonctions aussi.
hypotenuse : Float -> Float -> Float
hypotenuse a b =
    sqrt (a^2 + b^2)

-- Le « if » est une expression : il retourne une valeur.
absoluteValue : Int -> Int
absoluteValue number =
    if number < 0 then -number else number

-- Les enregistrements sont utilisés pour grouper les valeurs avec des noms.
book : { title:String, author:String, pages:Int }
book =
    { title = "Steppenwolf"
    , author = "Hesse"
    , pages = 237 
    }

-- Il est possible de créer un nouveau type avec le mot-clé « type ».
-- Ce qui suit représente un arbre binaire.
type Tree a
    = Empty
    | Node a (Tree a) (Tree a)

-- Il est possible d'inspecter ces types avec une expression « case ».
depth : Tree a -> Int
depth tree =
    case tree of
      Empty -> 0
      Node value left right ->
          1 + max (depth left) (depth right)

Références

1. Evan Czaplicki's thesis on Elm
2. Elm's Online Editor
3. Elm joins Prezi
4. New Adventures for Elm
5. Elm REPL announcement
6. Elm Package Manager announcement
7. Elm's Time-Traveling Debugger
8. Elm Platform
9. The Syntax of Elm
10. About Elm Elm features

Liens externes

• Site officiel

• Portail de la programmation informatique