~~（“双波浪号”）在 Javascript 中的作用是啥？

Posted 2023-02-25

【中文标题】~~（“双波浪号”）在 Javascript 中的作用是啥？

【英文标题】：What does ~~ ("double tilde") do in Javascript?~~（“双波浪号”）在 Javascript 中的作用是什么？

【发布时间】：2011-05-02 14:55:36

【问题描述】：

我今天在查看一个在线游戏物理库时，偶然发现了 ~~ 运算符。我知道单个 ~ 是按位 NOT，那会使 ~~ 成为 NOT 的 NOT，它会返回相同的值，不是吗？

【问题讨论】：

另见What is the “double tilde” (~~) operator in javascript?

【参考方案1】：

~~ 可以用作Math.trunc() 的简写

~~8.29 // output 8

Math.trunc(8.29) // output 8

【参考方案2】：

波浪号(~) 有一个算法 -(N+1)

例如：

~0 = -(0+1) = -1
~5 = -(5+1) = -6
~-7 = -(-7+1) = 6

双波浪号是-(-(N+1)+1)

例如：

~~5 = -(-(5+1)+1) = 5
~~-3 = -(-(-3+1)+1) = -3

三个波浪号是 -(-(-(N+1)+1)+1)

例如：

~~~2 = -(-(-(2+1)+1)+1) = -3
~~~3 = -(-(-(3+1)+1)+1) = -4

【参考方案3】：

只是一点警告。这里的其他答案给我带来了一些麻烦。

目的是删除浮点数小数点后的任何内容，但它有一些极端情况，使其成为错误危险。我建议避免~~。

首先，~~ 不适用于非常大的数字。

~~1000000000000 == -727279968

作为替代方案，使用 Math.trunc()（正如 Gajus 所提到的，Math.trunc() 返回浮点数的整数部分，但仅在兼容 ECMAScript 6 的 JavaScript 中可用）。您始终可以通过以下方式为非 ECMAScript-6 环境创建自己的 Math.trunc()：

if(!Math.trunc)
    Math.trunc = function(value)
        return Math.sign(value) * Math.floor(Math.abs(value));
    

我为此写了一篇博文供参考：http://bitlords.blogspot.com/2016/08/the-double-tilde-x-technique-in.html

【参考方案4】：

将字符串转换为数字

console.log(~~-1);    // -1
console.log(~~0);     // 0
console.log(~~1);     // 1
console.log(~~"-1");  // -1
console.log(~~"0");   // 0
console.log(~~"1");   // 1
console.log(~~true);  // 1
console.log(~~false); // 0

~-1 为 0

if (~someStr.indexOf("a")) 
  // Found it
 else  
  // Not Found

source

【参考方案5】：

这是一个如何有效使用此运算符的示例，在哪里使用它是有意义的：

leftOffset = -(~~$('html').css('padding-left').replace('px', '') + ~~$('body').css('margin-left').replace('px', '')),

来源：

See section Interacting with points

【参考方案6】：

在 ECMAScript 6 中，~~ 的等价物是 Math.trunc：

通过删除任何小数位返回数字的整数部分。它不会对任何数字进行四舍五入。

Math.trunc(13.37)   // 13
Math.trunc(42.84)   // 42
Math.trunc(0.123)   //  0
Math.trunc(-0.123)  // -0
Math.trunc("-1.123")// -1
Math.trunc(NaN)     // NaN
Math.trunc("foo")   // NaN
Math.trunc()        // NaN

polyfill：

function trunc(x) 
    return x < 0 ? Math.ceil(x) : Math.floor(x);

【讨论】：

有点令人惊讶的是，~~ 比 Math.trunc 快，jsperf.com/math-trunc-vs-double-bitwise-not-operator。不过，并非一切都与速度有关。可读性也很好。

~~ 和 Math.trunc 之间有一个重要的区别：如果你传递一个字符串，或者 NaN 或者任何不是数字的东西，Math.trunc 将返回 NaN，而 ~~ 将始终返回一个数字，在这种情况下，它将返回 0。

根据jsperf.com/math-trunc-vs-double-bitwise-not-operator，

Math.trunc 在 Chrome 59+ 中略快于 ~~。

【参考方案7】：

它会删除小数点后的所有内容，因为位运算符会将其操作数隐式转换为有符号的 32 位整数。无论操作数是（浮点）数字还是字符串，这都有效，结果是数字。

换句话说，它产生：

function(x) 
  if(x < 0) return Math.ceil(x);
  else return Math.floor(x);

仅当 x 介于 -(2³¹) 和 2³¹ - 1 之间。否则，会发生溢出，数字将“环绕”。

这对于将函数的字符串参数转换为数字可能被认为很有用，但是由于溢出的可能性以及与非整数一起使用不正确，我不会那样使用它，除了“代码高尔夫"（ie 以牺牲可读性和健壮性为代价，毫无意义地从程序的源代码中删除字节）。我会改用+x 或Number(x)。

---

这怎么是NOT的NOT

数字-43.2，例如是：

-43.2₁₀ = 11111111111111111111111111010101₂

作为带符号（二进制补码）的 32 位二进制数。 （JavaScript 忽略小数点后的内容。）反转位给出：

非 -43₁₀ = 00000000000000000000000000101010₂ = 42₁₀

再次反转给出：

非 42₁₀ = 11111111111111111111111111010101₂ = -43₁₀

这与Math.floor(-43.2) 的不同之处在于负数向零舍入，而不是远离零。 （等于 -44 的 floor 函数总是向下舍入到下一个较小的整数，无论​​该数字是正数还是负数。）

【讨论】：

也就是说，~~ 是创建truncate function 的一种简写方式（也可能是一个好的解决方案？），但显然in javascript。

JSLint 会抱怨使用~~。

试试 Math.trunc()

【参考方案8】：

第一个 ~ 运算符将操作数强制为整数（可能在将值强制为字符串或布尔值之后），然后反转最低 31 位。官方 ECMAScript 数字都是浮点数，但在 SpiderMonkey 引擎中，有些数字是 31 位整数实现的。

您可以使用它将 1 元素数组转换为整数。浮点数根据 C 规则进行转换，即。小数部分的截断。

第二个 ~ 运算符然后将位反转，所以你知道你将有一个整数。这与在条件语句中将值强制为布尔值不同，因为空对象 的计算结果为 true，而 ~~ 的计算结果为 false。

js>~~"yes"
0
js>~~3
3
js>~~"yes"
0
js>~~false
0
js>~~""
0
js>~~true
1
js>~~"3"
3
js>~~
0
js>~~a:2
0
js>~~[2]
2
js>~~[2,3]
0
js>~~toString: function() return 4
4
js>~~NaN
0
js>~~[4.5]
4
js>~~5.6
5
js>~~-5.6
-5

【讨论】：

感谢 Shanti 提供的所有示例，这真的很有帮助！

还有~~undefined // 0

还有~~null // 0

从技术上讲，您的顺序有误。第二个~ 执行您描述的第一个~ 的操作，反之亦然。 ~ 运算符是一元运算符，从右到左进行交互 ~~X 就像 ~(~X) 不像 (~~)X （这将是一个语法错误）

【参考方案9】：

假设~N 是-(N+1)，那么~~N 是-(-(N+1) + 1)。这显然会导致neat trick。

【讨论】：

必须向下滚动到马特的评论才能看到它的正确使用；）

【参考方案10】：

~ 似乎是 -(N+1)。所以~2 == -(2 + 1) == -3 如果你在 -3 上再次执行它，它会返回：~-3 == -(-3 + 1) == 2 它可能只是以一种迂回的方式将字符串转换为数字。

看到这个帖子：http://www.sitepoint.com/forums/showthread.php?t=663275

另外，更详细的信息在这里：http://dreaminginjavascript.wordpress.com/2008/07/04/28/

【讨论】：

感谢 Drackir 的链接！