javascript的二进制运算符用于直接对二进制位进行计算,好处是速度快,缺点是不直观.

位运算符只对整数起作用,如果一个运算子不是整数,则会转换成整数后再执行;我们都知道javascript的数值都是以64位浮点数的形式储存的,但是在做位运算的时候,是以32位带符号的整数进行运算的,并且返回的也是32位带符号的整数

位运算符主要包括:

  • 二进制或运算符(|): 如果两个符号位都为0,则结果为0,否则为1.

    1100 | 0101 返回 1101

  • 二进制与运算符(&): 如果两个符号位都为1,则结果为1,否则为0

    1100 & 0101 返回 0100

  • 二进制非运算符(~): (一元运算符)取反,二进制位0变1,1变0

    ~1100 返回 0011

  • 二进制异或运算符(^): 若两个二进制位相同,则结果为0;否则为1

    1100 ^ 0101 返回 1001

  • 二进制左位移运算符(<<): 相当于乘以2的几次方

    5(十进制) << 3 相当于 5*(2的三次方)

  • 二进制右位移运算符(>>): 相当于除以2的几次方

    5(十进制) >> 3 相当于 5/(2的三次方)

  • 二进制无符号右位移(>>>): 也叫作头部补零右位移运算符
// 声明变量a并赋值为1
var a = 1;
// 利用位运算符返回的是32位带符号的整数可以将a转换为32位的整数
a = a | 0; // 利用这个特性,可以写出一个将任意值转为32位整数的函数
function toInt32(x) {
return x | 0;
}

二进制或运算符(or)(符号|)

逐位比较两个运算子的二进制位,只要有一个是1的就返回1,否则返回0

需要注意的是位运算只对整数有效,如果是小数,则会吧小数部分舍去,只保留整数部分,然后再进行位运算

// 返回-2
-2.9 | 0

二进制与运算符(and)(符号&)

逐位比较两个运算子的二进制位,只要有一个是0就返回0,否则返回1

// 变为二进制 00 & 11
// 结果为00,返回0
0 & 3

二进制否运算符(not)(符号!)

二进制否运算符将每个二进制位都变为相反值(1变为0,0变为1)

// 5的32位整数二进制形式为00000000000000000000000000000101,
// 否运算后11111111111111111111111111111010,
// 最高位是1表示负数,计算机内部的负数是以补码的形式来储存的,
// 所以需要减一取反来计算出源码00000000000000000000000000000110,十进制形式为6,再加上符号为-6
~5 = -6
  1. 可以简单记成一个数与自身的取反值相加,等于-1
  2. 对一个整数连续两次二进制否运算,得到它自身
  3. 所有的位运算都只对整数有效,二进制否运算符遇到小数时也会舍去小数部分,所以我4. 们可以利用这个特性对一个小数连续进行两次二进制否运算,能达到取整的效果
  4. 对字符串进行二进制否运算,javascript会先调用Number函数将字符串转为数值

二进制异或运算符(xor)(符号 ^)

两个二进制位相同为0,不同为1

异或运算符的运用: 在不使用第三变量的情况下交换两个变量的值

// a的32位整数二进制表示 00000000000000000000000000001010
// b的32位整数二进制表示 00000000000000000000000000001011
var a = 10;
var b = 11;
// a ^ b 为 00000000000000000000000000000001
a = a ^ b;
// 此时变为 00000000000000000000000000000001 ^ 00000000000000000000000000001011
b = b ^ a;
a = a ^ b;

二进制左位移运算符(Left Shift)(符号<<)

左位移运算符表示将一个数的二进制位值向左移动制定的位数,尾部补0,即乘以2的指定次方.向左移动时,最高位的符号位也是一起移动的

如果左移0位,就相当于将该数值转为32位整数,等同于取整,对正负数都有效

var color = {r: 100,g: 120,b: 66};
// RGB转为HEX
// 1 << 24是为了保证结果是6位数
// HEX最多是#加6为数字(16进制),所以最小是000000,最大是ffffff
var rgbToHEX = function(r,g,b){
return '#' + ((1 << 24) + (r << 16) + (g << 8) + b).toString(16).substr(1);
}
// #647842
rgbToHEX(color.r,color.g,color.b);

补充javascript中的toString()

Array.toString(): 数组的toString()是将数组转换为一个字符串,并返回

Boolean.toString(): 将boolean转换为字符串,值是"true"或"false"

Date.toString(): 将日期对象转换为字符串形式,采用本地时间

Error.toString(): 将错误转换为字符串

Function.toString(): 将函数转换为字符串

Number.toString(): 将数字转换为字符串,可以传入指定的参数,参数表示为是指定进制(范围是2-36)。例如当参数是2时,返回二进制数

二进制右位移运算符(Right Shift)(符号>>)

右位移运算符(>>)b表示将一个数的二进制形式向右移动指定的位数,如果这个数是整数,头部补0;如果是负数,头部补1.(最高位符号位也会跟着移动)

右移运算符相当于除以2的指定次方

头部补零的右位移运算符

头部补零的右位移运算符(>>>)与右位移运算符相似,正数时完全一样,负数时,头部一律补0,而不考虑符号位.所以该运算符总能得到正值

二进制的开关作用

位运算符可以用来检测或设置对象属性的开关,也就是查看或设置二进制形式对应位上的是0(关)或1(开)

& 运算符可以用来检测当前的设置是否打开了指定的开关

// 二进制形式0101
var flags = 5;
// 二进制形式0100
var FLAG = 4;
// 使用 flags & FLAG检测flags是否打开了第三个开关
if(flags & FLAG){
console.log('打开了第三个开关');
}

javascript中的二进制运算符的更多相关文章

  1. 浅析JavaScript中的typeof运算符

    对JavaScript中的typeof运算符进行了详细的分析介绍,需要的朋友可以过来参考下,希望对大家有所帮助. 如果typeof的运算符是数字.字符串或者布尔值,它返回的结果就是"numb ...

  2. JavaScript中涉及得运算符以及运算符的优先级

    在js中主要有三种运算符:算术运算符,逻辑与比较运算符,位运算符.在着三种运算符中,最常见的应该是算术与比较运算符,位运算符比较少见一些 *说到了运算符,就不得不说运算符的优先级.下面我来列一下这些运 ...

  3. JavaScript中的逗号运算符

    JavaScript逗号运算符  阅读本文的前提,明确表达式.短语.运算符.运算数这几个概念. 所谓表达式,就是一个JavaScript的“短语”,JavaScript解释器可以计算它,从而生成一个值 ...

  4. JavaScript学习系列8 - JavaScript中的关系运算符

    JavaScript中有8个关系运算符,分别是 ===, !===, ==, !=, <, <=, >, >= 1. 恒等运算符 (===) ===也叫做 严格相等运算符,它要 ...

  5. JavaScript学习系列4 ----- JavaScript中的扩展运算符 三个点(...)

    在JavaScript中, ES6开始有rest参数 和 三个点扩展运算符 (spread运算符) 我们来看看他们各自的用处 1. rest参数 rest参数的形式为 ...变量名          ...

  6. Javascript中的位运算符和技巧

    ECMAScript 整数有两种类型,即有符号整数(允许用正数和负数)和无符号整数(只允许用正数).在 ECMAScript 中,所有整数字面量默认都是有符号整数,这意味着什么呢? 有符号整数使用 3 ...

  7. javaScript 中的布尔运算符 && 和 ||

    布尔运算符 && 和 ||的返回结果不一定是布尔值!由此来展开一定的研究及理解. 1.首先先介绍下常见的数据类型转化为bool后的值. (常用地方)在if表达式中,javascript ...

  8. javascript中的instanceof运算符

    instanceof运算符希望左操作数是一个对象,右操作数表示对象的类:如果左侧的对象是右侧类的实例,则返回true,否则返回false.由于js中对象的类是通过初始化它们的构造函数来定义的,因此in ...

  9. JavaScript中使用typeof运算符需要注意的几个坑

    typeof是一个运算符,它对操作数返回的结果是一个字符串,有6种(只针对ES,不包含HOST环境对象). 1.'undefined'2.'boolean'3.'string'4.'number'5. ...

  10. javascript中的in运算符

    in运算符希望它的左操作数是一个字符串或可以转换为字符串,希望他的又操作数是一个对象:如果右侧对象拥有一个名为左操作数值的属性名,那么表达式返回true: var point = {x:1,y:1}; ...

随机推荐

  1. [python] 基于wordcloud库绘制词云图

    词云Wordcloud是文本数据的一种可视化表示方式.它通过设置不同的字体大小或颜色来表现每个术语的重要性.词云在社交媒体中被广泛使用,因为它能够让读者快速感知最突出的术语.然而,词云的输出结果没有统 ...

  2. [机器学习] Yellowbrick使用笔记7-聚类可视化

    聚类模型是试图检测未标记数据中模式的无监督方法.聚类算法主要有两类:聚集聚类将相似的数据点连接在一起,而质心聚类则试图在数据中找到中心或分区.Yellowbrick提供yellowbrick.clus ...

  3. 题解 CF1579G Minimal Coverage

    CF1579G Minimal Coverage dp好题! link to the problem 解法 首先需要观察到:如果最长线段的长度为\(maxL\),那么答案不可能超过\(2maxL\) ...

  4. [阿里云]I+的一些探索

    I+是阿里云的关系网络分析,万物皆可联 使用中遇到的一些问题,特记录如下: 1.添加数据源 这个数据源是用于数据落地的存储,所以一定要选择<是> 2.配置对象信息 这一步就像是创建一个表来 ...

  5. 从0到1手把手教你实现vite系列--重写依赖请求路径,处理/@modules/vue引用

    前面以及写了三篇了,这是第四篇,等我写完就合并起来哦 这个是第一篇的链接:vite原理,创建项目,基础知识 这个是第二篇的链接Vite-中篇-通过服务访问静态资源以及重写请求路径 这个是第三篇的链接# ...

  6. 问题记录:VMware vSphere vCenter 7.0 上传文件失败

    问题记录:VMware vSphere vCenter 7.0 上传文件失败 环境说明: VC版本:VMware vSphere vCenter 7.0 ESXi版本:VMware vSphere E ...

  7. CSS 3 所有的选择器整理(2023.2)

    你知道的和你不知道的所有选择器.不包含尚未广泛实现的,也不包含已弃用的. 基本的选择器规则(Selector) 类型(Type)选择器 直接用标签匹配特定的元素 span { ... } p { .. ...

  8. Spring Boot启动时执行初始化操作三种方法分享

    @PostConstruct对于注入到Spring容器中的类,在其成员函数前添加@PostConstruct注解,则在执行Spring beans初始化时,就会执行该函数.但由于该函数执行时,其他Sp ...

  9. Vue22 VueCli 脚手架

    1 简介 CLI 是 Command-Line Interface, 翻译为命令行界面, 但是俗称脚手架 Vue CLI是一个官方发布 vue.js 项目脚手架 使用 vue-cli 可以快速搭建 V ...

  10. 下午小博(java小知识)

    抽象类: 抽象类中可以构造方法 抽象类中可以存在普通属性,方法,静态属性和方法 抽象类中可以存在抽象方法如果一个类中有一个抽象方法,那么当前类一定是抽象类:抽象类中不一定有抽象方法 抽象类中的抽象方法 ...