(! [] + []) [+ []]… Expliquez pourquoi cela fonctionne

alert((![]+[])[+[]]+(![]+[])[+!+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]);

La sortie de ce code est: fail. Pourquoi?

Au fait (![]+[])[+!+[]] == 'false'[1], non ?. Mais pourquoi ![]+[] == "false"et pourquoi +!+[] == 1?

Comme @Mauricio l'a commenté (![]+[])[+[]]est "f" (le premier caractère de "faux"), (![]+[])[+!+[]])est "a", etc ...

Comment ça marche?

Examinons le premier caractère, 'f':

(![]+[])[+[]]; // 'f'

La première partie de l'expression - entre parenthèses - est composée par ![]+[], le premier opérande de l'opérateur Addition est ![]et il produira false, car un objet tableau - comme toute autre instance d'Objet - est véridique , et en appliquant la logique (!) PAS unaire opérateur, il produit la valeur false, par exemple.

![]; // false, it was truthy
!{}; // false, it was truthy
!0;  // true, it was falsey
!NaN;  // true, it was falsey

Après cela, nous avons le deuxième opérande de l'addition, un tableau vide [], ceci est fait juste pour convertir la falsevaleur en String, car la représentation sous forme de chaîne d'un tableau vide est juste une chaîne vide, équivaut à:

false+[]; // "false"
false+''; // "false"

La dernière partie, la paire de crochets après les parenthèses, ils sont l'accesseur de propriété et ils reçoivent une expression, qui est formée par l'opérateur unaire plus appliqué à nouveau à un tableau vide.

Ce que fait l'opérateur Unary Plus, c'est la conversion de type Number, par exemple:

typeof +"20"; // "number"

Une fois de plus, cela est appliqué à un tableau vide, et comme je l'ai déjà dit, la représentation String d'un tableau est une chaîne vide, et lorsque vous convertissez une chaîne vide en nombre, elle est convertie en zéro:

+[]; // 0, because
+[].toString(); // 0, because
+""; // 0

Par conséquent, nous pouvons "décoder" l'expression en quelques étapes:

(![]+[])[+[]];
(false+[])[+[]];
(false+'')[+[]];
(false+'')[0];
('false')[0];  // "f"

Notez que l'accès aux caractères en utilisant la notation entre crochets sur les valeurs String ne faisait pas partie de ECMAScript 3rd. Spécification d'édition, (c'est pourquoi la charAtméthode existait).

Cependant ce type de "propriétés d'index" qui représentent les caractères d'une chaîne était standardisé sur ECMAScript 5, et avant même la standardisation, la fonctionnalité était disponible dans un bon nombre de navigateurs (même dans IE8 (mode standard)).