Javascript |开关中的未定义变量答案

【问题标题】：Javascript | Undefined Variable in switchJavascript |开关中的未定义变量
【发布时间】：2017-03-14 20:32:20
【问题描述】：

所以我正在使用 API 来获取《战地风云》的统计数据。该级别返回一个数字，我使用开关来确定该级别的名称，因此无论用户名是什么或用户排名如何，都将使用开关进行更新。但是，当我访问“等级”变量时，它没有出现，因为它说级别未定义，因此开关根本不起作用。

var rank;
var level;

$(document).ready(function() {
    ajaxSearch();
});

function ajaxSearch() {
    $.ajax({
        url: '/api/',
        dataType: 'json',
        type: 'get',
        cache: 'false',
        success: function(data) {
            $(data.result).each(function(index, value) {
                level = value.rank.number;
                console.log(level);
            });
        }
    })
}

function workoutRank() {
    switch (level) {
        case '0':
            rank = 'Recruit';
        break;
        case '1':
            rank = 'Private';
        break;
        case '2':
            rank = 'Private II';
        break;
        case '3':
            rank = 'Private III';
        break;
        case '4':
            rank = 'Private IV';
        break;
        case '19':
            rank = 'Corporal X';
        break;
    }
}

$('#lookup-btn').click(function() {
   workoutRank();
   console.log(rank);
});

这是控制台的图像。 Console

【问题讨论】：

非常抱歉，现在更新问题。
@AndrewLi 问题已更新。
嗯。您正在循环，并在每次迭代中设置级别。 level 只能包含一个值，为什么要循环？
添加Ajax的切换成功。 Ajax 是异步的！
@LelioFaieta 所以正在点击一个元素，可能会在此之前完成 ajax。

标签： javascript jquery ajax api variables

【解决方案1】：

有两种可能：

Ajax 调用未完成（或未成功终止）
Ajax 调用返回的数据不是您所期望的。特别是，如果您的 level 值是整数，那么您的 case 值也应该是整数：
```
switch (level) {
    case 0: // not '0'
        rank = 'Recruit';
        break;
    // etc
```

【讨论】：

字面意思是使用'0'等，我怎么会忘记呢？！谢谢！

【解决方案2】：

ajaxSearch 是异步的，所以当你调用workoutRank 时，level 不能保证有值。您需要确保您了解这两件事是同时发生的。

相反，当ajax 调用返回时调用workoutRank，或使用promises 以确保该值能够解析。

编辑：对问题进行了编辑以表明不一定是这种情况，但我会保留它，因为这对于将来遇到这种情况的其他人来说肯定是个问题

【讨论】：

ajax 是在文档加载时完成的，所以它应该立即返回一个值，如果它不存在，它应该 = 0 但似乎情况并非如此，级别 = 19当它产生未定义的错误时。
当我写答案时，该代码不存在！它是在之后编辑的
如果按钮被快速点击，这很可能是“一个”问题，但不太可能。
@cmiotk - ajax 调用可能在文档加载时启动，但这并不意味着返回值立即可用。并且全局变量将是undefined，而不是0，直到为它们分配一个值。最好禁用 lookup-btn 直到 ajax 调用完成。