Fonctionnement des méthodes de type intégré (Built-In Type Methods) en javaScript

Lorsqu’on utilise les méthodes de type intégré comme dans l’exemple suivant :

str = "Hello world!"

console.log(str.toUpperCase()); // HELLO WORLD!

On se rend compte qu’on appelle une méthode sur une variable de type string or on appelle une méthode uniquement sur un objet.

Pour que cela fonctionne javascript va effectuer une coercition implicite et remplacer “str” par un objet qu’on appelle “objet d’emballage” (wrapper object en anglais) et qui sera l’instance d’un objet String.

Cette objet contiendra toute les méthodes de type intégré.

Une fois l’appelle de la méthode de type intégré effectué, “l’objet d’emballage new String()” est détruit.

Comme le prouve l’exemple ci-dessous :

var str = 'Hello world!';
str.firstName = "John";
console.log(str.firstName); // undefined

Les accesseurs de propriétés en javascript

Il y a deux manière d’accéder aux propriétés d’un objet en javascript :

  • La notation par point :
const user = {
  firstName: "John",
  lastName: "Doe"
};

console.log(user.firstName); // "John"
  • La notation avec crochets
const user = {
  firstName: "John",
  lastName: "Doe"
};

console.log(user["firstName"]); // "John"

La notation par point est la plus souvent utilisée car plus courte et plus facile à lire.

Il existe cependant deux cas de figure ou la notation avec crochets est indispensable :

  • Lorsque le nom de la propriété contient un caractère spécial :
const user = {
  "first-name": "John", // ici le caractère spécial est le tiret
  lastName: "Doe"
};

console.log(user["first-name"]); // John

console.log(user.first-name); // NaN
  • Lorsque l’on veut accéder à la valeur d’une propriété mais que le nom de cette propriété est stocké dans une variable.
const user = {
  firstName: "John",
  lastName: "Doe"
};

let userInfo = "firstName";

console.log(user[userInfo]); // "John"

let userInfo = "lastName";

console.log(user[userInfo]); // "Doe"

La notation par crochets est plus de flexible car la valeur à l’intérieur des crochets peut être une chaîne de caractère ou bien une variable.

On préférera quand même la notation par point lorsque c’est possible pour les raisons évoquées plus haut.

Les propriétés calculées en javascript

Le nom de la propriété d’un objet peu s’écrire de trois manières différentes :

  • Avec des guillemets :
const user = {
  "firstName": "John"
};

console.log(user); // { firstName: "John" }
  • Sans guillemets :
const user = {
  firstName: "John"
};

console.log(user); // { firstName: "John" }
  • Avec des crochets
const userInfo = "First name";

const user = {
  [userInfo]: "John"
};

console.log(user); // { First name: "John" }

Cette dernière façon correspond à un nom de propriété dit calculée car le nom de cette propriété correspond à une variables qui peut contenir une valeur de n’importe quel type (chaîne de caractère, nombre, fonction, etc…)

Voici un exemple de propriété calculée avec une fonction :

const userInfo = (firstName) => {
    return firstName;
};

const user = {
    [userInfo("John")]: "Doe"
}

console.log(user); // { John: 'Doe' }