Tutoriel DART : les premiers pas

Malgré sa relative jeunesse, le langage de programmation DART a déjà su s’imposer, notamment dans la programmation d’applications mobiles. L’entreprise Google a lancé Flutter, son kit de développement de logiciel (SDK) qui utilise DART et favorise l’utilisation et la diffusion de ce langage de programmation. L’un de ses points forts vient du fait qu’il peut être utilisé pour programmer des applications pour tous les systèmes d’exploitation mobiles, c’est-à-dire Apple iOS, Google Android ou Microsoft Windows Phone.

Apprenez à programmer avec DART : notre tutoriel DART présente les premières étapes pour se familiariser avec le langage de programmation de Google. Ce n’est pas très difficile. Pour en savoir plus sur ce langage de programmation, consultez notre article sur le langage DART. Vous trouverez de plus amples informations dans notre article sur le kit de développement de logiciels Flutter.

L’origine de DART

À l’origine, DART a été créé pour résoudre les problèmes de JavaScript qui, du point de vue des développeurs, ne pouvaient plus être résolus dans ce langage de programmation déjà établi.

Cette constatation a été le point de départ d’une longue recherche pour trouver des moyens visant à simplifier ou résumer certaines logiques internes sans compromettre toutes les possibilités offertes par ce langage. À titre d’exemple, un code en JavaScript :

getElementsById()
getElementsByTagName()
getElementsByName()
getElementsByClassName()
querySelector()
querySelectorAll()
document.links
document.images
document.forms
document.scripts
formElement.elements
selectElement.options

Le même code avec DART :

elem.query(‘#foo’);
elem.queryAll(‘.foo’);

Débuter avec DART

Un langage de programmation est un univers qui se compose notamment d’un « vocabulaire » permettant de structurer et de concevoir des processus (algorithmes). Pour cela, le langage utilise un nombre fixe de termes, les variables, qui ont une fonction précise. Dans DART, on peut nommer les variables « var », « int », « if », « else » ou encore « while ». Pour en savoir plus sur l’architecture des langages de programmation, consultez notre article dédié. La combinaison de variables, d’opérateurs, de conditions, de fonctions et de bien d’autres éléments conduit au déroulement du programme qui produit un résultat.

DART en pratique

Pour apprendre la programmation avec DART, notre tutoriel vous propose tout d’abord des exemples simples et compréhensibles que vous pourrez ensuite développer et avec lesquels vous pourrez expérimenter. Chaque routine commence par l’appel de la fonction principale. Voici un exemple classique dans le monde de la programmation :

void main () {
    print("Hello World!"); 
}

La fonction « main » est précédée par le type de retour « void », qui indique que la fonction ne renvoie rien. La parenthèse « () » indique qu’il s’agit d’une fonction et le code DART est indiqué dans les crochets « {....} ». Ici, il s’agit d’une commande qui a pour objectif d’afficher quelque chose à l’écran. Tout ce qui se trouve après les barres obliques « // » est considéré comme un commentaire et est invisible. Les commentaires peuvent également être indiqués sous la forme « /* ceci est un commentaire multiligne ...*/ » comme en PHP. Cela vous permet de commenter votre propre code de manière structurée pour votre usage ou à destination d’autres programmeurs, ce qui facilite grandement le travail d’équipe.

Note

Comme pour Java, C et PHP, toutes les commandes DART doivent se conclure par un point virgule.

Testez par vous-même l’exemple ci-dessous. Pour cela, utilisez la plateforme open source gratuite DartPad. Ce pad a notamment l’avantage de numéroter les lignes du programme et d’afficher des messages si une erreur se produit. En outre, il met à disposition certains exemples de programmation dans les menus déroulants.

Dans les exemples qui suivent, « void main() {…} » n’est plus indiqué dans le code.

Définir et utiliser les variables

Les variables sont utilisées pour définir des tailles fixes pour le programme. Commençons avec les chiffres.

var mySize = 174;

Cela permet de définir une nouvelle variable pour « MySize ». Ici, on lui attribue la valeur « 174 ». La valeur de cette variable reste fixe tout au long du déroulement du programme jusqu’à ce qu’elle soit activement modifiée par des opérateurs ou des fonctions. La commande « print » intervient pour afficher la valeur des variables.

var mySize = 174;
print(mySize);
int yourSize = 174;
print(yourSize);
double thisSize = 1.74;
print(thisSize);
dynamic oneSize = 'Onehundredseventyfor' + ': ' + '174';
print(oneSize);

Grâce à la commande « print » dans DartPad, les lignes 3, 6 ,9 et 12 affichent les résultats suivants :

Apprendre à programmer avec DART : la commande print
Il est possible de choisir (presque) n’importe quel nom pour les variables. Cela simplifie la lecture et la correction du code du programme.

Les variables DART ont des types précis. Il peut s’agir de nombres entiers (« int ») ou de nombres à virgule flottante (« double »). Le type de variable « dynamic » peut prendre différentes valeurs et expressions pendant le déroulement du programme. En revanche, les lignes, onglets ou paragraphes vides ne sont pas pris en compte lors du traitement de la routine. C’est pour cette raison que les valeurs sont affichées les unes au-dessous des autres, à droite de la console.

L’attribution d’une valeur incorrecte à un type de variable particulier génère un message d’erreur décrivant l’erreur dans DartPad :

int mySize = 1.74; // integer is expected, but double comes
print(mySize);
Apprendre à programmer avec DART : message d’erreur
DartPad affiche « 1 issue(s) » lors de l’attribution d’une valeur erronée. Dans l’exemple, un nombre à virgule flottante ne peut pas être attribué à une variable entière. L’erreur se produit dans la ligne 2 du déroulement du programme, le numéro incorrect est souligné en orange.
Note

Les identificateurs (Identifier) des variables utilisées ne doivent pas contenir de mots-clés. Les chiffres au début ainsi que les espaces et les caractères spéciaux ne sont pas autorisés, les seules exceptions sont le tiret bas « _ » et le signe de dollar « $ ». Les identificateurs sont sensibles à la casse et doivent être uniques.

Chaînes de caractères

Les chaînes de caractères correspondent au type de données « String » (Attention : ne pas oublier le S majuscule au début), qui permet de traiter n’importe quel caractère en DART. Cela permet également d’aborder la programmation du formatage de textes multilignes avec DART.

String text1 = 'this is a single line string';
String text2 = '''this is a multiline
	line string with a break''';
print(text1);
print(text2);
Apprendre à programmer avec DART : texte simple ou multiligne
Texte simple ou multiligne en DART : le formatage est défini par le nombre de guillemets utilisés.

Pour afficher le texte sous forme de chaîne, encadrez le contenu de guillemets simples ou normaux : ' ou ". Si le texte est encadré par une série de trois guillemets simples ou doubles (''' ou """) il sera affiché en Dart avec les sauts de ligne d’origine. Vous disposez ainsi d’une technique pour formater l’affichage.

Conseil

Sous Windows, les guillemets typographiques (anglais) peuvent facilement être insérés dans le texte grâce aux raccourcis clavier [Alt] + 0147 (ouvrant) et [Alt] + 0148 (fermant). Ils sont également affichés sous cette forme dans une chaîne de caractères DART. Sous macOS, les raccourcis clavier pour ces guillemets sont : [Alt] +[Maj] + [W] et [Alt] + [2].

Jouer avec les nombres en DART

De la définition des variables aux calculs avec des variables, il n’y a qu’un pas. Il est possible d’additionner des nombres ou même des expressions. Pour effectuer les calculs, DART utilise des opérateurs arithmétiques. À titre d’exemple, prenons le cas d’un article dans une boutique en ligne dont le client voudrait acheter trois exemplaires. Dans la fonction panier, le prix individuel doit donc être multiplié par « 3 » et le prix total doit s’afficher. Dans le code ci-dessous, on peut voir l’utilisation de différentes méthodes de regroupement des données, et les commentaires dans les lignes correspondantes :

String product = 'calendar';
String curr = 'EUR';
String isFor = 'for'; // 3 strings for later print use
double singlePrice = 7.96; // floating comma for single price
int amount = 3; // number of ordered calendars
var totalPrice = (amount*singlePrice); // calculation oft he total price with multiplier *
var invTotal = '$totalPrice $curr'; /* Merging of two variables in a new one by adding a $ sign before the old variables.*/
var result = '$amount $product\s'; //also plus adding a letter “s” for plural
print (invTotal); //creating the screen output
print (isFor);
print (result);
Apprendre à programmer avec DART : calcul simple
Exemple de calcul simple combiné avec des blocs de texte.

Avec les chaînes de caractères, les nombres à virgule flottante, les nombres entiers et les fusions d’éléments, de nouvelles variables sont introduites dans la programmation. Lors de la fusion de deux variables existantes en une nouvelle variable à afficher à l’écran, il convient de noter que les variables prédéfinies sont dans ce cas précédées par un signe dollar « $ » (ligne 8 et 9 dans la capture d’écran DartPad ci-dessus).

Définir des conditions

Les conditions jouent un rôle essentiel lors de la programmation. Découvrez comment programmer une condition avec DART. Une condition mène toujours à une décision : si (if) le cas A se produit, le signe X s’affiche à l’écran ; si le cas B se produit (elseif), le signe Y s’affiche ; quand aucun des deux ne se produit (else), le signe Z s’affiche. Le code suivant est généré grâce aux commandes DART entre parenthèses :

var tOol = 'Glove';
if (tOol == 'Pliers' || tOol == 'Ruler') 
    { print('That is a tool.');
    } else if (tOol == 'brush') 
    { print('That is a tool.');    
    } else { print('That is not a tool.');
    }
}

Dans DartPad :

Apprendre à programmer avec DART : utilisation de conditions
Les conditions définissent le résultat qui s’affiche.

Enrichissez vos connaissances acquises au cours du tutoriel DART et remplacez le mot « gant » dans le DartPad par « pince », « règle » ou « pinceau » et observez les changements dans l’affichage programmé sur la console. Cet exemple peut être modifié à volonté et appliqué à différents cas. L’opérateur « || » apparaît pour la première fois dans cet exemple. Cette double barre verticale remplace le connecteur logique « ou » qui n’est pas utilisé sous la forme « OR » dans DART.

Augmentations et diminutions

Pour programmer la section suivante, nous devons nous familiariser avec ce que l’on appelle les incréments et décréments dans DART. Il s’agit de l’augmentation ou de la diminution progressive d’une valeur de sortie. Dans cet exemple, le chiffre 50 est modifié grâce aux opérateurs « ++ » et « -- ».

var upAndDown = 50;
print (upAndDown);
print('----');
++upAndDown;
print (upAndDown);
print('----');
upAndDown++;
print (upAndDown);
print('----');
--upAndDown;
print (upAndDown);
print('----');
upAndDown--;
print (upAndDown);
Apprendre à programmer avec DART : augmentation et diminution d’une valeur
Le nombre 50 est augmenté et diminué à nouveau de manière définie.

Vous pouvez également voir qu’il est possible d’afficher une chaîne de caractères simple sans indiquer de définition préalable ; pour cela, il suffit de l’introduire dans le code entre parenthèses et entre guillemets précédé de la fonction « Print ». Dans le cas présent, la chaîne de caractères sert à structurer l’affichage du résultat. Avec ces connaissances, vous êtes prêt à programmer des boucles.

Programmer des boucles dans DART

Les boucles sont également des routines de programme importantes qui sont réutilisées continuellement, par exemple, pour effectuer des comparaisons avec les tailles existantes. C’est à cela que sert la « formulation » suivante : nous avons la valeur A, modifions cette valeur jusqu’à ce que la taille (l’état) B soit atteinte. Code en DART :

String myLabel = ' pieces';
var piece = 3;
while (piece < 12) {
var allThisStuff = '$piece $myLabel';
print(allThisStuff);
piece++;
    }

Que fait le DartPad avec ce code ?

Apprendre à programmer avec DART : boucles
Les boucles se répètent jusqu’à ce qu’une condition définie soit remplie.

Dans cet exemple, il est également possible d’utiliser à nouveau les conditions si, par exemple, les mots diffèrent au singulier et au pluriel :

int amount = 1;
var itemSing = 'blouse';
var itemPlural = 'blouses';
if (amount == 1) 
    { print(itemSing);
    } else { print(itemPlural);
    }

Pour apprendre à programmer avec DART, copiez les codes des exemples dans DartPad et modifiez la variable entière « quantité » afin que l’article « chemisier » soit affiché au singulier ou au pluriel.

Aperçu des opérateurs DART

Vous venez de vous familiariser avec quelques opérateurs pour la programmation avec DART. Dans le tableau ci-dessous, retrouvez les opérateurs importants à votre disposition pour la programmation avec DART.

Dans le tableau, la valeur « exemple » est définie sur 35.

var exemple = 35;
Type d’opération Description Symbole Exemple Résultat        
Calculer Addition + var exemple + 2; 37        
  Soustraction - var exemple - 2; 33        
  Multiplication * var exemple * 3; 105        
  Division / var exemple / 7; 5        
  Division de nombres entiers ~/ var exemple ~/ 7; 11        
  Augmentation de += var exemple += 6; 41        
  Réduction de -= var exemple -= 7; 28        
  Multiplication par *= var exemple *= 2; 70        
  Division par /= var exemple /= 7; 5        
                 
Comparer Identique == var exemple == 35; Vrai        
  Différent != var exemple != 44; Vrai        
  Plus petit que < var exemple < 44; Vrai        
  Plus petit ou égal à <= var exemple <= 33; Faux        
  Plus grand que > 44 > var exemple; Vrai        
  Plus grand ou égal à >= var exemple>=23; Faux        
                 
Modifier Augmentation ++ ++var exemple; 36        
  Augmentation ++ var exemple++; 36        
  Diminution -- --var exemple; 34        
  Diminution -- var exemple--; 34        
  Valeur résiduelle % %var exemple%3; 2        
                 
Logique ET && exemple1 && exemple2 … et        
  OU       exemple1   exemple2 … ou
  Négation ! exemple1 ! exemple2 ... n’est pas        
                 
Conditions Si-alors ? … : var y = exemple < 34 ? 15 : 10; 10        
  Si-alors ? … : var y = exemple < 36 ? 15 : 10; 15        
  Vérification si nul ?? var y = exemple ?? 9; 35        
  Vérification si nul ?? var z = 0 ?? exemple; 35        

Grâce à ces connaissances de base, vous allez pouvoir rapidement progresser avec DART et vous n’êtes plus très loin de pouvoir programmer votre propre application.

Cet article vous a-t-il été utile ?