在 JavaScript 中使用 ~ 的目的是什么？

Question

我正在尝试阅读 Zepto.js 的源代码。而且函数matches里面有个地方我没看懂：

zepto.matches = function(element, selector) {
    if (!selector || !element || element.nodeType !== 1) return false
    var matchesSelector = element.webkitMatchesSelector || element.mozMatchesSelector ||
                          element.oMatchesSelector || element.matchesSelector
    if (matchesSelector) return matchesSelector.call(element, selector)
    var match, parent = element.parentNode, temp = !parent
    if (temp) (parent = tempParent).appendChild(element)

    //Here is my question. This line used the `~`
    match = ~zepto.qsa(parent, selector).indexOf(element)
    temp && tempParent.removeChild(element)
    return match
}

函数matches用于判断一个元素是否匹配提供的选择器。它应该 return 一个布尔值。

而 zepto.qsa() 是 Zepto 的 CSS 选择器实现，它使用 document.querySelectorAll 和其他一些优化。

所以。以下代码中 ~ 的用途是什么？

match = ~zepto.qsa(parent, selector).indexOf(element)

我知道~的意思是Bitwise NOT。

并且（通过我自己的测试）：

~ -1 === 0

~ 0 === -1

~ 1 === -2

但是我还是不明白这个设计是干什么用的

谁能解释一下？

Answer 1

嗯..它是按位非，所以你可以在处理位时使用它。

至于在您通常不使用位的情况下的实际应用，这里有一个小技巧：

 if (~arr.indexOf(val)) doStuff();

 //instead of

 if (arr.indexOf(val) > -1) doStuff();

--编辑--

我知道我没有看到你要求解释将 ~ 与 indexOf 一起使用。简而言之，~-1 的计算结果为 0。当您使用 if 语句时，0 是一个假值。这是 shorthand 的写法 arr.indexOf(val) > -1.

Answer 2

正在使用bitwise NOT operator to invert the results of the indexOf()函数。

我不熟悉 zepto.js 但我可以猜测代码的作用。首先它调用 zepto.qsa() 方法并传递父对象和选择器。此方法必须 return 一个数组，因为它随后调用 indexOf() 来获取元素的索引（我假设该元素是 "matched"）。

Array.indexOf() 方法 returns -1 如果在集合中找不到该元素。正如您已经看到的，-1 上的按位 NOT 给出零，相当于 false。 Any other value that could come out would be equivalent to true.

More generally this means you can use a bitwise NOT on indexOf() to get a boolean value indicating if the element searched for exists in the collection or not.

在 JavaScript 中使用 ~ 的目的是什么？

What is the purpose of using ~ in JavaScript?

javascript

zepto