如何用Javascript以可读格式显示文件大小

• readableFileSize 函数
• 默认值
• 检查空大小
• 转换为KB或MB
• 使用示例
• 结论

在处理文件时,以用户易于理解的格式显示文件大小通常很有好处。默认情况下,文件大小以字节为单位给出,这可能会让大多数用户感到困惑。为了使文件大小更易读,我们可以将其转换为KB或MB等易于理解的格式。

readableFileSize 函数

将文件大小转换为易于理解格式的一种方法是开发一个函数,该函数接受一个数值作为输入,表示以字节为单位的文件大小。然后,该函数根据文件的大小将文件大小转换为KB或MB。最后,函数生成文件大小的文本表示,以KB或MB为单位。

以下是 readableFileSize 函数的实现:

export function readableFileSize(attachmentSize) {  
  const DEFAULT_SIZE = 0;
  const fileSize = attachmentSize ?? DEFAULT_SIZE;

  if (!fileSize) {
    return `${DEFAULT_SIZE} kb`;  
  }

  const sizeInKb = fileSize / 1024;

  if (sizeInKb > 1024) {
    return `${(sizeInKb / 1024).toFixed(2)} mb`;
  } else {
    return `${sizeInKb.toFixed(2)} kb`;
  }
}

现在让我们剖析函数的实现,检查其内部工作原理。

默认值

函数首先为文件大小分配一个默认值。如果 attachmentSize 参数是 undefined,则使用0字节的默认大小。这是通过使用nullish合并运算符(??)实现的,如果左侧操作数为null或undefined,则返回右侧操作数。

const DEFAULT_SIZE = 0;
const fileSize = attachmentSize ?? DEFAULT_SIZE;

检查空大小

接下来,函数检查文件大小是否为0或 undefined。如果文件大小为0或 undefined,则返回以KB为单位的默认大小。

if (!fileSize) {
  return `${DEFAULT_SIZE} kb`;
}

转换为KB或MB

然后,函数根据文件的大小将文件大小调整为KB或MB。如果文件大小小于或等于1024 KB,则返回以KB为单位的文件大小。否则,文件大小将转换为MB并以该格式返回。

const sizeInKb = fileSize / 1024;

if (sizeInKb > 1024) {  
  return `${(sizeInKb / 1024).toFixed(2)} mb`;
} else {
  return `${sizeInKb.toFixed(2)} kb`;  
}

要将文件大小转换为KB,函数将文件大小除以1024。如果文件大小超过1024 KB(即1 MB或更多),则将文件大小再除以1024以转换为MB。toFixed 方法将文件大小四舍五入到小数点后两位。

使用示例

下面是使用 readableFileSize 函数的示例:

const fileSizeInBytes = 256640;
const fileSize = readableFileSize(fileSizeInBytes); // 输出: "250.31 kb"

在这个例子中,以字节为单位的文件大小(256640)被传递给 readableFileSize 函数,该函数返回以KB为单位的文件大小的字符串表示(250.31 kb)。

结论

readableFileSize 函数是一个简单但实用的实用程序函数,用于将文件大小转换为更易读的格式。通过以KB或MB显示文件大小,用户可以更轻松地掌握他们正在处理的数据量。在处理大文件时,这尤其有帮助,因为以字节为单位的文件大小可能难以理解。