JavaScript JavaScript (ou JS en abrégé) est un langage de programmation léger, interprété (ou compilé à la volée) avec des fonctions de première classe. S'il est surtout connu comme langage de script pour les pages web, de nombreux environnements hors navigateur l'utilisent aussi, comme Node.js, Apache CouchDB (angl.) ou Adobe Acrobat (angl.). JavaScript est un langage à prototype, à ramasse-miettes, dynamique, prenant en charge plusieurs paradigmes : impératif, fonctionnel et orienté objet. Les capacités dynamiques de JavaScript incluent la construction d'objets à l'exécution, les listes de paramètres variables, les fonctions comme variables, la création dynamique de scripts (via eval), l'introspection d'objets (via for...in et les utilitaires Object), et la récupération du code source (les fonctions JavaScript conservent leur texte source, accessible via toString()). Les standards de JavaScript sont la spécification ECMAScript (angl.)
JavaScript Tutorial Grunt: The JavaScript Task Runner Référence JavaScript Pour une liste alphabétique, voir le volet de navigation situé à gauche sur cette page. Expressions primaires Les mots-clés basiques et les expressions générales en JavaScript. this Le mot-clé this fait référence à une propriété spéciale du contexte d'exécution de la fonction. function Le mot-clé function définit une expression de fonction. class Le mot-clé class définit une expression de classe. function* Le mot-clé function* définit une expression pour une fonction génératrice. yield Cet opérateur permet de suspendre et de reprendre l'exécution d'une fonction génératrice. yield* Cet opérateur permet de déléguer l'exécution de la fonction à une autre fonction ou un autre objet itérable. async function* L'opérateur async function définit une expression de fonction asynchrone. await Cet opérateur permet de stopper et de reprendre l'exécution d'une fonction asynchrone et d'attendre pour la résolution ou le rejet d'une promesse. Littéral initialisateur de tableau. Littéral initialisateur d'objet. /ab+c/i new in
L'interactivité avec la balise HTML5 Canvas La balise <canvas> se comporte comme toute autre balise. Elle possède des attributs width, height et id. Le contenu de la balise correspond à un contenu alternatif pour les navigateurs ne la supportant pas. J'ai aussi défini une fonction à exécuter au chargement de la page et une balise <div> qui contiendra certaines informations, à savoir la quantité de mouvements effectués par l'élément. Le code JavaScript est un petit peu plus compliqué. var canvas, draw, width, height; var downcheck, upcheck, rightcheck, leftcheck; var up = 0;var down = 0;var left = 0;var right = 0; Ensuite, nous devrons créer une fonction init(), qui détermine ce qu'il faut faire au chargement de la page. function init() { canvas = document.getElementById('game'); height = canvas.height; width = canvas.width; draw = canvas.getContext('2d'); setInterval(redraw, 30); document.onkeydown = canvasMove; document.onkeyup = canvasStop; } Ensuite, nous devons ajouter une fonctionnalité pour déplacer le carré. Et voilà !
CoffeeScript JavaScript Éloquent : Une introduction moderne à la programmation Creating an HTML5 Canvas Painting Application Table of contents Introduction My previous HTML5 Canvas tutorial provided you with insight into the numerous use cases for Canvas in web applications. In this article we will explore how you can write your own Canvas-based painting application. Making a web application that allows users to draw on a Canvas requires several important steps: setting up your HTML document with a Canvas context (a <canvas> element with an id), setting up your script to target that Canvas context and draw inside it and adding the required mouse event handlers for user interaction and associated logic. Once the event handlers are in place, it’s then fairly simple to add any desired functionality. The final painting application example looks like this: To make it easier to follow along with the code walkthrough presented below, you can download the full code example and follow along with it as you read the article. Getting started with the HTML We shall begin with a minimal HTML document: Canvas interaction Rectangle
total.js - Web application framework for node.js