JavaScript 中的 ~[] 结构如何工作？

Question

我遇到了一段无法解释的有效 JavaScript 代码。 例如：

• +[]===0
• -[]===0
• ~[]==-1
• ~ -~[]==-2
• ~-~-~-~-~[]==-5
• ~-~-~-~-~[] +~[]==-6
• ~+~[]===0
• ~+~+~[]===-1
• ~+~+~+~[]===0

你能解释一下这些表达式的逻辑吗？

Answer 1

[] 是一个空数组对象，所以：

+[]：强制空数组为正整数，又名 0，即 === 到 0
-[]：强制空数组为负整数，即0，即 === 到 0
~[]: 按位非空数组，计算结果为 -1，即 === 到 -1
~-~[]: 取反的 NOTted 空数组的按位 NOT: ~-(-1) -> 〜1 - > -2

等等...

Answer 2

当您对任何内容使用 + 或 - 运算符时，它会对其调用 Number 。 Number([]) 返回 0，因此您可以获得前两个答案。

~ 运算符是按位 NOT。基本上，它反转数字中的所有位，将 0 更改为 -1。有关按位运算符的更多信息，请此处。

其余的只是这些情况的组合。你几乎可以将这些东西结合起来得到你想要的任何数字。

Answer 3

我不会只是重述您在问题中演示的结果，而是尝试描述您为什么会得到该结果。

解释

仅以第一个示例为例（因为其余示例也会做类似的事情），我们可以按照规范来看看会发生什么。

从 11.4.6 Unary + Operator 中，我们可以看到一个 ToNumber 发生转换。

返回ToNumber(GetValue(expr))。

从 9.3 ToNumber 中我们看到，如果给定一个对象（比如你的数组），一个 发生 ToPrimitive 转换，然后再次尝试 ToNumber。

对象

应用以下步骤：

1. 设 primValue 为 ToPrimitive（输入参数，提示编号）。
2. 返回ToNumber(primValue)。

从 9.1 到 Primitive，如果 ToPrimitive 得到一个 Object，我们可以看到它的 [[DefaultValue]] 已被获取：

对象

返回对象的默认值。对象的默认值是通过调用对象的 [[DefaultValue]] 内部方法并传递可选提示 PreferredType 来检索的。本规范为 8.12.8 中的所有本机 ECMAScript 对象定义了 [[DefaultValue]] 内部方法的行为。

从8.12.8 [[DefaultValue]]（提示）开始，最终会发生的是toString() 将在数组上调用并返回。如上所述，该字符串被发送到递归 ToNumber。

那么当对字符串进行 ToNumber 转换时会发生什么？嗯，它在9.3.1 ToNumber Applied to the String Type中进行了描述，并且有点长。更简单的是直接进行转换，然后看看会发生什么：

Number("");     // result is 0 on an empty string
Number("    "); // result is 0 on a string with only whitespace
Number("123");  // result is 123 on a numeric string
Number(" 123 ");// result is 123 on a numeric string with leading & trailing spaces
Number("abc");  // result is NaN (not a number) on non-numeric strings

所以问题是，我们从数组中返回什么字符串。同样，这很容易测试。

[].toString();  // result is "" (empty string)

由于结果是一个空字符串，并且空字符串的 ToNumber 转换为 0 （如上所示），这意味着我们正在比较 0 === 0。

这将与我们所做的相同：

Number( [].toString() ) === 0; // true

或者将其绘制得更多一些：

var x = [];
x = x.toString();  // ""
x = Number( x );   // 0
x === 0;  // true

---

更多 toString 结果。

显示更多 toString 转换对于数组，请考虑以下事项：

[1].toString();            // "1"
[1,2,3].toString();        // "1,2,3"
["a",1,"b",2].toString();  // "a,1,b,2"

因此，要对上述数组进行 ToNumber 转换，第一个将为我们提供一个数字，最后两个将导致 NaN。

Number([1]);            // 1
Number([1,2,3]);        // NaN
Number(["a",1,"b",2]);  // NaN

---

一些证明

为了进一步证明此 toString() 转换发生在 ToNumber 转换之前，我们实际上可以修改 Array.prototype。 toString 提供不同的结果，任何 ToNumber 转换都将使用修改后的结果。

Array.prototype.toString = function() {
    var n = 0;
    for( var i = 0; i < this.length; i++ ) {
        n += this[i];
    }
    return n;
};

在这里，我将 Array.prototype 上的 toString 替换为对数组求和的函数。显然您不想这样做，但我们可以展示现在如何获得不同的结果。

Number([1,2,3]);   // 6
+[1,2,3];          // 6

现在您可以看到，之前会导致 NaN 的数组的 ToNumber 转换现在会导致数组中各项的总和。

Answer 4

我会尽力而为：

[]===0 当然是 false，因为 [] 不完全等于 0。但是， []== 0 为 true，因为存在隐式强制转换。

+ 和 -[] 之所以有效，是因为加号或减号会将 [] 转换为实数。

~0（0 的按位逆）是 -1。因此 ~[]==-1 有效。

其他的只是通过多次减去或加上 -1 来工作。

Answer 5

我相信，如果我错了，请纠正我，但是添加到数组（例如，向数组添加值而不是向数组添加值）会将其转换为数字。剩下的就是使用基本的 +、- 运算符（波形符 (~) 是按位 NOT）来修改数字，然后修改方程。

So [] == array ([]);
[] + 1 == number (0);
+[]===0 (true)