共计 2067 个字符，预计需要花费 6 分钟才能阅读完成。
1 window.URL 是干嘛的？
window 对象的 URL 对象是专门用来将 blob 或者 file 读取成一个 url 的。
window.URL.createObjectURL(file / blob)
这个 url 可以用在 html 的任何可以使用 url 的地方，比如 img 的 src ; audio/video 的 src 和 source 标签等。所有能在浏览器中显示的图片、音频、视频等都是可以用 url 转换成一个 url 对象的，这个对象一旦被 src 引用，就会显示出来。
那么这些 file 或者 blob 来自于哪里呢？可以是在本地硬盘中通过 <input type=’file’> 选择的文件，也可以是通过 ajax 请求后某个不知名的服务器请求到内存的。
问题：如果一个 img 标签的 src 属性是一个 excel 文件转换成的 url 对象，那会发生什么？
我想 img 肯定将它读不出来，因为会 img 标签会检测文件类型。
2.URL 构造函数将普通 url 转换成 URL 对象
除了可以将一个文件或者 blob 转化成一个 Url 对象，还可以将一个 url 字符串转换成一个 URL 对象
// https://cn.bing.com?id=123
var parsedUrl = new URL(‘https://cn.bing.com?id=123v’);
console.log(‘parsedUrl’ , parsedUrl, parsedUrl.searchParams.get(“id”)); // 123
console.log(‘parsedUrl’ , parsedUrl.toString(), parsedUrl.searchParams.set(“name” , ‘alexandra’)); // https://cn.bing.com/?id=123v&name=alexandra
searchParams 属性返回一个 URLSearchParams 对象，这样就可以对 url 对象中的参数进行遍历或者其他操作
var urlSearchParams = URL.searchParams;
3.URL 实例对象的 toString() 方法
URL 的 toString() 方法可以将 URL 转换成 url 字符串，且:
URL.toString() === URL.href
// http://www.example.com/démonstration.html
let url = new URL(‘http://www.example.com/démonstration.html’)
let test = url.toString() === url.href;
console.log(‘url.href’, url.href, ‘url.toString()’ , url.toString() , ‘test’ , test);
// url.href http://www.example.com/d%C3%A9monstration.html url.toString() http://www.example.com/d%C3%A9monstration.html test true
https://developer.mozilla.org…
4.URL 对象静态方法 createObjectURL(object)
URL.createObjectURL(object) 是 URL 对象的静态方法，用于创建一个 DOMString（is a UTF-16 string），其实就是返回了一个在内存中指向传入参数 object 的引用路径 url 字符串。生成的这个 url 字符串会在当前页面的 document 被销毁的时候失效。
objectURL = URL.createObjectURL(object);
object
A File, Blob or MediaSource object to create an object URL for.
return
A DOMString containing an object URL that can be used to reference the contents of the specified source object.
https://developer.mozilla.org…
5.URL 对象静态方法 revokeObjectURL(objectURL)
URL 对象的静态方法 revokeObjectURL() 用于销毁之前通过 URL.createObjectURL(object) 方法创建的 url。一旦调用这个方法就表示告诉浏览器不再保存之前被创建的那个 url 了。在 revokeObjectURL(objectURL) 之后，再次使用该 url，会报错，因为该 url 已经被销毁，无法使用了。
window.URL.revokeObjectURL(objectURL);
objectURL
A DOMString representing a object URL that was previously created by calling createObjectURL().
return
ubdefined
https://developer.mozilla.org…