Trucs JavaScript moins connus


Les crochets de construction sont facultatifs

const newDate = new Date(); // valid
const myClass = new MyClass(); // valid

const anotherDate = new Date; // Also valid
const myClass = new MyClass; // You bet this is valid

Le seul cas où vous auriez besoin de ces parenthèses est lorsqu’un constructeur attend des arguments.

Avec déclaration

🚨with n’est pas recommandée, et elle est interdite dans le mode strict de l’ES5.

with étend la chaîne du champ d’application d’une déclaration. with additionnera toutes les propriétés d’un object passé dans la chaîne de portée.

const person = {
    name: "Parwinder",
    age: 33,
    work: "Software Architect"
}

with (person) {
    console.log(`Hi, I am ${name}, and I am ${ age } years old. I work as a ${work}.`);
    // Hi, I am Parwinder, and I am 33 years old. I work as a Software Architect.
}

Arguments de fonction

Chaque fonction (sauf les fonctions de flèches) a une arguments objet de type tableau qui contient la valeur de tous les arguments passés à la fonction.

function foo(a, b, c) {
  console.log(arguments[0]); // 1
  console.log(arguments[1]); // 2
  console.log(arguments[2]); // 3
}

foo(1, 2, 3);

arguments ont deux propriétés :

  1. arguments.calleela fonction invoquée
  2. arguments.callee.callerla fonction qui a invoqué la fonction actuelle

🚨Just comme le with déclaration ci-dessus, callee et caller sont interdites en mode strict ES5.

Objet pur

Un objet pur n’a aucune fonction dans son prototype.

const x = {};

Cela permet de créer un objet, mais le prototype aura une constructor et des méthodes comme hasOwnProperty, isPrototypeOfet toString.

const x = Object.create(null);

create(null) génère un objet sans prototype ! 🤯

Suppression des doublons dans un tableau

const arr = [1, 1, 1, 1, 2, 3, 4, 5, 6, 7, 6, 6, 6, 7, 8, 9];
const arrWithoutDuplicates = [...new Set(arr)];
console.log(arrWithoutDuplicates); // [ 1, 2, 3, 4, 5, 6, 7, 8, 9 ]

La principale propriété d’un ensemble est d’avoir des valeurs uniques. Une fois que nous avons le Set d’un tableau, nous pouvons utiliser l’opérateur spread(…) pour le répartir dans un tableau vide.

Chaînage facultatif

Chaque fois que vous accédez à une propriété d’objet imbriqué où vous ne savez pas si le sous-objet existe ou non, vous finissez par le faire :

const nestedObject = {
    name: "Parwinder",
    details: {
        age: 33,
        cars: {
            first: "jeep",
            second: "tesla",
            accessories: {
                x: 200,
                y: 300
            }
        }
    }
}

if (nestedObject &&
    nestedObject.details &&
    nestedObject.details.cars &&
    nestedObject.details.cars.accessories) {
    console.log(nestedObject.details.cars.accessories.x); // 200
}

Le chaînage optionnel élimine l’encombrement. Avec le chaînage optionnel, vous pouvez le faire :

const nestedObject = {
    name: "Parwinder",
    details: {
        age: 33,
        cars: {
            first: "jeep",
            second: "tesla",
            accessories: {
                x: 200,
                y: 300
            }
        }
    }
}

console.log(nestedObject?.details?.cars?.accessories?.x); // 200

🚨 Le chaînage optionnel a atteint les spécifications ES2020/ES11 ! Consultez-les ici : https://tc39.es/ecma262/2020/

Soyez le premier à commenter

Poster un Commentaire

Votre adresse de messagerie ne sera pas publiée.


*