javascript - if 语句中的函数仅在第一次时未定义，但在休息时间函数调用也未定义

Question

我尝试在使用 ng-upload 之前检查文件扩展名，但在检查文件是否无错误的正常情况下，我尝试添加我的函数。 发生了一些非常奇怪的事情。我第一次尝试上传时收到此错误:

ReferenceError: extension_check is not defined at application-9d9dfe26d056c7fe9da969ebdf1e1f7f.js:76141 at Object.forEach (application-9d9dfe26d056c7fe9da969ebdf1e1f7f.js:26353) at Scope.$scope.uploadFiles (application-9d9dfe26d056c7fe9da969ebdf1e1f7f.js:76140) at $parseFunctionCall (application-9d9dfe26d056c7fe9da969ebdf1e1f7f.js:38330) at update (application-9d9dfe26d056c7fe9da969ebdf1e1f7f.js:73683) at application-9d9dfe26d056c7fe9da969ebdf1e1f7f.js:73695 at application-9d9dfe26d056c7fe9da969ebdf1e1f7f.js:42205 at completeOutstandingRequest (application-9d9dfe26d056c7fe9da969ebdf1e1f7f.js:30920) at application-9d9dfe26d056c7fe9da969ebdf1e1f7f.js:31300

但在所有其他时间该函数也会调用

代码:

$scope.uploadFiles = function(files) {
    $scope.files = files;


    angular.forEach(files, function(file) {
        if (file && !file.$error && extension_check(file.name)) {
            file.upload = Upload.upload({
              url: 'http://172.18.139.3:3000/attachments',
              file: file

            });

            file.upload.then(function (response) {
              $timeout(function () {
                file.result = response.data;
                if (file.result.header.status["code"] == "ERROR") {

                    file.$error = true
                    $scope.message = file.result.header.status.message
                    console.log('file ' + file.name + ' is got error . Message: ' + file.result.header.status.message);
                }

              });
            }, function (response) {
              if (response.status > 0)
                $scope.status.message = response.status + ': ' + response.data;
                // $scope.errorMsg = response.status + ': ' + response.data;
            });

            file.upload.progress(function (evt) {
              file.progress = Math.min(100, parseInt(100.0 * 
                                       evt.loaded / evt.total));
            });
        } 


        console.log(file)  
    });

    extension_check = function(name) {

        extension_allow = ['jpg','jpeg','bmp','png'];
        ext = name.substr(name.lastIndexOf('.')+1).toLowerCase();
        console.log (ext);
        flag = (extension_allow.indexOf(ext) > -1);
        console.log (flag);
        return flag;
    }

}

Answer 1

因为第一次执行 for 循环时，变量 extension_check 未定义。自从您将 extension_check 作为全局变量以来，第二次它将具有函数引用。

一种解决方案是将 extension_check 的声明移至循环上方，另一种解决方案是通过使用函数声明语法来利用函数提升

$scope.uploadFiles = function (files) {
    $scope.files = files;


    angular.forEach(files, function (file) {
        if (file && !file.$error && extension_check(file.name)) {
            file.upload = Upload.upload({
                url: 'http://172.18.139.3:3000/attachments',
                file: file

            });

            file.upload.then(function (response) {
                $timeout(function () {
                    file.result = response.data;
                    if (file.result.header.status["code"] == "ERROR") {

                        file.$error = true
                        $scope.message = file.result.header.status.message
                        console.log('file ' + file.name + ' is got error . Message: ' + file.result.header.status.message);
                    }

                });
            }, function (response) {
                if (response.status > 0) $scope.status.message = response.status + ': ' + response.data;
                // $scope.errorMsg = response.status + ': ' + response.data;
            });

            file.upload.progress(function (evt) {
                file.progress = Math.min(100, parseInt(100.0 * evt.loaded / evt.total));
            });
        }


        console.log(file)
    });

    function extension_check(name) {

        var extension_allow = ['jpg', 'jpeg', 'bmp', 'png'];
        var ext = name.substr(name.lastIndexOf('.') + 1).toLowerCase();
        console.log(ext);
        var flag = (extension_allow.indexOf(ext) > -1);
        console.log(flag);
        return flag;

    }
}

<小时/>

您还可以在 uploadFiles 之外定义该函数，因为它不依赖于任何闭包变量

var extension_check = function extension_check(name) {
    var extension_allow = ['jpg', 'jpeg', 'bmp', 'png'];
    var ext = name.substr(name.lastIndexOf('.') + 1).toLowerCase();
    console.log(ext);
    var flag = (extension_allow.indexOf(ext) > -1);
    console.log(flag);
    return flag;

}

$scope.uploadFiles = function (files) {
    $scope.files = files;

    angular.forEach(files, function (file) {
        if (file && !file.$error && extension_check(file.name)) {
            file.upload = Upload.upload({
                url: 'http://172.18.139.3:3000/attachments',
                file: file

            });

            file.upload.then(function (response) {
                $timeout(function () {
                    file.result = response.data;
                    if (file.result.header.status["code"] == "ERROR") {

                        file.$error = true
                        $scope.message = file.result.header.status.message
                        console.log('file ' + file.name + ' is got error . Message: ' + file.result.header.status.message);
                    }

                });
            }, function (response) {
                if (response.status > 0) $scope.status.message = response.status + ': ' + response.data;
                // $scope.errorMsg = response.status + ': ' + response.data;
            });

            file.upload.progress(function (evt) {
                file.progress = Math.min(100, parseInt(100.0 * evt.loaded / evt.total));
            });
        }


        console.log(file)
    });
}

还要注意将变量设置为局部变量