Si JavaScript est un passage par référence ou un passage par type de valeur

1. Les types de données primitifs en JavaScript sont transmis par valeur
2. Les valeurs non primitives en JavaScript sont transmises par référence
3. JavaScript est à la fois passe par valeur et passe par référence

Avant de nous demander si le langage de programmation JavaScript est un type de passage par référence ou non, voyons d’abord la différence entre le passage par valeur et le passage par référence.

Ces éléments entrent généralement en ligne de compte lorsque nous effectuons des opérations d’affectation ou traitons les fonctions elles-mêmes. Étant donné que la plupart du temps, nous effectuons des opérations d’affectation, créons diverses fonctions et transmettons plusieurs variables à ces fonctions, savoir comment ces choses fonctionnent en interne nous donnerait une meilleure compréhension du langage de programmation.

Chaque fois que nous attribuons ou passons la valeur d’une variable à une autre variable ou fonction, cela s’appelle passer par valeur. Lorsque nous attribuons ou passons l’adresse d’une variable à une autre variable ou fonction, cela s’appelle passer par référence.

Maintenant que nous avons vu la définition de base des types de passage par valeur et de passage par référence, comprenons mieux comment ils sont utilisés dans les exemples suivants ci-dessous.

Les types de données primitifs en JavaScript sont transmis par valeur

Notez qu’il existe deux types de types de données en JavaScript : le type de données primitif et le type de données non primitif. Les types de données primitifs se composent de nombres, de booléens, de chaînes, d’undefined et de null.

Ces types de données n’ont pas de méthodes prédéfinies comme nous en avons dans les objets ou les tableaux. Les types de données primitifs sont immuables ; cela signifie que chaque fois que vous stockez ou affectez la valeur d’une variable primitive à une autre et apportez des modifications à la valeur de la deuxième variable, la valeur de la première variable ne changera pas. Il restera tel quel jusqu’à ce que et à moins que vous ne changiez la valeur de cette variable elle-même. Ce n’est qu’alors que la deuxième variable sera modifiée.

Vous pouvez trouver plus d’informations sur les types de données primitifs sur MDN.

// Example 1
let a = 10;
let b = a;
b = b + 1;

console.log(a);
console.log(b);


// Example 2
let name = 'Google';

let greet =
    (val) => {
      val = 'Hi ' + name + '!';
      return val;
    }

             console.log(name);
console.log(greet(name));

Production:

10
11
Google
Hi Google!

Le code ci-dessus peut être mieux compris à l’aide de l’illustration ci-dessous. Notez qu’il n’explique que le premier exemple de code ; le deuxième exemple fonctionnera principalement de la même manière que celui de l’exemple un.

Dans notre premier exemple, nous avons deux variables : a et b. Nous avons attribué une valeur numérique de 10 à notre variable a ; cela allouera un espace pour la variable a dans la mémoire, représenté par la couleur jaune ayant une adresse 0x01 (qui est juste une adresse arbitraire prise pour cet exemple).

Ensuite, nous attribuons la variable a à la variable b. Ce processus allouera le nouvel espace mémoire pour la variable b. Ici, il stockera la valeur de la variable a, qui est 10.

D’après l’exemple ci-dessus, nous pouvons clairement voir que l’adresse des deux variables a et b est différente, ce qui signifie qu’elles ont des espaces mémoire différents. Ce résultat implique que chaque fois que vous changez ou modifiez la valeur de la variable b comme b = b + 1, la valeur à l’intérieur de la variable a ne sera pas modifiée. Seule la valeur de la variable b changera, et elle deviendra 11 puisque nous l’incrémentons de un.

Dans notre deuxième exemple, nous avons une variable name ayant une valeur Google à l’intérieur. Nous avons également une fonction appelée greet(), qui prend une valeur de chaîne comme argument et renvoie une nouvelle chaîne. En argument de cette fonction, on passe la variable a (notez que passer une variable revient à passer sa valeur et non son adresse). La valeur Google sera stockée dans la variable locale de la fonction nommée val.

Actuellement, la variable val contient la valeur Google. Dans la fonction, nous modifions cette valeur en Hi Google! puis en retournant cette valeur. Maintenant, si vous sortez à la fois la valeur des variables name et les fonctions, ainsi que la valeur renvoyée, elles seront toutes les deux différentes. Les variables name restent inchangées car les deux variables name et val sont stockées à des emplacements différents, et nous ne faisons que passer la valeur Google à la fonction et à l’adresse.

Auparavant, nous avons vu la définition du passage par valeur, qui disait qu’on ne passait la valeur de la variable que lors d’une affectation ou en la passant à une fonction. Les deux exemples ci-dessus l’ont démontré dans la pratique.

Les valeurs non primitives en JavaScript sont transmises par référence

Les types de données non primitifs se composent de tableaux, d’objets ou de classes. Ces types de données ont des fonctions intégrées prédéfinies qui nous permettent de manipuler les données à l’intérieur des tableaux ou des objets.

Les types de données primitifs sont modifiables ; cela signifie que les types de données qui peuvent être modifiés ultérieurement sont appelés mutables. De plus, les types de données non primitifs sont appelés par référence. Comprenons cela avec l’exemple ci-dessous.

let a = [1, 2];
let b = a;
b.push(3);

console.log(a)
console.log(b)

Production:

[ 1, 2, 3 ]
[ 1, 2, 3 ]

L’image de l’exemple ci-dessus est comme indiqué ci-dessous.

Dans cet exemple, nous avons créé un tableau a avec deux éléments : [1,2]. Puisqu’un tableau est un type de données non primitif, la variable a ne stockera pas tous les éléments du tableau. Au lieu de cela, les valeurs [1,2] seront stockées à un autre emplacement dans la mémoire. Dans ce cas, l’adresse de départ de ce tableau, dans ce cas, 0x01, sera stockée dans la variable a, comme indiqué dans le schéma ci-dessus. Étant donné que la variable a a l’adresse où les éléments du tableau réels sont stockés, elle pointera vers cet emplacement.

Lorsque nous affectons la variable a à la variable b, nous stockons l’adresse présente à l’intérieur de a dans la variable b. Désormais, la variable b pointera également vers le même emplacement mémoire, 0x011 que celui de la variable a, puisque les deux ont la même adresse mémoire. Ainsi, si vous modifiez les éléments d’un tableau pointé par b, alors a sera également affecté car les deux pointent vers le même emplacement.

Ici, nous introduisons un nouvel élément dans le tableau en utilisant la variable b telle que b.push(3). Maintenant, la variable b parcourra tout le tableau à partir du premier élément, 1, jusqu’au dernier élément, 2. Après le dernier élément, il insèrera le nouvel élément 3 dans le tableau. Si vous imprimez à la fois les variables a et b, vous verrez qu’elles afficheront toutes les deux la même valeur que [1,2,3] à cause du référencement.

C’est ce qu’on appelle le passage par référence car nous passons l’adresse mémoire elle-même et non la valeur.

JavaScript est à la fois passe par valeur et passe par référence

Le langage de programmation JavaScript prend en charge à la fois le passage par valeur et le passage par référence. Les valeurs primitives telles que les nombres, les valeurs booléennes, les chaînes, undefined et null sont toutes transmises par des valeurs. Les types non primitifs, tels que les tableaux, les objets et les classes, sont passés par référence.