Full Circle Magazine FR

Outils pour utilisateurs

Outils du site

Piste : • python • arduino • arduino • arduino • tuto-python • python • javascript • tuto_python • python • tuto_python
issue97:javascript

Différences

Ci-dessous, les différences entre deux révisions de la page.

Lien vers cette vue comparative

Les deux révisions précédentesRévision précédente
Prochaine révision		Révision précédente
issue97:javascript [2015/06/17 18:04] – [2] fredphil91issue97:javascript [2015/06/20 21:22] (Version actuelle) – [encadré page 21] fcm_-_ekel
Ligne 14: Ligne 14:
 In the first case, the myName stores a string value; in the second case it should store an integer, 123, but JavaScript has a special type, Number (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number) to hold numerical values.** In the first case, the myName stores a string value; in the second case it should store an integer, 123, but JavaScript has a special type, Number (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number) to hold numerical values.**
  
-Dans la première partie, je vous ai montré comment JavaScript a évolué au fil des ans, l'état actuel du langage, et pourquoi il est si largement adopté par les développeurs. Dans cette partie, je vais me concentrer sur les Objets et les fonctions JavaScript. J'ai reçu un courriel de Ray (un de nos lecteurs, merci de m'avoir contacté) avec quelques questions, j'aborderai celles-ci à la fin de l'article dans la section Questions et Solutions.+Dans la première partie, je vous ai montré comment JavaScript a évolué au fil des ans, l'état actuel du langage, et pourquoi il est si largement adopté par les développeurs. Dans cette partie, je vais me concentrer sur les Objets et les fonctions JavaScript. J'ai reçu un courriel de Ray (un de nos lecteurs, merci de m'avoir contacté) avec quelques questions et j'aborderai celles-ci à la fin de l'article dans la section Questions et Solutions.
  
 Les Objets JavaScript Les Objets JavaScript
  
-En JavaScript, tout est un objet, même les fonctions sont des objets, ce qui, si vous êtes familier avec d'autres langages de programmation, peut sembler un peu étrange. Mais, ne vous inquiétez pas, cela donne un réel pouvoir à JavaScript.+En JavaScript, tout est un objet, même les fonctions sont des objets, ce qui, si vous avez l'habitude d'autres langages de programmation, peut sembler un peu étrange. Mais, ne vous inquiétez pas, cela donne un réel pouvoir à JavaScript.
  
-JavaScript est un langage de programmation dynamique, ce qui signifie que les objets peuvent avoir différentes valeurs attribuées lors de l'exécution, sans aucun problème. Par exemple :+JavaScript est un langage de programmation dynamique, ce qui signifie que, sans aucun problème, les objets peuvent avoir différentes valeurs attribuées lors de l'exécution. Par exemple :
  
 var monNom = "Greg"; var monNom = "Greg";
Ligne 73: Ligne 73:
  
 As an exercise, you can create other objects which simulate real life objects, like a forest which has a function called plantTrees, and receives a parameter nrOfTrees, and it sums up the number of trees in the forest. Or it may store the different types of animals which live in the forest; the topic does not really matter, the idea is to get you familiarized with object notation and function creation, we will use this a lot.** As an exercise, you can create other objects which simulate real life objects, like a forest which has a function called plantTrees, and receives a parameter nrOfTrees, and it sums up the number of trees in the forest. Or it may store the different types of animals which live in the forest; the topic does not really matter, the idea is to get you familiarized with object notation and function creation, we will use this a lot.**
 +
 +Comme vous pouvez le voir, il y a trois façons de créer des objets personnalisés :
 +• La première, appelée aussi JSON (JavaScript Object Notation), définit des objets en utilisant les accolades et spécifie les propriétés et leurs valeurs séparées par deux points.
 +• La deuxième option est d'utiliser l'opérateur . (point) et d'écrire le nom de la nouvelle propriété et lui attribuer une valeur.
 +• La troisième option consiste à utiliser l'opérateur index [], qui reçoit une chaîne comme paramètre et une valeur à attribuer. Si vous connaissez d'autres langages de programmation, vous pouvez imaginer les objets JavaScript comme des sortes de dictionnaires spéciaux ou des « maps ».
 +
 +Les fonctions peuvent ou avoir des valeurs de retour ou pas. Dans le cas de la fonction isBiggerThan(), je n'ai pas spécifié de type de retour, ni qu'elle aura une valeur de retour, mais je pourrais facilement retourner une valeur booléenne (vrai ou faux) ; JavaScript le permet.
 +
 +Comme exercice, vous pouvez créer d'autres objets qui simulent des objets de la vie réelle, comme une forêt qui a une fonction appelée planterArbres, qui reçoit un paramètre nbDArbres, et résume le nombre d'arbres dans la forêt. Ou elle peut stocker les différents types d'animaux qui vivent dans la forêt ; le sujet n'a pas vraiment d'importance, l'idée est de vous familiariser avec la notation objet et la création de fonction, que nous utiliserons beaucoup.
  
 ====== 4 ====== ====== 4 ======
Ligne 84: Ligne 93:
  
 The second scenario is when the SQLite database is available only on the web server and the client is accessing the web server through the Internet. In this case, you need to have a server-side component (this can be node.js based) which reads the SQLite database, and, using HTTP requests, sends the data back to the client’s browser. In this case, the client side JavaScript is more complex, because it needs to use AJAX calls to load the data. Here is a sample node.js code which connects to a SQLite database, creates a new table if it does not exist, and inserts two new entries in the table. After the insert it queries the table and writes the data to the console.** The second scenario is when the SQLite database is available only on the web server and the client is accessing the web server through the Internet. In this case, you need to have a server-side component (this can be node.js based) which reads the SQLite database, and, using HTTP requests, sends the data back to the client’s browser. In this case, the client side JavaScript is more complex, because it needs to use AJAX calls to load the data. Here is a sample node.js code which connects to a SQLite database, creates a new table if it does not exist, and inserts two new entries in the table. After the insert it queries the table and writes the data to the console.**
 +
 +Questions et solutions
 +
 +Question : Ray a demandé comment on peut sélectionner certaines informations à partir d'un fichier, en particulier une base de données SQLite, en utilisant JavaScript.
 +
 +Solution : Il y a deux approches, deux scénarios. Le premier est lorsque la base de données SQLite est disponible sur la machine cliente, là où le navigateur s'exécute. Dans ce cas, vous pouvez utiliser la bibliothèque SQL.js (https://github.com/kripken/sql.js/) pour charger les fichiers SQLite. Et vous pouvez même faire des requêtes et créer des schémas de données à l'aide de JavaScript. La page sur GitHub a de bons exemples de code ; vous pouvez commencer à utiliser ceux-ci pour le chargement de votre base de données et l'interrogation des données.
 +
 +Le deuxième scénario est lorsque la base de données SQLite est uniquement disponible sur le serveur Web et que le client y accède par Internet. Dans ce cas, vous devez avoir un composant côté serveur (qui peut être basé sur node.js) qui lit la base de données SQLite, et, en utilisant des requêtes HTTP, envoie les données au navigateur du client. Dans ce cas, le Javascript côté client est plus complexe, car il a besoin d'utiliser les appels AJAX pour charger les données. Voici un exemple de code node.js qui se connecte à une base de données SQLite, crée une nouvelle table si elle existe pas, et insère deux nouvelles entrées dans le tableau. Après l'insertion, il interroge la table et écrit les données sur la console.
  
 ====== 5 ====== ====== 5 ======
Ligne 102: Ligne 119:
  
 I would be happy to hear from you; what are the topics in JavaScript which you would be interested in. Please feel free and email me your topic ideas, the same way as Ray did. Thanks again, Ray!** I would be happy to hear from you; what are the topics in JavaScript which you would be interested in. Please feel free and email me your topic ideas, the same way as Ray did. Thanks again, Ray!**
 +
 +Pour exécuter le code de la page précédente, il vous faudra installer node.js (https://nodejs.org/) et npm, ainsi que sqlite3 au travers de npm en utilisant cette commande :
 +
 +npm install sqlite3 -save
 +
 +Quand tout est en place, vous pouvez exécuter le programme en utilisant :
 +
 +node sqlite_reader.js
 +
 +En supposant que vous avez nommé votre fichier sqlite_reader.js.
 +
 +La sortie devrait ressembler à celle représentée ci-dessus dans la ligne de commande (je l'exécutais sous Windows, mais la sortie est la même sous Linux, puisque node.js fonctionne de la même manière dans les deux environnements).
 +
 +Dans les prochains articles, je vous dirai comment créer un nouveau serveur HTTP à l'aide de node et comment transférer des données depuis le côté serveur vers le côté client - le tout en utilisant JavaScript.
 +
 +Je serais heureux de vous entendre ; dites-moi quels sont les sujets qui vous intéresseraient autour de JavaScript. Sentez-vous libres de m'envoyer vos idées de sujet, comme Ray l'a fait. Merci encore, Ray !
 +
 +====== encadré page 21 ======
 +
 +Regardons le code ci-dessous :
 +maMaison.getInformation = function() {
 +     console.log("La maison fait " + this.taille + " m2
 +et a " + this.nbDePieces + " pieces.");
 +}
 +
 +Si vous appelez cette fonction ainsi :
 +maMaison.getInformation();
 +cela affichera : La maison fait 100 m2 et a 3 pieces.
 +
 +Les fonctions peuvent avoir des paramètres:
 +maMaison.estPlusGrandeQue = function(autreMaison) {
 +     return this.taille > autreMaison.taille;
 +}
 +
 +Nous pouvons appeler la fonction :
 +maMaison.estPlusGrandeQue({taille:98});
 +ou
 +maMaison.estPlusGrandeQue({taille:198});
 +
 +Dans le premier cas, cela retourne vrai et dans le second faux.
 +Remarquez que j'ai passé un simple objet avec une propriété, taille,
 +et le code a pu s'exécuter correctement, mais j'aurais pu aussi écrire :
 +maMaison.estPlusGrandeQue({taille:198, nbDePieces:5, prix:8500,
 +devise:"EUR"})
 +ou
 +var maisonDeMonAmi = {taille:198, nbDePieces:5, prix:8500,
 +devise:"EUR"};
 +maMaison.estPlusGrandeQue(maisonDeMonAmi);
 +Le résultat sera le même.
 +
 +====== commentaires de l'encadré page 22 (ne pas mettre d'accents sinon problèmes de compilation Python) ======
 +
 +create the db instance : ouvrir la base de donnees
 +
 +create the table if the database file was missing : creer la table si le fichier est absent
 +
 +create a parameterized, prepared statement : creer une requete preparee, parametree
 +
 +run the statement twice : executer deux fois la requete
 +each ? in the statement is substituted with the parameter : chaque ? dans la requete est remplace par un parametre
 +
 +close the statement : fermer la requete
 +
 +query the database and log the result to the console : requeter la base et afficher le resultat sur la console
  
issue97/javascript.1434557096.txt.gz · Dernière modification : 2015/06/17 18:04 de fredphil91