FileReader.onload 回调中才能安全访问 result，因其异步特性导致调用 readAsText() 后立即读取 result 为 null；应使用普通函数绑定 this.result，避免箭头函数；读文本时需匹配文件编码，推荐 Promise 封装复用。
FileReader.onload 回调里拿不到 result 是因为没等读完就访问了
直接在 readAsText() 或 readAsArrayBuffer() 调用后立刻读 reader.result，值一定是 null。FileReader 是异步的，result 只在 onload 触发时才被赋值。
正确做法是把所有依赖文件内容的逻辑全部放进 onload 回调里，而不是写在它外面：
const reader = new FileReader();
reader.onload = function() {
// ✅ 此时 this.result / reader.result 才有值
console.log(this.result); // 比如文本内容
};
reader.readAsText(file); // ⚠️ 不要在这行后面直接读 result
用 this 还是 reader 访问 result？优先用 this
onload 回调中，this 指向当前 FileReader 实例，和声明的变量名无关。如果用箭头函数，this 会丢失，导致 this.result 是 undefined。
- ✅ 推荐：普通函数，用
this.result（语义清晰、不依赖变量名） - ⚠️ 可用但冗余：用
reader.result（前提是reader在作用域内且未被重赋值） - ❌ 错误：箭头函数 +
this.result（this指向外层上下文）
const reader = new FileReader();
// ✅ 普通函数
reader.onload = function() {
const data = this.result; // 安全可靠
};
// ❌ 箭头函数 + this
reader.onload = () => {
const data = this.result; // this 不是 FileReader！
onload 触发但 result 是空字符串或 undefined 的常见原因
不是所有读取方式都产出可读字符串：readAsDataURL() 返回 base64 字符串，readAsArrayBuffer() 返回 ArrayBuffer，而 readAsText() 默认按 UTF-8 解码——如果文件编码不是 UTF-8（比如 GBK），就会解码失败，result 可能为空或乱码。
Wechat Article Html
下载
将 Markdown 文章转换为微信公众号兼容的纯 HTML 格式。当用户要求"转成微信格式"、"生成公众号文章 HTML"、"排版到微信草稿箱"、"微信粘贴格式"时触发。输出带内联样式的纯 HTML，微信编辑器可直接渲染，无需额外适配。支持标题、段落、列表、粗体、行内代码、表格、引用块、代码块、配图的完整转换。
立即学习“前端免费学习笔记（深入）”；
- 确认读取方式匹配预期数据类型：文本用
readAsText()，二进制用readAsArrayBuffer() - 读文本时显式指定编码：
reader.readAsText(file, 'GBK')（注意：部分浏览器对非 UTF-8 编码支持有限） - 检查
file是否有效：file.size > 0且file.type合理 - 避免重复调用
readAsXxx()：后一次会中止前一次，导致前一个onload不触发
想在多个地方用 result？别存全局变量，用 Promise 封装更可控
把 FileReader 包进 Promise，能自然衔接 async/await，也避免竞态和变量污染。这是现代代码里最稳妥的复用方式。
function readFileAsText(file) {
return new Promise((resolve, reject) => {
const reader = new FileReader();
reader.onload = () => resolve(reader.result);
reader.onerror = () => reject(reader.error);
reader.readAsText(file);
});
}
// 使用
async function handleFile(file) {
try {
const content = await readFileAsText(file);
processText(content); // ✅ 这里 content 肯定有值
} catch (err) {
console.error('读取失败', err);
}
}
真正容易被忽略的是：FileReader 实例不能复用。每次读新文件，必须新建一个实例；否则 onload 可能不触发，或触发旧回调。别图省事反复 reader.readAsText(newFile)。
