高性能 JavaScript 之位运算

引言

如果你是一个硬件工程师,那么你对位运算相关的东西必然已经非常熟悉,但作为一个前端工程师的你呢?这一点上,确实比较让人疑惑。当我在学校里,还在搞硬件相关的东西的时候,一方面的原因是当初的应用场景很多时候都会接触到,而另一方面,当初使用的编程语言并没有如同 JavaScript 一般灵活方便。考虑到 ROM/RAM 等因素,我如果想要依次点亮一排流水灯的时候,我可能会使用位移运算符配合一个数字来标记哪颗灯应该被点亮;当我需要存储多个布尔类型的数据的时候,我可能使用掩码的形式,存储和使用需要的信息。但是当我习惯了 JavaScript 提供给我的便利以及运行环境提供给我更大的容量、更快的计算速度的时候,不知不觉间,我竟渐渐忘了之前的编程方式。所以,不如提醒一下自己。

二进制与位运算

虽然现代浏览器、Nodejs 等为开发者提供了强大的 JavaScript 运行环境,但是这些环境的核心仍旧是运行在二进制的基础之上的,毋庸置疑的是,基于二进制数据在运行位运算的时候远比其它数学运算、布尔操作等快得多。JavaScript 为开发者提供了多种位运算支持:

  • 按位与(AND,&)
    当两个操作数对应位数都是 1 时,则在该位返回 1,否则则在该位返回 0;
1 & 4     // 0,     1 & 100 -> 000
3 & 5     // 1,     11 & 101 -> 001
  • 按位或(OR,|)
    当两个操作数对应位数中至少有一个是 1 是,则在该位返回 1,否则则在该位返回 0;
1 | 4     // 5,     1 | 100 -> 101
3 | 5     // 7,     11 | 101 -> 111
  • 按位异或(XOR,^)
    当两个操作数对应位数中两个数中,一个为 1,一个为 00,则在该位返回 1,否则则在该位返回;
1 ^ 4     // 5,   1 ^ 100 -> 101
3 ^ 5     // 6,   11 ^ 101 -> 110
  • 按位取反(NOT,~)
    在操作数对应位置,是 1 则在该位返回 0,否则则在该位返回 1;
~1        // -2,  因为补码存在的原因,这里可能和期望的有所不同,有兴趣可以深入学习一下
  • 移位运算 (>>, <<, >>>, <<<)
5 >> 1    // 2,    101 >> 1 -> 010
3 << 1    // 6,    11  << 1 -> 110

......

利用位运算进行性能优化

(一) 代替数学运算

很多情况下,我们可以使用位运算替代数学运算操作,比如判断一个数是否是奇数,最典型的做法当然是对 2 求余数,也即 if (value % 2) {}。但与此同时,二进制奇数的最低位一定是 1,这样我们就能通过如按位与的方式完成我们的需求,if (value & 1) {}。虽然改动比较小,但这个计算速度却将因此得到很大的提高。

(二) 位掩码

位掩码在一些偏底层的语言中使用得非常广泛,但 JavaScript 中却似乎被大众给忽略了,更多的情况下,大家都在关注业务、功能和兼容性等方面的问题,运行环境中提供的便利的 api 似乎也让我们觉得没太大必要使用掩码技术,但性能要求较高的场景中,我们还是会尝试从一些经典的编程范式中寻找答案。用一个很简单的例子来说明位掩码技术:

// 定义所有的可选项
var OPTION_A = 1,
    OPTION_B = 2,
    OPTION_C = 4,
    OPTION_D = 8,
    OPTION_E = 16;

// 包含选项 A、B、D
var options = OPTION_A | OPTION_B | OPTION_D;      // 1 | 10 | 1000 -> 1011

// 判断选项是否被包含在 options 中
options & OPTION_A        // 1011 & 1 -> 0001, true
options & OPTION_B        // 1011 & 10 ->  0010, true
options & OPTION_C        // 1011 & 110 -> 0, false
options & OPTION_D        // 1011 & 1000 -> 1000, true
options & OPTION_E        // 1011 & 10000 -> 0, false

之前,你可能会使用比如数组的 indexOf 或者 Map 数据结构等方式来确认一个数据在不在你的数据集合中,但相比而言,掩码的运算速度远比它们高,除却函数调用带来额外开销,位运算发生于系统底层,尤其是如果有多个选项保存在一起并需要频繁检查的时候,位掩码将大放异彩。
位运算的作用远不止如此,我们整个计算机系统都是在其基础之上构建出来的,这里罗列的只是冰山一角,欢迎大家帮我补充~~~

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 159,835评论 4 364
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 67,598评论 1 295
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 109,569评论 0 244
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 44,159评论 0 213
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 52,533评论 3 287
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 40,710评论 1 222
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 31,923评论 2 313
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 30,674评论 0 203
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 34,421评论 1 246
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 30,622评论 2 245
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 32,115评论 1 260
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 28,428评论 2 254
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 33,114评论 3 238
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 26,097评论 0 8
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 26,875评论 0 197
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 35,753评论 2 276
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 35,649评论 2 271

推荐阅读更多精彩内容