查漏补缺3

多个标签页之前的通信：

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 的类型， 系统就一下可以提示到这里需要添加分支。

 

---

 

---

 

---