快捷導(dǎo)航

javascript按位非運(yùn)算符的使用方法

更新時(shí)間：2013年11月14日 15:54:37 作者：

本文講了一些javascript按位非運(yùn)算符的使用方法，其中給出了相關(guān)的測(cè)試代碼

~：按位非操作符由一個(gè)波浪線（~）表示，執(zhí)行按位非的結(jié)果就是返回?cái)?shù)值的反碼。

var num1 = 3;    // 我的幸運(yùn)數(shù)字是3
var num2 = ~(num1);
console.log(num2)  //  "-4"
var num3 = -3;  
var num4 = ~(num3);
console.log(num4)  //  "2"
console.log(~(0))  //  "-1"

沒(méi)錯(cuò)，現(xiàn)在我們知道了~運(yùn)算符的原理了。開(kāi)心嗎？。。。不開(kāi)心，雖然這一章，我看過(guò)好多次。。。因?yàn)槲覐膩?lái)就沒(méi)用過(guò)，實(shí)在是慚愧啊。大家覺(jué)得這個(gè)運(yùn)算符可以用在什么地方呢？恩。。。沉思一下，放一段同事的代碼：

復(fù)制代碼代碼如下:

if (~item[search_key].toLowerCase().indexOf(query)) {
                        _results.push(item);
 }

代碼：

復(fù)制代碼代碼如下:

if( str.indexOf(query) != -1 ) or if( str.indexOf(query) >= 0)

原理分析：
通過(guò)str.indexOf(query)最后得出的值，無(wú)外乎不過(guò)兩種：
1. str中包含query字符串，則值是0或正整數(shù)，此時(shí)：!!(~str.indexOf(query)) === true(或者這樣轉(zhuǎn)換 Boolean(~str.indexOf(query)) === true)
2. srt中不包含query字符串，則值為-1，此時(shí)：!!(~str.indexOf(query)) === false
因此通過(guò)加上一個(gè)~就能很好的對(duì)indexOf的查詢結(jié)果進(jìn)行判斷了。清爽無(wú)比，從此再也沒(méi)有頭屑的煩惱了。。哈哈！
最后我們來(lái)分析一下效率吧，印象中位運(yùn)算的效率應(yīng)該比較運(yùn)算符高。來(lái)段代碼：

復(fù)制代碼代碼如下:

var str = "hutaoer go go go!!!!! My lucky number is 33!!";
    var query = 33;
    var timeStart1 = new Date() - 0;
    for(var i = 0; i < 100000000; i++) {
        ~str.indexOf(query)
    }
    var timeEnd1 = new Date() - 0;
    console.log('~ cost time:' + (timeEnd1 - timeStart1)); 
    // ~ cost time:9954  循環(huán)次數(shù)：10000000 
    // ~ cost time:104  循環(huán)次數(shù)： 100000
    var timeStart2 = new Date() - 0;
    for(var j = 0; j < 100000000; j++) {
        str.indexOf(query) >= 0
    }
    var timeEnd2 = new Date() - 0;
    console.log('>= cost time:' + (timeEnd2 - timeStart2)); 
   // >= cost time:10120  循環(huán)次數(shù)：10000000 

程序更新：原來(lái)的測(cè)試代碼在分割線上面不變。代碼如下：

復(fù)制代碼代碼如下:

    var str = "hutaoer go go go!!!!! My lucky number is 33!!";
    var query = 33;
    var timeStart1 = new Date() - 0;
    for(var i = 0; i < 1000000; i++) {
        ~str.indexOf(query)
    }
    var timeEnd1 = new Date() - 0;
    console.log('~ cost time:' + (timeEnd1 - timeStart1));
    //  循環(huán)1000000次  127ms
    var timeStart2 = new Date() - 0;
    for(var j = 0; j < 1000000; j++) {
        str.indexOf(query) >= 0
    }
    var timeEnd2 = new Date() - 0;
    console.log('>= cost time:' + (timeEnd2 - timeStart2));
    // 循環(huán)1000000次 101ms
    var timeStart3 = new Date() - 0;
    for(var k = 0; k < 1000000; k++) {
        Boolean(~str.indexOf(query))
    }
    var timeEnd3 = new Date() - 0;
    console.log('add Boolean cost time:' + (timeEnd3 - timeStart3));
    // 循環(huán)1000000次 129ms
    var timeStart4 = new Date() - 0;
    for(var k = 0; k < 1000000; k++) {
        !!(~str.indexOf(query))
    }
    var timeEnd4 = new Date() - 0;
    console.log('add !! cost time:' + (timeEnd4 - timeStart4));
    // 循環(huán)10000000次 103ms
    

其實(shí)，對(duì)于一次運(yùn)算本身來(lái)說(shuō)，相差無(wú)幾，只是在循環(huán)次數(shù)過(guò)大，比如超過(guò)了10000000次，效率才會(huì)有一些差距。
【更新 2013.10.27 17:28】通過(guò)修改后的測(cè)試，我們可以發(fā)現(xiàn)，“按位非”這中寫法也許并非是效率最高的，表現(xiàn)最好的居然是我以前常用的寫法，采用比較運(yùn)算符。這確實(shí)讓我很吃驚。有時(shí)候，人往往容易被常識(shí)，表象所迷惑，但親自去嘗試后，或許會(huì)有不一樣的發(fā)現(xiàn)或得出其他的結(jié)果。今天，我算吸取教訓(xùn)了。
在評(píng)論中，同學(xué)們都比較反對(duì)這種非常見(jiàn)的寫法，畢竟這些技巧可能會(huì)給閱讀代碼的同學(xué)造成困擾。如果不知道原理的話，甚至讓人費(fèi)解?；蛟S，直接用一些簡(jiǎn)單的邏輯和常見(jiàn)的運(yùn)算符，會(huì)是更好的選擇？你們覺(jué)得呢？
因此平時(shí)寫代碼的時(shí)候，用哪種寫法都可以。但是希望我們能將這些技巧記住，關(guān)鍵時(shí)刻或許就能派上用場(chǎng)。

您可能感興趣的文章: