Principes fondamentaux de JavaScript

JavaScript est un langage de programmation qui vous permet d’ajouter de la logique et de l’interactivité à vos documents PDF. Cet article se concentre sur les fonctionnalités linguistiques core dont vous aurez besoin pour l’écriture de scripts efficaces dans Revu. Considérez JavaScript comme un ensemble d’instructions qui indiquent à Revu ce qu’il doit faire, qu’il s’agisse de calculer les valeurs des champs de formulaire, de valider les entrées de l’utilisateur ou de répondre aux clics sur un bouton.

Pour en savoir plus sur JavaScript, consultez JavaScript Revu.

Comments

Avant de nous plonger dans le code, commençons par les commentaires. Les commentaires sont des remarques que vous rédigez pour vous-même ou pour d’autres développeurs et que JavaScript ignore lors de l’exécution. Ils sont essentiels pour documenter ce que fait votre code.

copy

// This is a single-line comment

/* 
   This is a multi-line comment
   that can span several lines.
   Use it for longer explanations.
*/

Variables et types de données

Les variables sont des conteneurs qui stockent des valeurs que vous pouvez utiliser dans tout votre script. En JavaScript, les variables sont déclarées à l’aide de var:

copy

var userName = "John Doe"
var pageCount = 10
var isComplete = false

JavaScript a plusieurs types de données fondamentaux :

Chaînes

Les chaînes représentent du texte et sont entourées de guillemets doubles ou simples :

copy

var firstName = "Jane"
var lastName = 'Smith'
var fullName = firstName + " " + lastName  // Results in "Jane Smith"

Opérations courantes sur les chaînes :

copy

var text = "Hello World"
var length = text.length           // 11
var upper = text.toUpperCase()     // "HELLO WORLD"
var lower = text.toLowerCase()     // "hello world"
var partial = text.substring(0, 5) // "Hello"

Numéros

Les nombres en JavaScript peuvent être des entiers ou des nombres décimaux :

copy

var quantity = 42
var price = 19.99
var total = quantity * price  // 839.58

Opérations courantes sur les nombres :

copy

var x = 10
var y = 3
var sum = x + y         // 13
var difference = x - y  // 7
var product = x * y     // 30
var quotient = x / y    // 3.333...
var remainder = x % y   // 1 (modulo operation)

JavaScript fournit l’objet Math pour des opérations plus complexes :

copy

var rounded = Math.round(3.7)    // 4
var floored = Math.floor(3.7)    // 3
var ceiling = Math.ceil(3.2)     // 4
var absolute = Math.abs(-5)      // 5
var power = Math.pow(2, 3)       // 8
var squareRoot = Math.sqrt(16)   // 4

Booléennes

Les booléennes représentent des valeurs true ou false :

copy

var isEnabled = true
var isVisible = false
var isGreater = 10 > 5  // true

Séries

Les séries stockent des listes ordonnées de valeurs :

copy

var colors = ["red", "green", "blue"]
var firstColor = colors[0]     // "red"
var arrayLength = colors.length // 3

// Adding elements
colors.push("yellow")           // Adds to end
colors.unshift("purple")        // Adds to beginning

// Removing elements
var lastItem = colors.pop()     // Removes and returns last item
var firstItem = colors.shift()  // Removes and returns first item

Objets

Les objets stockent des collections de paires clé-valeur :

copy

var person = {
    name: "Alice",
    age: 30,
    email: "alice@example.com"
}

var personName = person.name    // "Alice"
person.age = 31                 // Updates age
person.city = "Seattle"         // Adds new property

Null et undefined

Ces valeurs spéciales représentent l’absence d'une valeur :

copy

var emptyValue = null      // Explicitly empty
var notYetDefined          // undefined (declared but not assigned)

Opérateurs

Opérateurs de comparaison

Utilisé pour comparer des valeurs et renvoyer des résultats booléens :

copy

var a = 5
var b = 10

a == b   // false (equal to)
a != b   // true (not equal to)
a < b    // true (less than)
a > b    // false (greater than)
a <= b   // true (less than or equal to)
a >= b   // false (greater than or equal to)

Remarquez la différence entre == et === :

copy

5 == "5"   // true (loose equality, converts types)
5 === "5"  // false (strict equality, checks type and value)

Opérateurs logiques

Utilisé pour combiner ou modifier des valeurs booléennes :

copy

var x = true
var y = false

x && y   // false (AND - both must be true)
x || y   // true (OR - at least one must be true)
!x       // false (NOT - inverts the value)

Flux de contrôle

Instructions conditionnelles

Exécutez le code en fonction des conditions :

copy

var score = 85

if (score >= 90) {
    console.println("Excellent!")
} else if (score >= 70) {
    console.println("Good job!")
} else {
    console.println("Keep practicing")
}

Instructions switch

Utile pour comparer une valeur unique à plusieurs cas :

copy

var day = "Monday"

switch (day) {
    case "Monday":
    case "Tuesday":
    case "Wednesday":
    case "Thursday":
    case "Friday":
        console.println("Weekday")
        break
    case "Saturday":
    case "Sunday":
        console.println("Weekend")
        break
    default:
        console.println("Invalid day")
}

Boucles For

Répéte le code un nombre spécifique de fois :

copy

// Count from 0 to 4
for (var i = 0; i < 5; i++) {
    console.println("Count: " + i)
}

// Loop through an array
var items = ["apple", "banana", "orange"]
for (var j = 0; j < items.length; j++) {
    console.println(items[j])
}

Boucles While

Répète le code tant qu’une condition est vraie :

copy

var counter = 0
while (counter < 3) {
    console.println("Counter: " + counter)
    counter++
}

Break et Continue

Exécution de la boucle de contrôle :

copy

// Break exits the loop entirely
for (var i = 0; i < 10; i++) {
    if (i === 5) {
        break  // Stops at 5
    }
    console.println(i)
}

// Continue skips to the next iteration
for (var j = 0; j < 5; j++) {
    if (j === 2) {
        continue  // Skips 2
    }
    console.println(j)  // Prints 0, 1, 3, 4
}

Fonctions

Les fonctions sont des blocs de code réutilisables qui exécutent des tâches spécifiques :

copy

// Function declaration
function calculateArea(width, height) {
    return width * height
}

// Using the function
var area = calculateArea(10, 5)  // 50

Les fonctions peuvent également être attribuées à des variables :

copy

var multiply = function(a, b) {
    return a * b
}

var result = multiply(3, 4)  // 12

Les fonctions n’ont pas toujours besoin de renvoyer des valeurs :

copy

function displayMessage(message) {
    console.println("Message: " + message)
    // No return statement
}

displayMessage("Hello")  // Prints but returns undefined

Conversion de type

JavaScript convertit automatiquement les types dans certaines situations, mais vous pouvez aussi les convertir explicitement :

copy

// String to Number
var str = "42"
var num = Number(str)        // 42
var num2 = parseInt(str)     // 42
var float = parseFloat("3.14") // 3.14

// Number to String
var n = 100
var s = String(n)            // "100"
var s2 = n.toString()        // "100"

// To Boolean
var b1 = Boolean(1)          // true
var b2 = Boolean(0)          // false
var b3 = Boolean("text")     // true
var b4 = Boolean("")         // false

Gestion des erreurs

Protégez votre code des erreurs en utilisant des blocs try-catch :

copy

try {
    // Code that might cause an error
    var result = riskyOperation()
} catch (e) {
    // Handle the error
    console.println("An error occurred: " + e.message)
}

Portée

Les variables ont une portée, qui détermine où elles peuvent être accessibles :

copy

var globalVar = "I'm global"  // Available everywhere

function myFunction() {
    var localVar = "I'm local"  // Only available in this function
    console.println(globalVar)  // Can access global
    console.println(localVar)   // Can access local
}

myFunction()
// console.println(localVar)  // Would cause an error - not accessible here

Bonnes pratiques

Lorsque vous commencez à écrire du code JavaScript pour vos PDF, gardez à l’esprit les directives suivantes :

Utilisez des noms de variables significatifs : au lieu de var t = 10, utilisez var pageWidth = 10.
Initialisez les variables : Donnez toujours une valeur initiale aux variables lorsque c’est possible.
Soyez cohérent avec les guillemets : choisissez des guillemets simples ou doubles pour les chaînes et respectez votre choix.
Gérez les cas limites : considérez ce qui se passe si une variable est nulle ou non définie.
Gardez les fonctions ciblées : chaque fonction doit exceller dans une tâche.
Commentaire logique complexe : si ce n'est pas évident, ajoutez un commentaire.
Testez de manière incrémentielle : testez votre code au fur et à mesure que vous l’écrivez, n’attendez pas que tout soit terminé.

Pièges fréquents

Attention à ces erreurs fréquentes :

copy

// Forgetting var creates a global variable (avoid this)
myVariable = 10  // Bad
var myVariable = 10  // Good

// Comparing with = instead of ==
if (x = 5) {  // This assigns 5 to x
    // Wrong!
}
if (x == 5) {  // This compares x to 5
    // Correct
}

// Forgetting that arrays start at 0
var items = ["first", "second", "third"]
var lastItem = items[3]  // undefined - should be items[2]

Perspectives

Cet article a couvert les éléments fondamentaux de JavaScript. Vous savez maintenant comment travailler avec différents types de données, contrôler le flux du programme et créer des fonctions réutilisables. Ces concepts constituent la base de tout ce que vous ferez avec JavaScript dans Revu.

Consultez les spécificités du PDF pour explorer où et comment vous pouvez utiliser ces fondamentaux JavaScript dans vos documents PDF, en examinant les différents contextes où Revu exécute du code JavaScript.

Ressources

Revu 21

JavaScript Revu

JavaScript

Apprenez à maîtriser les principales fonctionnalités du langage JavaScript dont vous aurez besoin pour écrire des scripts efficaces dans Rev