Habilidades esenciales avanzadas de front-end: operación de bit JS

1. Introducción

      Como todos sabemos, la operación de bits es algo que debemos aprender cuando aprendemos computadoras. De hecho, la operación de matriz habitual debe convertirse primero en binario antes de realizar operaciones, y la operación de bits es para realizar directamente operaciones binarias. La operación de bits es una operación de bajo nivel. operación, por lo que la velocidad suele ser también la más rápida (en comparación con otras operaciones como suma, resta, multiplicación y división), y algunos algoritmos se pueden implementar con la ayuda de operaciones de bits. El uso adecuado de las operaciones tiene muchos beneficios, los predecesores usaban operaciones binarias y de bits para darnos una computadora con operaciones simples, pero rara vez entramos en contacto con operaciones de bits. Todas las operaciones de bits se realizan en binario, y solo hay 0 y 1 en binario.
A continuación se muestran algunos ejemplos para profundizar en la comprensión de las operaciones con bits.

sobre binario

      Binario es un sistema numérico ampliamente utilizado en la tecnología informática. Los datos binarios son un número representado por dos dígitos de 0 y 1. Su base es 2, la regla del acarreo es "cada dos es uno", y la regla del préstamo es "toma prestado uno como dos", que fue descubierta por Leibniz, un filósofo matemático alemán en el siglo XVIII. El sistema informático actual utiliza básicamente un sistema binario y los datos se almacenan principalmente en forma de código complementario en la computadora. El binario en la computadora es un interruptor muy pequeño, que usa "encendido" para representar 1 y "apagado" para representar 0.

2. Tabla de operadores bit a bit

operador	significado	ejemplo	regla
&	y	a&b	El resultado es solo 1 cuando ambos bits son 1.
|	o	a|b	El resultado es solo 0 cuando ambos bits son 0.
~	reconciliación	~ un	0 se convierte en 1, 1 se convierte en 0.
^	XOR	a ^ b	Dos bits son iguales a 0 y diferentes a 1.
<<	Shift izquierdo	un<<2	Todos los bits binarios se desplazan a la izquierda varios bits, los bits altos se descartan y los bits bajos se rellenan con 0.
>>	Giro a la derecha	b>>4	Cada bit binario se desplaza a la derecha varios bits. Para números sin signo, el bit superior se rellena con 0, y para números con signo, el desplazamiento a la derecha se rellena con 1.
>>>	desplazamiento a la derecha sin firmar	x>>>2	Todos los números binarios se desplazan a la derecha varios bits, los bits altos se rellenan con 0 y los bits bajos se descartan.

2.1 Operación de bit - referencia de resultado lógico

A	B	A&B	A|B	A ^ B
verdadero	verdadero	verdadero	verdadero	FALSO
verdadero	FALSO	FALSO	verdadero	verdadero
FALSO	verdadero	FALSO	verdadero	verdadero
FALSO	FALSO	FALSO	FALSO	FALSO

A	B	A&B	A|B	A ^ B	~A
0	0	0	0	0	1
1	0	0	1	1	0
0	1	0	1	1	1
1	1	1	1	0	0

2.2 Operaciones con bits - Ejemplos

funcionar	resultado	Equivalente a	resultado
5 y 1	1	0101 y 0001	0001
5 | 1	5	0101 | 0001	0101
5^1	4	0101 ^ 0001	0100
~5	10	~0101	1010
5<<1	10	0101<<1	1010
5>>1	2	0101>>1	0010
5>>>1	2	0101>>>1	0010

Aquí hay algunos ejemplos, principalmente mirando AND y OR:

# 例子1
    A = 10001001
    B = 10010000
A | B = 10011001

# 例子2
    A = 10001001
    C = 10001000
A | C = 10001001
# 例子1
    A = 10001001
    B = 10010000
A & B = 10000000

# 例子2
    A = 10001001
    C = 10001000
A & C = 10001000

2.3 Conceptos básicos de las operaciones con bits

Operador - Ejemplo de diagrama

3. ¿Cuáles son los métodos de operación de bits?

3.1 Presione el operador not ~ también es muy útil en el proyecto.

Por ejemplo, si generalmente escribimos código, juzgamos si hay un cierto valor en la matriz, que se juzga así

let arr = [4,7,10]
if (arr.indexOf(7) > -1) {
    
    
  console.log('测试')
}//测试

De hecho, podemos escribirlo de manera más concisa:

let arr = [4,7,10]
if (~arr.indexOf(7)) {
    
    
  console.log('测试')
}

3.2 Presione el operador de desplazamiento a la izquierda << para obtener rápidamente la potencia de 2

console.log(1 << 5)  // 32, 即 2的5次方
console.log(1 << 10) // 1024, 即 2的10次方

// 但是要注意使用
console.log(a = 2e10) // 20000000000
console.log(a << 2)  // -1604378624

3.3 Presione ^ para cambiar la variable 0 o 1

//if 判断
let show;
if (show) {
    
    
  show = 0;
} else {
    
    
  show = 1;
}
console.log(show) // 1

//三目运算符
show = show ? 0 : 1;
console.log(show) // 1
//可以换成^
show ^= 1;
console.log(show) //1

## 3.4. Presione & para juzgar la paridad```javascript console.log(7 & 1); // 1 console.log(8 & 1); // 0 ```

3.5, desplazamiento a la izquierda firmado (<<)

Un desplazamiento a la izquierda con signo desplaza todos los bits de un número binario de 32 bits hacia la izquierda el número de bits especificado. como:

var num = 2; // 二进制10
num = num << 6; // 二进制1000000，十进制128
console.log(num)
//另外
function ceshi(n) {
    
    
  return 1 << n;
}
console.log(ceshi(5))//32

3.6, desplazamiento a la derecha firmado (>>)

Un desplazamiento a la derecha con signo desplaza todos los bits de un número binario de 32 bits hacia la derecha el número de bits especificado. como:

var num = 64; // 二进制1000000
num = num >> 7; // 二进制10，十进制0
console.log(num)
//另外
var num = 64 >> 1; // 32
console.log(num)

3.7, desplazamiento a la derecha sin firmar (>>>)

Un desplazamiento a la derecha sin signo de un número positivo tiene el mismo resultado que un desplazamiento a la derecha con signo. El desplazamiento a la derecha sin signo de un número negativo también desplazará el bit de signo, y el desplazamiento a la derecha sin signo tratará el código binario del número negativo como el código binario del número positivo:

var num = -64; // 11111111111111111111111111000000
num = num >>> 7; // 33554431
console.log(num)
//另外，我们可以利用无符号右移来判断一个数的正负：
function ceshi(n) {
    
    
  return (n === (n >>> 0)) ? true : false; 
}
console.log(ceshi(-1)) // false
console.log(ceshi(1)) // true

3.8, bit a bit o (|)

Los operadores | y || funcionan de la misma manera, siempre que uno de los dos números sea 1, el resultado sea 1 y los otros sean 0.

var num = Math.floor(1.3); // 1
console.log(num)//1
//另外
var num = 1.3 | 0; // 1
console.log(num)

Espere algunas otras operaciones sofisticadas, este no es un ejemplo

4. Razonamiento de operación de bits

4.1 Bit a bit O |

Solo cuando cualquiera de a y b es 1, a|b es 1

8	=	1	0	0	0
2	=	0	0	1	0
10	=	1	0	1	0

Escenario de aplicación: redondeo

function toInt(num) {
    
    
  return num | 0
}
console.log(toInt(1.9))        // 1
console.log(toInt(1.32322))    // 1

4.2 Bit a bit AND &

a & b es 1 solo cuando a y b son 1

8	=	1	0	0	0
2	=	0	0	1	0
0	=	0	0	0	0

Escenario de aplicación: juzgar la paridad

var number = 0 
console.log(number & 1 === 1)

4.3, XOR bit a bit ^

El resultado es 1 cuando los bits correspondientes de los dos operandos tienen un solo 1, en caso contrario es 0.

8	=	1	0	0	0
2	=	0	0	1	0
10	=	1	0	1	0

Escenario de Aplicación: Intercambiar los valores de dos variables

let a = 5,
    b = 6;

console.log(a = a ^ b);//3
console.log(b = a ^ b);//5
console.log(a = a ^ b);//6

// 还可以通过运算
console.log(a = a + b);//11
console.log(b = a - b);//6
console.log(a = a - b);//5

// es 6
console.log([a, b] = [b, a])//[ 6, 5 ]
// 原理剖析：a = a ^ b; b = a ^ b 相当与 b = a ^ b ^ b = a ^ (b ^ b) = a ^ 0 = a;

4.4, bit a bit NO ~

En pocas palabras, es invertir un número binario, es decir, 0 se convierte en 1 y 1 se convierte en cero (cero se convierte en uno, uno se convierte en cero). Escenario de aplicación: los decimales se redondean, porque el valor de operación de la operación de bits se requiere
para ser un número entero, y el resultado también es un número entero, por lo que después de la operación de bits se convertirá automáticamente en un número entero

4.5，JS如何实现两个大数相加

当有两个整数 a 和 b ，在通常情况下我们有“+”运算符对其进行相加运算：

let sum = a + b;

但是 JS 的Number类型是有内存限制的，数字的长度超过8字节，便会损失精度。

JS 中整数的最大安全范围可以查到是：9007199254740991

为了避免出现精度损失，我们可以采用另一种方法来巧妙地运算
使用字符串进行计算
将每一个字符当做一位来单独进行计算，将其分出来非进位和与进位和，将两者进行一个字符串的拼接

let a = "9007199254740991";
let b = "1234567899999999999";

function add(a ,b){
    
    
  //取两个数字的最大长度
  let maxLength = Math.max(a.length, b.length);
  //用0去补齐长度
  a = a.padStart(maxLength , 0);//"0009007199254740991"
  b = b.padStart(maxLength , 0);//"1234567899999999999"
  //定义加法过程中需要用到的变量
  let t = 0;	
  let f = 0;   //"进位"
  let sum = "";
  for(let i=maxLength-1 ; i>=0 ; i--){
    
    
    t = parseInt(a[i]) + parseInt(b[i]) + f;	//每一位字符的number和
    f = Math.floor(t/10);		//将和进行一个进位（类似<<）处理，并取出”进位“，这个进位要在下一位运算中加上
    sum = t%10 + sum;		//将第i位的字符结果拼接到sum上
  }
  if(f == 1){
    
    
    sum = "1" + sum;
  }
  return sum;
}

4.6，JS该不该用位运算?

      JS中最大数支持64bit,但是注意运算起来，如果是两个数，比如位操作，最大支持31bit(2147483647)，如果超出之后，比如
2147483647 & 2147483647 结果与之后是32位，这个不支持已经溢出，所以安全的位操作的最大位数30位

2147483647 & 2147483647   // 2147483647
4294967295 & 4294967295   // -1

      没有什么必要在 js 中使用位运算，未必就能提高性能，引擎未必不会帮我们优化，由于 number 类型存储的方式，就可能会踩坑。

小结

      这套运算符针对的是整数，所以对 Javascript 完全无用，因为 Javascript 内部，所有数字都保存为双精度浮点数。如果使用它们的话，Javascript 不得不将运算数先转为整数，然后再进行运算，这样就降低了速度。而且"按位与运算符"&同"逻辑与运算符"&&，很容易混淆。

5. 写在最后：

      以上的例子在平常可能会比较容易用到或看到，也是属于比较容易理解的。一些比较复杂的、难理解的，对于我来说，觉得应该尽量少用，因为会给自己带来麻烦。但是巧妙的使用位运算可以大量减少运行开销，优化算法。我们都知道计算机存储的都是二进制数据，这是由计算机本身的设计决定的。

参考资料：

https://www.w3school.com.cn/js/js_bitwise.asp
https://blog.csdn.net/deaidai/article/details/78167367
https://blog.csdn.net/weixin_43808903/article/details/ 110262130