in

4 opérateurs JavaScript que vous ne connaissez pas

Les API de JavaScript sont largement documentés sur MDN. Cependant, il existe dans ces API des fonctionnalité très peu connue ou très peu utilisé. Donc voici une courte liste de ces API, utiles ou non – l’apprentissage de JavaScript ne semble jamais se terminer.

Labeled statement (Instruction étiquetée)

Vous pouvez utiliser une étiquette pour identifier une boucle ou un bloc d’instruction en Javascript, puis utiliser les instructions break  ou continue  pour indiquer si un programme doit interrompre la boucle ou poursuivre son exécution.

loop1: // labeling "loop1" 
for (let i = 0; i < 3; i++) { // "loop1"
   loop2: // labeling "loop2"
   for (let j = 0; j < 3; j++) { // "loop2"
      if (i === 1) {
         continue loop1; // continues upper "loop1"
         // break loop1; // breaks out of upper "loop1"
      }
      console.log(`i = ${i}, j = ${j}`);
   }
}

/* 
 * # Output
 * i = 0, j = 0
 * i = 0, j = 1
 * i = 0, j = 2
 * i = 2, j = 0
 * i = 2, j = 1
 * i = 2, j = 2
 */

Vous pouvez utiliser des étiquettes dans les blocs d’instruction simples, mais seules les instructions break  peuvent utiliser des étiquettes sans boucle.

foo: {
  console.log('one');
  break foo;
  console.log('this log will not be executed');
}
console.log('two');

/*
 * # Output
 * one
 * two
 */

L’ opérateur void

Cet opérateur permet d’évaluer les expressions qui produisent une valeur dans les endroits où une expression qui évalue undefined  est souhaitée. L’opérateur void  est souvent utilisé simplement pour obtenir la valeur primitive undefined , en utilisant habituellement void(0)  (qui est équivalent à  void 0 ). Dans ce cas, la variable globale undefined  peut être utilisée à la place (en supposant qu’elle n’a pas été affectée à une valeur autre que la valeur par défaut). Cet opérateur a été dans Javascript  depuis 1996.

Cela vous permet d’écrire comme ceci:

void function test() {
	console.log('hello');
}();

// is the same as...

(function test() {
    console.log('hello');
})()

L’évaluation de l’expression est toujours la variable globale undefined en supposant qu’elle n’a pas été affectée à une valeur autre que la valeur par défaut.

const word = void function iife() {
	return 'hello';
}();

// word is "undefined"

const word = (function iife() {
	return 'hello';
})();

// word is "hello"

Vous pouvez également utiliser void  avec async, vous pouvez alors l’utiliser comme un point d’entrée asynchrone à votre code:

void async function() { 
    try {
        const response = await fetch('geek.mg'); 
        const text = await response.text();
        console.log(text);
    } catch(e) {
        console.error(e);
    }
}()

// or just stick to this :)

(async () => {
    try {
        const response = await fetch('air.ghost.io'); 
        const text = await response.text();
        console.log(text);
    } catch(e) {
        console.error(e);
    }
})();

Opérateur de virgule (comma operator)

Vous pouvez utiliser l’opérateur de virgule lorsque vous souhaitez inclure plusieurs expressions dans un emplacement qui nécessite une seule expression. L’utilisation la plus courante de cet opérateur est de fournir plusieurs paramètres dans une boucle for .

function myFunc() {
  let x = 0;
  return (x += 1, x); // same as return ++x;
}

y = false, true; // returns true in console
console.log(y); // false (left-most)

z = (false, true); // returns true in console
console.log(z); // true (right-most)

On peut aussi utiliser l’opérateur virgule avec les conditions. La dernière valeur dans l’opérateur virgule devient la valeur de retour pour la condition. Vous pouvez donc placer n’importe quel nombre d’expressions avant comme dans l’exemple ci-dessous

const type = 'man';

const isMale = type === 'man' ? (
    console.log('Hi Man!'),
    true
) : (
    console.log('Hi Lady!'),
    false
);

console.log(`isMale is "${isMale}"`);

Pipeline

const square = (n) => n * n;
const increment = (n) => n + 1;

// without pipeline operator
square(increment(square(2))); // 25

// with pipeline operator
2 |> square |> increment |> square; // 25

Nous espérons que vous avez découvert quelques nouvels aspects de JavaScript.

What do you think?

23 points
Upvote Downvote

commentaires

Laisser un commentaire

Laisser un commentaire

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.

Chargement & hellip;

Défi Boys Vs Girls : le retour !

Le cryptojacking avec JavaScript