buffer

Buffer

经典面试题: 为什么0.1+0.2!=0.3
定义变量时会将值存放当内存中 (内存中都是二进制的)
0.1的内存中的值是:0.0001100110011001100110011001100110011001100110011001101
0.2的内存中的值是:0.001100110011001100110011001100110011001100110011001101
所以0.1+0.2>0.3

十进制转换二进制的方法 小数(*2 取整)

//0.1的十进制如何转换成二进制的
0.1*2=0.2=>0
0.2*2=0.4=>0
0.4*2=0.8=>0
0.8*2=1.6=>1
//1.6取了整数后剩下0.6
0.6*2=1.2=>1
0.2*2=0.4=>0
0.4*2=0.8=>0
0.8*2=1.6=>1
0.6*2=1.2=>1
//...

方式1:整数的二进制如何转换成十进制(进制的值+进制*进制的N次方)(从右开始)
方式2:进制的N次方-1

//二进制的1111转换成十进制
//1*2的0次方+1*2的1次方+1*2的2次方+1*2的3次方
1+2+4+8=15


//方式2
2**4-1=15

编码

1. ASCII 最早的编码格式,1个字节代表一个符号,1个字节=8个位(bit),最大长度是255(2**8-1)已经能满足最基本的需要了 \r=13 \n=10
2. 但随着发展有的字符不能再一个字节中表示完了,就出现了新的编码方式 gb2312 gb18030 gbk等 但还是不能满足全部的字符
3. 出现了新的可变长的编码utf8 可变长 如果字符<255 就用一个字节表示 如果是大于255 就用两个字节表示 以此类推

在JS中转换的方法

1. 10进制转换成其他进制 100..toString(2)
2. 其他进制的转换成10进制 parseInt('ff',16)
3. 在chrome控制中直接输入 0xff就能出来10进制对应的值(8进制是 0o 2进制0b)

Base64

base64不是加密解密的方式,只是一种编码,缺点是会比原始文件(2进制资源)大1/3
为什么会大呢?
来个例子:
将"张"转换成base64的过程

1. 将张转换成2进制 <Buffer e5 bc a0> (使用方法Buffer.form('张'))
2. 将Buffer的16进制表示成2进制 11100101 10111100 10100000 (使用方法 0xe5.toString(2))
3. 将8位的二进制转换成6位 111001 011011 110010 100000
4. 原来2进制8位可以表示一个字节 改成了6位表示一个字节 所以比原来的字符大了1/3

todo: 自己实现一个base64的转化功能

Node中如何使用Buffer

buffer就是内存的代表 特点是不能扩容
声明方式:
let buf =Buffer.alloc(5)申请5个字符的容量
let buf=Buffer.allocUnsafe(5)申请5个不安全的字符容量,不安全的含义是,获取刚被释放的内存,速度较快
Buffer.callocUnsafe+Buffer.fill=Buffer.alloc
Buffer.fill手动填充Buffer中的内容

使用字符串声明:
Buffer.from('这是中文')

使用数组
Buffer.from([1,2,3,4])

自己实现Base64加密解密

//有Bug...
const Base64CodeLib = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=".split('');

//加密的方法:
function base64EnCode(str) {
  let buff = Buffer.from(str);
  let bStr = "";
  console.log(buff);

  buff.forEach(item => {
    let newB = (item).toString(2);
    while (newB.length < 8) {
      newB = "0" + newB;
    }
    bStr += newB;
  })

  let baseStr = "";
  let baseStrArr = [];
  let hasMoreLen = true;
  let index = 0;
  while (hasMoreLen) {
    let startNumber = index * 6;
    let str = bStr.substr(startNumber, 6);
    str.length > 0 && baseStrArr.push(str);
    index += 1;
    if (index * 6 > bStr.length) {
      hasMoreLen = false;
    }
  }
  console.log(baseStrArr);


  baseStrArr.forEach(item => {
    baseStr += Base64CodeLib[parseInt("00"+item, 2)];
  })
  return baseStr;
}

console.log(base64EnCode('dankogai'));

//使用Node自带的方法验证
console.log(Buffer.from('dankogai').toString('base64'));

drag拖拽预览图片功能

document.getElementById('drag').ondragover = function (e) {
      e.preventDefault();
    }
    document.getElementById('drag').ondrop = function (e) {
      e.preventDefault();
      let fr = new FileReader();
      fr.readAsDataURL(e.dataTransfer.files[0])
      fr.onload = function (e) {
        let base64 = e.target.result;
        let img = new Image();
        img.style="width:200px";
        img.src = base64;
        document.getElementById('drag').appendChild(img);
      }
    }