typescript Switch语句和等效的if else循环总是返回错误的值

wbrvyc0a  于 2023-06-24  发布在  TypeScript
关注(0)|答案(2)|浏览(108)

我目前正在尝试在使用Angular框架的不同文件类型的文档旁边显示一个不同的图标。然而,无论我将什么文件类型设置为fileExtension,例如txt或jpg,它总是返回默认值file-text作为iconType。

public getIcon(document: Document): string {
        let mimeType = document.fileType;
        let fileExtension = mimeType.split('.')[1];
        let iconType = '';

        switch (fileExtension) {
            case fileExtension === 'jpeg' || 'gif' || 'png' || 'svg' || 'xml'  || 'bmp' || 'jpg'|| 'tif' || 'tiff':
                iconType = 'picture';
                break;
            case fileExtension === 'avi' || 'mpg' || 'wmv' || 'mpeg' || 'mp4' || 'mov':
                iconType = 'video-folder';
                break;
            case fileExtension === 'cda' || 'mp3' || 'mpa' || 'wav' || 'wma':
                iconType = 'volume';
                break;
            case fileExtension === 'pdf' || 'ai' || 'pptx':
                iconType = 'article';
                break;
            default:
                //includes: .docx , .odt, .rtf, .txt, .xml, .xps
                iconType = 'file-text';
                break;
        }
        console.log(iconType);
        return iconType;
    }

如果我尝试调试,我可以看到尽管fileExtension的值是“jpg”,但它返回默认的图标类型“file-text”。Image of debugging with breakpoints
我还尝试使用一个简单的if else循环等价物,但当我这样做时,它似乎总是返回所有的第一个if case值(例如:图片即使当fileExtension =“txt”):

if (fileExtension === 'jpeg' || 'gif' || 'png' || 'svg' || 'xml' || 'bmp' || 'jpg' || 'tif' || 'tiff') {
            iconType = 'picture';
        } else if (fileExtension === 'avi' || 'mpg' || 'wmv' || 'mpeg' || 'mp4' || 'mov') {
            iconType = 'video-folder';
        } else if (fileExtension === 'cda' || 'mp3' || 'mpa' || 'wav' || 'wma') {
            iconType = 'volume';
        } else if (fileExtension === 'pdf' || 'ai' || 'pptx') {
            iconType = 'article';
        } else {
            iconType = 'file-text';
        }
        console.log(iconType);
        return iconType;

我真的很困惑,为什么它不去适当的情况。任何帮助将不胜感激!

0qx6xfy6

0qx6xfy61#

每次都需要在if语句中重述条件检查的左侧;或在交换机中为每个文件扩展名类型设置单独的大小写。

if(fileExtension === “jpg” || fileExtension === “png” …) {…}

如果您感兴趣,这里还有一些其他选择:
将每种图片类型包含在数组中,并检查该值是否包含在数组中:

pictureFileExtensions = [“jpg”, “gif”, …]
videoFileExtensions = […]

If (pictureFileExtension.includes(fileExtension)){
        iconType = “picture”
    } else if (videoFileExtension.includes(fileExtension)){
        iconType = “video”
    } else if …

创建一个对象,以文件扩展名为键,以图标类型为值:

const iconTypes = {jpg: “picture”, avi: “video”, …}

iconType = iconType[fileExtension]
hzbexzde

hzbexzde2#

你用错了开关盒。以下是正确的语法:

switch (fileExtension) {
        case 'jpeg':
        case 'gif':
        case 'png':
        case 'svg':
        case 'xml':
        case 'bmp':
        case 'jpg':
        case 'tif':
        case 'tiff':
            iconType = 'picture';
            break;
        case 'avi':
        case 'mpg':
        case 'wmv':
        case 'mpeg':
        case 'mp4':
        case 'mov':
            iconType = 'video-folder';
            break;
        case 'cda':
        case 'mp3':
        case 'mpa':
        case 'wav':
        case 'wma':
            iconType = 'volume';
            break;
        case 'pdf':
        case 'ai':
        case 'pptx':
            iconType = 'article';
            break;
        default:
            //includes: .docx , .odt, .rtf, .txt, .xml, .xps
            iconType = 'file-text';
            break;
    }

相关问题