首页 > 其他分享 >查漏补缺3

查漏补缺3

时间:2023-09-21 15:59:47浏览次数:31  
标签:文件 查漏 const reader 文件夹 let 补缺 new

多个标签页之前的通信

method1: 

在页面中打开pagex: window.open('./pageX.html', '__blank'),但是有只想做到第一次打开新页面,而后每次通信都是 与同一个pageX 通信 ,而不是每次都打开一个新页面

其实第二个参数  就可以取个名字 window.open('./pageX.html', 'pageA',), 这样子就可以实现第一次打开,后面执行就只会刷新这个页面。

method2:

使用广播的形式:

前提是:

1 同源标签页  也就是 前面的域名一致 localhost:xxxx

2.公用同一个广播频道、通道pageB

tabPage1:

const channel = new BroadcastChannel('pageB');

click() {

channel.postMessage('')  // 发送广播消息

}

tabPage2(receive):

const channel = new BroadcastChannel('pageB');

channel.addEventListener('message', (e) => {

let recMessage = e.data  // 绑定监听消息事件, 接收到的消息在e.data中!!!

})

并发任务的控制!!![待续]

function  timeout (time) {

return new Promise((resolve, reject) => {

setTimeout(() => {

  reject()

}, time)

})

}

 

现代浏览器访问用户本地文件夹!!!

【这里需要补充一个知识点,就是涉及到IO操作,都是异步的】

目前现代浏览器可以使用  showDirectoryPicker();  这个api 来弹出选择用户本地文件夹的功能, 会提示用户需要访问一些信息,同意后浏览器就可以获取到本地文件夹的信息了

showDirectoryPicker 这个方法返回的是一个promise 对象, 也就是这个操作是异步的。

 

let handle = await showDirectoryPicker() ;//  得到一个句柄  错误处理就先忽略。

handle.children = []

let  iterator = handle.entries();  // 得到一个 异步接迭代器 ,就可以使用for of 循环拿到文件和子文件夹 文件

for await (const info of iterator) {

  //  然后就可以判断是文件还是子文件  info.kind  == ‘file’ || 'directory'

  如果是子文件 就直接 放入 handle.children

  如果 是子文件夹, 那么递归继续判断。

}

 

如果是文件, 比如 html  如何得到文件内容?

如果是文件: 

可以使用let f = await file.getFile(); 这个方法得到文件内容, 返回结果就和上传按钮的File对象是一样的数据类型了。

const reader = new FileReader()

reader.readAsXXX 等方法 

这里就使用  reader.readASText(f, 'utf-8');

reader.onload = (e) => {console.log(e.target.result)}

至于如果是代码  ,高亮代码 可以使用 highlight.js  这个库实现

 


 


 


 

ts 中 never 类型的一个作用

 

如果后续修改 method 的类型, 系统就一下可以提示到这里需要添加分支。

 


 


 


 

 

 

 

 

 

 

标签:文件,查漏,const,reader,文件夹,let,补缺,new
From: https://www.cnblogs.com/Hijacku/p/17720113.html

相关文章

  • 查漏补缺2
    flex布局默认的align-items是stretch ,所以flex-direction:column时,所有的元素时等宽,而rows,元素就是等高【默认】,就会产生popper层关闭的bug!!!vertical-align:middle 依据:alignsrhemiddleoftheelementwiththebaselineplus half thex-heightofth......
  • 查漏补缺7运算符
    1.a&b:&叫逻辑与:规则:当a和b同时为true,则结果为true,否则为false。2.a&&b:&&叫短路与:规则:当a和b同时为true,则结果为true,否则为false。3.a|b:|叫逻辑或,规则:当a和b,有一个为true,则结果为true,否则为false。4.a||b:||叫短路或,规则:当a......
  • 查漏补缺6
    1.++i先自增后赋值,i++先赋值后自增。2.整数除法只保留整数,i+=1在值上等价于i=i+1。3.关系运算符的结果都是boolean型,也就是要么是true,要么是false。4.比较运算符"=="不能误写成"="。5.逻辑运算符用于连接多个条件(多个关系表达式),最终的结果也是一个boolean值......
  • 7月12日面试查漏补缺
    1.巩固mysql的B+树优势,以及mysql究竟在哪里处理数据。MySQL既可以在磁盘中处理数据,也可以将数据加载到内存中进行处理,这取决于具体的配置和使用情况。通常情况下,MySQL会将热数据(经常被访问的数据)加载到内存中进行处理,而把冷数据(不经常被访问的数据)保留在磁盘上。这可以提高查询效......
  • 记一次服务器排查漏洞
    记一次服务器排查漏洞最近需要在客户现场部署app后端项目,需要将服务器并过去,但客户扫描后发现我们服务器还有一些信息级别的漏洞,要求我们清空了才能并过去,本来是安排运维来干的,但不知啥原因,leader扔我头上了,还pua我说技术啥都需要知道,所以记录一下几个简单漏洞的解决方案HTTP横......
  • 【Python查漏补缺(一)】闭包和装饰器
    闭包的构成条件:在函数嵌套(函数里面再定义函数)的前提下内部函数使用了外部函数的变量(还包括外部函数的参数)外部函数返回了内部函数简单闭包deffun_out(num1):  #定义外部函数  deffun_inner(num2):    #内部函数使用了外部函数的变量  ......
  • 【Python查漏补缺(二)】正则表达式与深浅拷贝
    在开始正题之前讲一下打开文件的另一种方式。之前打开文件的方式f=open("文件路径","文件打开方式",encoding="utf8")模式描述r以只读方式打开文件。文件的指针将会放在文件的开头。这是默认模式。rb以二进制格式打开一个文件用于只读。文件指针将会放在文件的开......
  • 【Java查漏补缺(一)】数组与循环
    除了数组与循环,还有方法,讲究看吧!后续练习内容都是连贯的!BasicalJava看下Java中的变量类型吧!数据类型关键字内存占用二进制位数字节型byte1个字节4位短整型short2个字节8位整型int(常用)4个字节32位长整型long8个字节64位单精度浮点数float......
  • C温故补缺(十七):动态链接(ELF,PIC,GOT,PLT)
    动态链接(PIC,GOT,PLT,ELF)参考:51CTO通过静态链接,可以生成一个可执行文件,这个可执行文件既可以是完全链接的也可以是部分链接的,对于部分链接的可执行文件,有些符号引用需要等到可执行文件加载时甚至是运行时才会进行符号解析和重定位。动态链接与静态链接一样包括符号解析和重......
  • C++温故补缺(二十):杂项补充1
    杂记1布尔型c语言中表示布尔型一般用0/1,或者flag,c++把布尔型内置了,布尔型的变量只有true和false两个值和0/1的关系:true和false不是0/1,c++编译器会把非0处理成true,把0处理成false宽字符型char型只有一个字节的长度,如果要在c中表示汉字,则需要使用字符串数组c++添加......