JavaScript 里 ~ 的神奇用法

FreeZinG 發(fā)布于2019-08-21 10:30 / 1001人閱讀

這幾天看koa源碼的時(shí)候，經(jīng)常看到if(~notfound.indexOf(err.code)){ doSomeing... }這種在一個(gè)表達(dá)式前面加~號(hào)的，今天就來(lái)扒一扒這已黑魔法。

~ 取反操作符

不熟悉原碼，反碼，補(bǔ)碼的小伙伴可以先看一下這篇文章原碼、反碼、補(bǔ)碼，計(jì)算機(jī)中負(fù)數(shù)的表示
在javascript中，假設(shè)有一個(gè)變量var a = 1, 那么~a + a = -1, 也就是說(shuō)現(xiàn)在~a ＝ -2

~ 在條件判斷中的用法

先上一段代碼

var arr = ["zank", "ywwhack"]
if(~arr.indexOf("zank")){
    console.log("found");
}else{
    console.log("not found");
}

這段代碼最后會(huì)輸出found，說(shuō)明~arr.indexOf("zank")等價(jià)于arr.indexOf("zank")>-1

還記得剛才的~a+a = -1么，其實(shí)用的就是這個(gè)原理。arr.indexOf()調(diào)用后，如果沒(méi)找到會(huì)返回-1，否則返回一個(gè)大于-1的整數(shù)。

假設(shè)a = arr.indexOf()，那么如果arr中存在所查找的元素時(shí)，a=-1，那么~a=0，上面代碼可以改寫如下：

var arr = ["zank", "ywwhack"],
    a = arr.indexOf("zank"), //a = 0
    exist = ~a; // exist = -1, 
//只有當(dāng)a = -1時(shí)，即arr中不存在查找的元素,exist=0,其余的exist都為負(fù)值
if(exist){
    console.log("found");
}else{
    console.log("not found");
}

云服務(wù)器 GPU云服務(wù)器神奇的網(wǎng)站 javascript用法一個(gè)神奇的網(wǎng)站 javascript常見用法

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://www.ezyhdfw.cn/yun/85667.html

相關(guān)文章

你不知道的Chrome DevTools（1）：神奇的console

摘要：我打算把一些上使用的高級(jí)技巧寫成你不知道的這一系列的博文，希望大家一起學(xué)習(xí)學(xué)習(xí)。在代碼中使用的最簡(jiǎn)單的用法就是寫個(gè)在控制臺(tái)打印一行消息。跟的區(qū)別在于會(huì)對(duì)輸出的對(duì)象進(jìn)行展開。用于顯示一組的控制臺(tái)輸出，要搭配來(lái)使用。 Web前端開發(fā)過(guò)程中必然會(huì)用到Chrome瀏覽器自帶的開發(fā)者工具Chrome DevTools，使用它作為Web前端開發(fā)性能調(diào)試的必備工具。就連隔壁的產(chǎn)品小哥都知道打開F12...

KevinYan 2019-08-19 14:34 評(píng)論0 收藏0
快速理解JavaScript中apply()和call()的用法和用途

摘要：在學(xué)習(xí)之前，我們必須對(duì)的作用和使用方法有所了解，可以參考我前一篇文章快速理解中的用法與陷阱。和的作用十分相似，只是參數(shù)類型上的差別，以適應(yīng)不同的使用場(chǎng)景。在學(xué)習(xí)apply()之前，我們必須對(duì)this的作用和使用方法有所了解，可以參考我前一篇文章《快速理解JavaScript中this的用法與陷阱》。當(dāng)然如果你已經(jīng)熟悉this的相關(guān)知識(shí)，那么請(qǐng)直接往下看。 call()和apply()...

chenjiang3 2019-08-19 17:49 評(píng)論0 收藏0
神奇的選擇器 :focus-within

摘要：的偽類選擇器和偽元素選擇器，讓有了更為強(qiáng)大的功能。劃重點(diǎn)，它或它的后代獲得焦點(diǎn)。另外，劃重點(diǎn)，這個(gè)偽類是仍處于實(shí)驗(yàn)室的方案。最后感謝耐心讀完。CSS 的偽類選擇器和偽元素選擇器，讓 CSS 有了更為強(qiáng)大的功能。偽類大家聽的多了，偽元素可能聽到的不是那么頻繁，其實(shí) CSS 對(duì)這兩個(gè)是有區(qū)分的。有個(gè)錯(cuò)誤有必要每次講到偽類都提一下，有時(shí)你會(huì)發(fā)現(xiàn)偽類元素使用了兩個(gè)冒號(hào) (::) 而不是一個(gè)冒...

clasnake 2019-04-23 13:30 評(píng)論0 收藏0
Webpack基本功能理解以及使用

摘要：在這個(gè)過(guò)程中，會(huì)用到一些解析工具用來(lái)預(yù)處理一些模塊以及拓展語(yǔ)言例如這些工具的配置使用都是在中完成的。屬性，表示進(jìn)行轉(zhuǎn)換時(shí)，應(yīng)該使用哪個(gè)。插件接口功能極其強(qiáng)大，可以用來(lái)處理各種各樣的任務(wù)。對(duì)于前端工程化，webpack一個(gè)神奇的工具，既然是個(gè)神奇的工具。那我們保留我們的好奇心，來(lái)聊一聊它，首先我們要搞清楚webpack到底是用來(lái)解決什么問(wèn)題的，然后我們來(lái)看看它到底是怎么做的，最后來(lái)看看...

KnewOne 2019-08-26 10:09 評(píng)論0 收藏0
js中reduce的神奇用法

摘要：最近經(jīng)常在項(xiàng)目中經(jīng)?？吹絼e人用處理數(shù)據(jù)，很是牛掰，很夢(mèng)幻，不如自己琢磨琢磨。初始值或者計(jì)算結(jié)束后的返回值。當(dāng)前元素所屬的數(shù)組對(duì)象。傳遞給函數(shù)的初始值，相當(dāng)于的初始值。 showImg(https://user-gold-cdn.xitu.io/2018/9/4/165a52f4bf93fbf4?w=6000&h=3000&f=jpeg&s=3043490); 最近經(jīng)常在項(xiàng)目中經(jīng)?？吹絼e...

岳光 2019-08-23 11:43 評(píng)論0 收藏0