Posted in Javascript onNovember 14, 2013
~:按位非操作符由一个波浪线(~)表示,执行按位非的结果就是返回数值的反码。
var num1 = 3; // 我的幸运数字是3 var num2 = ~(num1); console.log(num2) // "-4" var num3 = -3; var num4 = ~(num3); console.log(num4) // "2" console.log(~(0)) // "-1"
没错,现在我们知道了~运算符的原理了。开心吗?。。。不开心,虽然这一章,我看过好多次。。。因为我从来就没用过,实在是惭愧啊。大家觉得这个运算符可以用在什么地方呢?恩。。。沉思一下,放一段同事的代码:
if (~item[search_key].toLowerCase().indexOf(query)) { _results.push(item); }
代码:
if( str.indexOf(query) != -1 ) or if( str.indexOf(query) >= 0)
原理分析:
通过str.indexOf(query)最后得出的值,无外乎不过两种:
1. str中包含query字符串,则值是0或正整数,此时:!!(~str.indexOf(query)) === true(或者这样转换 Boolean(~str.indexOf(query)) === true)
2. srt中不包含query字符串,则值为-1,此时:!!(~str.indexOf(query)) === false
因此通过加上一个~就能很好的对indexOf的查询结果进行判断了。清爽无比,从此再也没有头屑的烦恼了。。哈哈!
最后我们来分析一下效率吧,印象中位运算的效率应该比较运算符高。来段代码:
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 循环次数:10000000 // ~ cost time:104 循环次数: 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 循环次数:10000000
程序更新:原来的测试代码在分割线上面不变。代码如下:
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)); // 循环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)); // 循环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)); // 循环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)); // 循环10000000次 103ms
其实,对于一次运算本身来说,相差无几,只是在循环次数过大,比如超过了10000000次,效率才会有一些差距。
【更新 2013.10.27 17:28】通过修改后的测试,我们可以发现,“按位非”这中写法也许并非是效率最高的,表现最好的居然是我以前常用的写法,采用比较运算符。这确实让我很吃惊。有时候,人往往容易被常识,表象所迷惑,但亲自去尝试后,或许会有不一样的发现或得出其他的结果。今天,我算吸取教训了。
在评论中,同学们都比较反对这种非常见的写法,毕竟这些技巧可能会给阅读代码的同学造成困扰。如果不知道原理的话,甚至让人费解。或许,直接用一些简单的逻辑和常见的运算符,会是更好的选择?你们觉得呢?
因此平时写代码的时候,用哪种写法都可以。但是希望我们能将这些技巧记住,关键时刻或许就能派上用场。
javascript按位非运算符的使用方法
声明:登载此文出于传递更多信息之目的,并不意味着赞同其观点或证实其描述。
Reply on: @reply_date@
@reply_contents@