精华内容
下载资源
问答
  • JS 字节流 解析

    2020-12-07 18:48:47
    提示:最近作者在工作之余,遇到了关于字节数据传输,前端解析数据的问题,为此写了一个用于处理该类问题的 js 库。 提示:以下是本篇文章正文内容,下面案例可供参考 JS 源码 代码如下(示例): var BOOL_TYPE = ...


    前言

    提示:最近作者在工作之余,遇到了关于字节数据传输,前端解析数据的问题,为此写了一个用于处理该类问题的 js 库。


    提示:以下是本篇文章正文内容,下面案例可供参考

    JS 源码

    代码如下(示例):

    var BOOL_TYPE = 0,       // Bool
        INT8_TYPE = 1,       // Char
        UINT8_TYPE = 2,      // UChar
        INT16_TYPE = 3,      // Short
        UINT16_TYPE = 4,     // UShort
        INT32_TYPE = 5,      // Int
        INT64_TYPE = 6       // Long
        UINT32_TYPE = 7,     // UInt
        FLOAT32_TYPE = 8,    // Float
        FLOAT64_TYPE = 9,    // Double
        BYTE_TYPE = 10,      // Byte
        Str_TYPE = 11;  
        
    // type:数据类型, Bin:二进制流,begin:数据起始位置(字节),Num: 1
    function TypedArrays(Type, Bin) {//, begin, Num
        //var _num = 1;
        switch (Type) {
            case BOOL_TYPE: return Bin[0] == 1 ? true : false;
            case INT8_TYPE: return toInt8(Bin); 
            case UINT8_TYPE: return toUint8(Bin); 
            case INT16_TYPE: return toInt16(Bin);    
            case UINT16_TYPE: return toUint16(Bin);  
            case INT32_TYPE: return toInt32(Bin);    
            case INT64_TYPE: return toInt64(Bin);    
            case UINT32_TYPE: return toUint32(Bin);  
            case FLOAT32_TYPE: return toFloat32(Bin);
            case FLOAT64_TYPE: return toFloat64(Bin);
            case BYTE_TYPE: return toBytes(Bin);
            case Str_TYPE: return toString(Bin);
            default: return -1;
        }
    }
    
    // 截取指定大小数据并转换成指定的数据类型
    function ByteToType(Type, Bin, begin, Num) {
        return TypedArrays(Type, Bin.splice(begin, Num));//, begin, Num);
    }
    
    // ASCII to char
    function ASCII2Char(v) { return String.fromCharCode(v); }
    
    // ASCII to string
    function ASCII2Str(Bin, StartByte, Type, MsgLen) {
        var MsgName = "";
        var Index = 0;
    
        while (Index < MsgLen) {
            var AsciiValue = TypedArrays(Type, Bin, StartByte, 1); StartByte += 1;
            if (AsciiValue != 0)
                MsgName += ASCII2Char(AsciiValue);
            else
                return MsgName;
            Index++;
        }
        return MsgName;
    }
    function byteToString(arr) {
        if (typeof arr === 'string') {
            return arr;
        }
        var str = '',
            _arr = arr;
        for (var i = 0; i < _arr.length; i++) {
            var one = _arr[i].toString(2),
                v = one.match(/^1+?(?=0)/);
            if (v && one.length == 8) {
                var bytesLength = v[0].length;
                var store = _arr[i].toString(2).slice(7 - bytesLength);
                for (var st = 1; st < bytesLength; st++) {
                    if (_arr.length > i + st) {
                        store += _arr[st + i].toString(2).slice(2);
                    } else {
                        store = '000000';
                    }
                }
                str += String.fromCharCode(parseInt(store, 2));
                i += bytesLength - 1;
            } else {
                str += String.fromCharCode(_arr[i]);
            }
        }
        return str;
    }
               
    //构建一个视图,把字节数组写到缓存中,索引从0开始,大端字节序
    function getView(bytes) {
        var view = new DataView(new ArrayBuffer(bytes.length));
        for (var i = 0; i < bytes.length; i++) {
            view.setUint8(i, bytes[i]);
        }
        return view;
    }
    
    function toString(bytes) {
        //var data = getView(bytes);
        return byteToString(bytes);
    }
    
    //对应数组,或单数结果
    function toBytes(bytes) {
        if (bytes.length > 1) {
            return bytes;
        } else {
            return bytes[0];
        }
    }
    //将字节数组转成有符号的8位整型,大端字节序
    function toInt8(bytes) {
        return getView(bytes).getInt8();
    }
    //将字节数组转成无符号的8位整型,大端字节序
    function toUint8(bytes) {
        return getView(bytes).getUint8();
    }
    //将字节数组转成有符号的16位整型,大端字节序
    function toInt16(bytes) {
        return new Int16Array(getView(bytes).buffer, 0, 1)[0]; 
    }
    //将字节数组转成无符号的16位整型,大端字节序
    function toUint16(bytes) {
        return new Uint16Array(getView(bytes).buffer, 0, 1)[0];
    }
    //将字节数组转成有符号的32位整型,大端字节序
    function toInt32(bytes) {
        return new Int32Array(getView(bytes).buffer, 0, 1)[0]; 
    }
    //将字节数组转成无符号的32位整型,大端字节序
    function toUint32(bytes) {
        return new Uint32Array(getView(bytes).buffer, 0, 1)[0]; 
    }
    //将字节数组转成有符号的64位整型,大端字节序
    function toInt64(bytes) {
        return new BigInt64Array(getView(bytes).buffer, 0, 1)[0];
    }
    //将字节数组转成有符号的64位整型,大端字节序
    function toUint64(bytes) {
        return new BigUint64Array(getView(bytes).buffer, 0, 1)[0];
    }
    //将字节数组转成32位浮点型,大端字节序
    function toFloat32(bytes) {
        return getView(bytes).getFloat32();
    }
    //将字节数组转成64位浮点型,大端字节序
    function toFloat64(bytes) {
        return new Float64Array(getView(bytes).buffer, 0, 1)[0]; 
    }
    //将数值写入到视图中,获得其字节数组,大端字节序
    function getUint8Array(len, setNum) {
        var buffer = new ArrayBuffer(len);  //指定字节长度
        setNum(new DataView(buffer));  //根据不同的类型调用不同的函数来写入数值
        return new Uint8Array(buffer); //创建一个字节数组,从缓存中拿取数据
    }
    //得到一个8位有符号整型的字节数组,大端字节序
    function getInt8Bytes(num) {
        return getUint8Array(1, function (view) { view.setInt8(0, num); })
    }
    //得到一个8位无符号整型的字节数组,大端字节序
    function getUint8Bytes(num) {
        return getUint8Array(1, function (view) { view.setUint8(0, num); })
    }
    //得到一个16位有符号整型的字节数组,大端字节序
    function getInt16Bytes(num) {
        return getUint8Array(2, function (view) { view.setInt16(0, num); })
    }
    //得到一个16位无符号整型的字节数组,大端字节序
    function getUint16Bytes(num) {
        return getUint8Array(2, function (view) { view.setUint16(0, num); })
    }
    //得到一个32位有符号整型的字节数组,大端字节序
    function getInt32Bytes(num) {
        return getUint8Array(4, function (view) { view.setInt32(0, num); })
    }
    //得到一个32位无符号整型的字节数组,大端字节序
    function getUint32Bytes(num) {
        return getUint8Array(4, function (view) { view.setUint32(0, num); })
    }
    //得到一个32位浮点型的字节数组,大端字节序
    function getFloat32Bytes(num) {
        return getUint8Array(4, function (view) { view.setFloat32(0, num); })
    }
    //得到一个64位浮点型的字节数组,大端字节序
    function getFloat64Bytes(num) {
        return getUint8Array(8, function (view) { view.setFloat64(0, num); })
    }
        
    

    使用步骤

    代码如下(示例):

    ByteToType(INT32_TYPE, [0,1,1,2], 0, 4); //转换类型 int32,源数据,取值下标,取几位
    

    总结

    提示:以上简单示例,仅为模板,大家可以有自己更好的思路哦。

    展开全文
  • buffer字节流的一般形式如下:<Buffer 66 00 68 00 71 00 77 00 68 00 67 00 61 00 64 00 73 00> buffer字节流一般由一系列十六进制数字组成,一个十六制数字占用一个字节,在unicode编码格式中,两个字节组成...

    buffer字节流的一般形式如下:<Buffer 66 00 68 00 71 00 77 00 68 00 67 00 61 00 64 00 73 00>
    buffer字节流一般由一系列十六进制数字组成,一个十六制数字占用一个字节,在unicode编码格式中,两个字节组成一个字。
    以下是解析buffer字节流的几种方法(默认编码格式是utf-8):
    1.buffer.toString()
    此方法的一般形式是buf.toString(),其中buf指被解析的字节流。在这里插入图片描述
    如上图的ASCII表所示,这种方法的原理是将字节流中的十六进制数值解析成“图形”的那一列中图形符号,所以常常会出现特殊的符号,感觉像乱码,如下所示:在这里插入图片描述
    2.string_decoder(字符串解码器)
    此方法的一般形式如下:

    const { StringDecoder } = require('string_decoder');
    const decoder = new StringDecoder('utf8');
    console.log(decoder.write(cent));
    

    上面代码中,cent变量表示被解析的字节流。
    这种方法的原理同第一种方法buffer.toString()。

    3.JSON.stringify(Buffer)
    这种方法是将每个字节对应的十六进制数字解析成相应的十进制数字,然后输出JSON格式的字符串对象。如下实例:要被解析的Buffer字节流为`

    <Buffer 66 00 68 00 71 00 77 00 68 00 67 00 61 00 64 00 73 00>
    

    在node.js中创建相应字节流格式如下:

    const bufTry=Buffer.from([0x66,0x00,0x68,0x00,0x71,0x00,0x77,0x00,0x68,0x00,0x67,0x00,0x61,0x00,0x64,0x00,0x73,0x00]);
    

    然后进行解析和输出,代码如下:

    const json_bufTry=JSON.stringify(bufTry);
    console.log(json_bufTry);
    

    输出结果如下图:
    在这里插入图片描述
    4.Buffer.readUIntBE(offset,byteLength).toString(16)+parseInt(str_buf,16)
    第三种方法已经可以把字节流的每个字节从十六进制解析成生活中常见的十进制了。但是,如果需要按多个字节的形式解析呢?即将字节流中任意多个十六进制数字合起来解析成常用见的十进制数字,这就需要用**Buffer.readUIntBE(offset,byteLength).toString(16)**这种方法了。其中offset指要解析的字节流的起始字节位置,byteLength指要解析的字节流的长度,这个长度大于0,小于等于6。这种方法可以从 buf 中指定的 offset 读取 byteLength 个字节,并将读取的值解析为二进制补码值,即将这1到6个字节长度的字节流抽取出来变成字符串,这里先把字节串称为一个变量str_buf。然后运用str_buf=parseInt(str_buf,16);这一行代码就可以把字符串str_buf转化成十进制数字了。下面是一个实例代码:

     const bufTry=Buffer.from([0x66,0x00,0x68,0x00,0x71,0x00,0x77,0x00,0x68,0x00,0x67,0x00,0x61,0x00,0x64,0x00,0x73,0x00]);//创建一个字节流
    let str_buf=bufTry.readUIntBE(6,2).toString(16);//切分字节流第6个字节开始的两个字节出来,并且转换成字符串形式
    str_buf=parseInt(str_buf,16); //将切分出来的字符串转化成常见的十进制数字
    console.log(str_buf);
    

    结果如下:
    在这里插入图片描述
    这样,就将第六个字节开始的后面两个字节从十六进制数字解析成了常见的十进制数字了。

    总结
    从上面四种方法可以看出,前面两种方法适合将Buffer字节流解析成ASCII符号,后面两种方法是十六进制Buffer字节流解析成生活中常见的十进制数字,而且最后一种方法更加灵活方便。

    展开全文
  • IO 字节流

    2019-08-21 14:20:14
    IO流 ...字节流: 二进制文件 (视频 音频 图片) 字符流: 文本文件 (html css js txt json xml java…) 综合上述: 流的框架 字节流 字节输入流 XXXInputStream 字节输出流 XXXOutputStream ...

    字节流

    IO流的概述: 本质就是 用来处理 数据的传输

    IO流的分类
    按照流向分:
    输入流: 从外界到内存
    输出流: 从内存到外界
    按照数据类型分类:
    字节流: 二进制文件 (视频 音频 图片)
    字符流: 文本文件 (html css js txt json xml java…)
    综合上述:
    流的框架
    字节流
    字节输入流
    XXXInputStream
    字节输出流
    XXXOutputStream
    字符流
    字符输入流
    XXXReader
    字符输出流
    XXXWriter

    需求: 向工程目录下 a.txt里面写入 HelloWorld
    数据源: 内存中的HelloWorld
    目的地: 工程目录下 a.txt
    交通工具: FileOutputStream
    void write(byte[] b)

    注意事项:
    1.FileNotFountException抛出异常的情况: a.父路径不存在 b.盘符不存在
    2.输出流如果文件不存在会自动创建
    3.写数据的时候会抛出 IOException
    4.Stream Closed 表示 流对象已经关闭,不能够再次使用

    public class IODemo01 {
    	public static void main(String[] args) throws IOException {
    		File f = new File("a.txt");
    		// 利用多态创建流对象
    		OutputStream os = new FileOutputStream(f);
    		String data = "HelloWorld";
    		byte[] bys = data.getBytes();
    		os.write(bys);
    		
    		os.close();//表示 流对象已经关闭,不能够再次使用
    		
    		os.write("abc".getBytes());//报错  流对象已经关闭,不能够再次使用
    	}
    }
    
    字节输出流 OutputStream
     void close() 
                     关闭此输出流并释放与此流有关的所有系统资源。 
     void flush() 
              刷新此输出流并强制写出所有缓冲的输出字节,针对字符流有效 
     void write(byte[] b) 
              将 b.length 个字节从指定的 byte 数组写入此输出流。 
     void write(byte[] b, int off, int len) 
              将指定 byte 数组中从偏移量 off 开始的 len 个字节写入此输出流。 
     abstract  void write(int b) 写一个字节
    
    public class IODemo01 {
    	public static void main(String[] args) throws Exception {
    		OutputStream os = new FileOutputStream("b.txt");
    		os.write("good".getBytes());
    		byte[] bys = {97,98,99,100};//a,b,c,d
    		os.write(bys, 1, 2);//
    		
    		os.write(100);
    		os.flush();//字符流不写flush可能会出现乱码  
    		os.close();
    		
    		/*Writer w = new FileWriter("w.txt");
    		w.write("good2");//先将数据写到内存再把数据到文件
    		// w.flush();//不写flush 文件就会卡再内存里 不显示出来
    		w.close();*///close是把数据统一刷到文件
    		
    	}
    }
    

    FileOutputStream(File file)
    创建一个向指定 File 对象表示的文件中写入数据的文件输出流。
    FileOutputStream(File file, boolean append)
    创建一个向指定 File 对象表示的文件中写入数据的文件输出流。
    FileOutputStream(String name)
    创建一个向具有指定名称的文件中写入数据的输出文件流。
    FileOutputStream(String name, boolean append)
    创建一个向具有指定 name 的文件中写入数据的输出文件流。

    注意:
    	1.追加写入到文件 使用  FileOutputStream(File file, boolean append) 
    	2.写入类似 换行符 这样的字符可能在不同的操作系统当中不适配
    			不同的操作系统针对换行符的识别不一样:
    					Windows \r\n
    					Linux \n
    					Max \r
    			目前我们不是不能够解决,只不过解决非常麻烦,不满足开闭原则,所以字节流在处理字符方面不方便,后期字符流改进
    			记住字节流是万能流,能够处理一切文件的传输,但是在处理文本文件的时候有的时候不方便,所以需要学习字符流
    
    public class IODemo02 {
    	public static void main(String[] args) throws Exception {
    		// 需求: 向文件中写入 10句HelloWorld
    		OutputStream os = new FileOutputStream("os.txt", true);
    		
    		for (int i = 1; i <= 10; i++) {
    			os.write(("HelloWorld" + i).getBytes());
    			os.write("\n".getBytes());//这里打印换行只在自身创建的文件中换行,在外部纯记事本中不换行
    			os.flush();
    		}
    		
    		os.close();
    	}
    }
    //
    
    /*
     * 结合异常处理的 IO流标准写法
     * JDK1.7之后引入的一种新的异常简化处理方式
     */
    public class IODemo03 {
    	public static void main(String[] args) {
    		System.out.println("Start");
    		// OutputStream os = null;
    		/*try {
    			os = new FileOutputStream("aaa/bbb/io.txt");
    			os.write("HelloWorld".getBytes());
    		} catch (FileNotFoundException e) {
    			e.printStackTrace();
    		} catch (IOException e) {
    			e.printStackTrace();
    		} finally {
    			if (os != null) {
    				try {
    					os.close();
    				} catch (IOException e) {
    					e.printStackTrace();
    				}
    			}
    		}*/
    		// JDK1.7之后引入的一种新的异常简化处理方式
    		try (OutputStream os = new FileOutputStream("aaa/bbb/io.txt");
    			/*Scanner input = new Scanner(System.in);*/
    				){
    			os.write("HelloWorld".getBytes());
    		} catch (FileNotFoundException e) {
    			e.printStackTrace();
    		} catch (IOException e) {
    			e.printStackTrace();
    		} catch (Exception e) {
    			e.printStackTrace();
    		}
    		System.out.println("Over");
    		
    		
    	}
    }
    
    字节输入流 InputStream

    方法摘要
    int available()
    返回此输入流下一个方法调用可以不受阻塞地从此输入流读取(或跳过)的估计字节数。
    void close()
    关闭此输入流并释放与该流关联的所有系统资源。
    void mark(int readlimit)
    在此输入流中标记当前的位置。
    boolean markSupported()
    测试此输入流是否支持 mark 和 reset 方法。
    abstract int read()
    从输入流中读取数据的下一个字节。
    特点:
    1.表示一次性读取一个字节
    2.每读取一个字节,那么返回的实际读取的内容
    3.读取一个字节完毕,会自动等待读取下一个字节,类似迭代器的 cursor
    4.读取到文件末尾返回 -1
    int read(byte[] b)
    从输入流中读取一定数量的字节,并将其存储在缓冲区数组 b 中。
    int read(byte[] b, int off, int len)
    将输入流中最多 len 个数据字节读入 byte 数组。
    void reset()
    将此流重新定位到最后一次对此输入流调用 mark 方法时的位置。
    long skip(long n)
    跳过和丢弃此输入流中数据的 n 个字节。

    需求: 读取文件 is.txt 的内容 显示到控制台
    数据源: 文件 is.txt
    目的地: 控制台
    交通工具: 文件 -> 内存 输入流 FileInputStream
    内存 -> 文件 输出流 PrintStream

    注意:
    1.输出流如果文件不存在会自动创建,但是输入流文件必须存在,否则会抛出 FileNotFoundException
    2.一次读取一个字节 ,如果中间认为对每个字节做了强制类型转换,可能会导致乱码

    public class IODemo04 {
    	public static void main(String[] args) throws Exception {
    		InputStream is = new FileInputStream("is.txt");
    //		int by = is.read();//每读一次索引就会完后移一次
    //		System.out.println((char)by);
    		
    		/*while (by != -1) {
    			System.out.print((char)by);
    			by = is.read();
    		}*/
    		System.out.println(Arrays.toString("中国".getBytes())); // [-42, -48, -71, -6]
    		int by = 0;
    		while ((by = is.read()) != -1) {
    			System.out.print((char)by); 
    		}
    	}
    }
    
    /*
     * 一次性读取一个字节数组
     * int read(byte[] b) 
     *	          从输入流中读取一定数量的字节,并将其存储在缓冲区数组 b 中。
     *
     *		1.一次性从外界读取一个字节数组的内容
     * 		2.每读取一次,返回实际读取的长度
     * 		3.读取到文件末尾返回 -1
     * 		4.每读取一次,指针向后移动一个字节数组的单位
     * 	
     * 注意: 虽然扩大了每次读取的范围,但是乱码现象依然存在,所以字节流读取一个字节或者字节数组,但是
     * GBK或者UTF-8编码表中一个中文占 2个或者3个字节,肯定有可能乱码,所以字节流处理中文不是不可以,
     * 而是不方便,字节流是万能流,但是处理字节不方便,不方便的原因是 我们人为的转换过。
     * 如果能够有一种流能够一次性读取一个字符,那么这个问题就能够得以解决,它就是字符流
     */
    public class IODemo05 {
    	public static void main(String[] args) throws Exception {
    		InputStream is = new FileInputStream("src/com/sxt/bytestreamdemo/IODemo05.java");
    		
    		/*byte[] bys = new byte[5];
    		int len = is.read(bys);
    		System.out.print(new String(bys, 0, len)); // Hello
    		// System.out.println(len); // 5
    		
    		len = is.read(bys);
    		System.out.print(new String(new String(bys, 0, len))); // Wor
    		// System.out.println(len); // 5
    		
    		len = is.read(bys);
    		System.out.print(new String(new String(bys, 0, len))); // l d \r \n X  [108, 100, 13, 10, 88]
    		// System.out.println(len); // 5 
    		
    		len = is.read(bys);
    		System.out.print(new String(new String(bys, 0, len))); // y r \r \n X
    		// System.out.println(len); // 2
    		
    		len = is.read(bys);
    		System.out.print(new String(new String(bys, 0, len))); // y r \r \n X
    		// System.out.println(len); // 2
    		
    		len = is.read(bys);
    		System.out.print(new String(new String(bys, 0, len))); // y r \r \n X
    		// System.out.println(len); // 2
    */		
    		byte[] bys = new byte[1024];
    		int len = 0;
    		while ((len = is.read(bys)) != -1) {
    			System.out.print(new String(new String(bys, 0, len)));
    		}
    	}
    }
    
    /*
     * 字节输入流 + 字节输出流 拷贝文件
     * 
     * IODemo06.java --> test.txt
     * 数据源: IODemo06.java
     * 目的地: test.txt
     * 交通工具: 
     * 		文件 -> 内存  FileInputStream
     * 		内存 -> 文件 FileOutputStream
     * 拷贝方式: 
     * 		1.一次性拷贝一个字节
     * 		2.一次性拷贝一个字节数组
     */
    public class IODemo06 {
    	public static void main(String[] args) {
    		// copy("IODemo06.java", "test.txt");
    		long start = System.currentTimeMillis();
    		// copy(new File("01.字节输入流一次性读取一个字节.mp4"), new File("a.mp4"), 8092);
    		copy("IODemo06.java", "test.txt");
    		long end = System.currentTimeMillis();
    		System.out.println("本次拷贝耗时: " + (end - start) + "毫秒");
    	}
    	
    	/*
    	 * 功能: 一次性拷贝一个字节拷贝文件
    	 * 返回值类型 : void
    	 * 参数列表: String srcFileName, String descFileName
    	 * 方法名: copy
    	 */
    	public static void copy(String srcFileName, String descFileName) {
    		FileInputStream fis = null;
    		FileOutputStream fos = null;
    		try {
    			fis = new FileInputStream(srcFileName);
    			fos = new FileOutputStream(descFileName);
    			
    			int by = 0;
    			while ((by = fis.read()) != -1) {
    				fos.write(by);
    				fos.flush();
    			}
    		} catch (FileNotFoundException e) {
    			e.printStackTrace();
    		} catch (IOException e) {
    			e.printStackTrace();
    		} catch (Exception e) {
    			e.printStackTrace();
    		} finally {
    			if (fis != null) {
    				try {
    					fis.close();
    				} catch (IOException e) {
    					// TODO Auto-generated catch block
    					e.printStackTrace();
    				}
    			}
    			
    			if (fos != null) {
    				try {
    					fos.close();
    				} catch (IOException e) {
    					// TODO Auto-generated catch block
    					e.printStackTrace();
    				}
    			}
    		}
    		
    	}
    	
    	/*
    	 * 功能: 一次性拷贝一个字节数组拷贝文件
    	 * 返回值类型 : void
    	 * 参数列表: File srcFile, File descFile
    	 * 方法名: copy
    	 */
    	public static void copy(File srcFile, File descFile, int capacity) {
    		try (FileInputStream fis = new FileInputStream(srcFile);
    				FileOutputStream fos = new FileOutputStream(descFile);) {
    			byte[] bys = new byte[capacity];
    			int len = 0;
    			
    			while ((len = fis.read(bys)) != -1) {
    				fos.write(bys, 0, len);
    				fos.flush();
    			}
    		} catch (FileNotFoundException e) {
    			e.printStackTrace();
    		} catch (IOException e) {
    			e.printStackTrace();
    		} catch (Exception e) {
    			e.printStackTrace();
    		} 
    	} 
    }
    
    展开全文
  • 防抖字节流 js

    2021-03-13 16:50:36
    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta ...meta name="viewport" content="width=device-width, initial-scale=1.0">...D.
    <!DOCTYPE html>
    <html lang="en">
    
    <head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Document</title>
    </head>
    
    <body>
        <input type="text" id="input">
    </body>
    <script>
        var input = document.querySelector('input')
    
        function debounce(delay) {
            let timer
                //闭包
            return function(value) {
                clearTimeout(timer)
                    // 我们想清楚setTimeout 我们应该存储这个timer变量,timer 变量要一直保存在内存中
                    // 既然你不想打印之前已存储的结果,清楚之前的定时器
                    // 我们存储这个timer变量, 一直在内存, 内寻泄露
                    // 使用闭包,函数中return 函数
                timer = setTimeout(function() {
                    console.log(value)
                }, delay)
            }
        }
        var debounceFun = debounce(1000)
        input.addEventListener('keyup', function(e) {
            debounceFun(e.target.value)
        })
    </script>
    
    </html>

     

    展开全文
  • HTML5 enable you to store data locally which I think it is great. For example here is how you can use it:var store = window.localStorage;store.setItem('foo', "hellow world");var test = store.getItem('...
  • 字节流、字符流

    2020-05-25 23:39:06
    字节流、字符流】 主要内容 IO流 字节流 字符流 异常处理 Properties 能够说出IO流的分类和功能 能够使用字节输出流写出数据到文件 能够使用字节输入流读取数据到程序 能够理解读取数据read(byte[])方法的...
  • 32.字节流

    2020-08-16 15:06:30
    字节流 字节流字节读写 字节流内容和字符流其实差不多 就是主要用来传输文本以外的文件 package JAVA.JAVASE.IO流.字节流; import java.io.File; import java.io.FileInputStream; import java.io....
  • 字节流和字符流

    2020-04-26 21:45:49
     在程序中所有的数据都是以流的方式进行传输或保存的,程序需要数据的时候要使用输入流读取数据,而当程序需要将一些数据保存起来的时候,就要使用输出...在字节流中输出数据主要是使用OutputStream完成,输入使...
  • websocket进行通讯时,可以选择采用字符串或者字节流的传输模式。但在发送与接收时,需要考虑数据的分包,即分成一个个请求与响应消息。无论是采用哪种传输模式,都不免要遇到这个问题。 采用字符串传输时,接收端...
  • 转载自:... Javascript网络编程常用的两种方式 短连接xmlhttprequest 长连接websocket 都需要考虑安全性 以下总结两个项目中所使用的相关技术 ..."arraybuffer"(二进制字节流) 服务.
  • 写了个网页版贪吃蛇,需要在前端接受后端传过来的字节流然后显示,谷歌上搜了一下,最后的代码如下,并且简单做下讲解。 socket.onmessage = function(msg) { var bytes = new Uint8Array(msg.data); var blob = ...
  • Java 字节流与字符流

    2017-10-16 11:02:04
    你可能听过不少关于字节流与字符流对比的介绍,不过严格地说,我认为把“字节流”和“字符流”去对比这种说法不是特别妥当,为什么呢? 首先,这两种流实际上处在不同的层次,字节流是基础,而字符流是构建在
  • 一开始没明白直接用了对字节流进行了md5加密,后面在java里面把这段代码运行了一遍才发现md5加密后仍然是字节流,然后在md5中找到了这个 md5.digest(''); // [212, 29, 140, 217, 143, 0, 178, 4, 233, 128, 9, 152,...
  • 字节输出(OutputStream) java.io.OutputStream抽象类是表示字节输出的所有类的超类,注意该类是个抽象类 子类共性的成员方法 1、public void close()方法 作用:关闭输出并释放与此相关联的任何系统资源 2...
  • 500字节JavaScript流库 下载 关于 Stream.js是一个添加数组的库。 这些Streams可以在所有浏览器中使用,甚至可以追溯到IE7。 它们非常快,并且可以支持多种功能。 除了这种兼容性之外,它还支持新的ES6箭头语法...
  • 那data这么一大串字节流怎么解析成图片呢。。 <p style="text-align:center"><img alt="" src="https://img-ask.csdnimg.cn/upload/1622737147308.png" /></p> <p style="text-align:center"><img alt="" src=...
  • 前端读取字节流

    2021-04-26 17:48:16
    开始没事写博客了 要从服务端获取一堆字节数据流,假设为一张图片字节资源很多:为get请求且无自定义header等,直接在图片 img src attribute携带uri...这个时候就需要用到JavaScript提供的字节流操作api。 先介绍一.
  • 查看了protobuf的源码,看到了writeFloat方法中的writeTagAndRawLittleEndian32,然后顺便了解了下LittleEndian, ...原来是小端和大段的原因,刚好js也需要把字节流反过来读才行,所以把读取顺序按照小端来读就OK了
  • 一般涉及到了框架底层开发, 必然需要与二进制流打交道, 也就是字节流 一 字节处理关键技术 1.1 js 字节处理 ArrayBuffer 相当于 byte[],但是是只读的 如果要操作ArrayBuffer ,通常 new Uint8Array(ArrayBuffer )...
  • js发送和接收二进制字节流数据

    万次阅读 2018-09-25 15:58:42
    发送二进制数据 var oReq = new XMLHttpRequest(); oReq.open(&quot;POST&quot;, url, true); oReq.onload = function (oEvent) { ...var blob = new Blob(['abc123'], {type: 'text/plain'});...
  • C# 返回图片的字节流byte[]

    千次阅读 2015-06-17 08:09:33
    #region 返回图片的字节流byte[] /// /// 返回图片的字节流byte[] /// /// /// /// public static byte[] getImageByte(string imagePath, WebClient webClient)

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 60,230
精华内容 24,092
关键字:

JS字节流