标签导航:

在javascript异步操作中,如何有效地处理空数据避免错误?

本文将针对一个在异步函数中处理数据时遇到的问题进行分析。代码片段使用了then方法处理getplat函数的异步返回结果,该函数用于获取平台信息。 问题在于,即使代码中添加了if (response.total > 0)的判断条件,在response.total为0且response.rows为空数组的情况下,后续代码仍然尝试访问response.rows[0],导致typeerror: response.rows[0] is undefined错误。

代码示例如下:

getplat({"tenantid":row.id}).then(response => {
    console.log(response.rows.length)
    if(response.total > 0){ 
        this.$set(this.form2,"plataddr",response.rows[0].plataddr)
        this.$set(this.form2,"platdesc",response.rows[0].platdesc)
        this.$set(this.form2,"platdomain",response.rows[0].platdomain)
        this.$set(this.form2,"platlogo",response.rows[0].platlogo)
        this.$set(this.form2,"platname",response.rows[0].platname)
        this.$set(this.form2,"id",response.rows[0].id)
    } else {
        console.log("未设置平台")
    }
});

返回的数据结构为:

{"total":0,"rows":[],"code":200,"msg":"查询成功"}

虽然代码已包含response.total > 0的判断,但错误仍然出现。 这并非if语句判断逻辑的问题,而是由于在response.total为0时,response.rows是一个空数组,而代码仍然尝试访问response.rows[0],导致错误。 解决方法是确保在访问response.rows[0]之前,再次确认response.rows数组中是否存在元素。 虽然提问者提到最终通过response.total > 0解决了问题,但这更像是规避了问题而不是根本解决。 更好的做法是直接判断response.rows.length是否大于0:

getPlat({"tenantId":row.id}).then(response => {
    if(response.rows.length > 0){ 
        this.$set(this.form2,"platAddr",response.rows[0].platAddr)
        // ... other assignments
    } else {
        console.log("未设置平台")
    }
});

通过判断response.rows.length,可以更直接、更可靠地避免访问空数组元素的错误,从而有效地阻止后续代码执行。 提问者提到浏览器缓存可能也影响了结果,但这部分原因并未在代码中体现,需要进一步排查。