Ajax | 数组对象中有元素但长度为0

最新推荐文章于 2023-09-06 13:24:18 发布

虎鲸一号

最新推荐文章于 2023-09-06 13:24:18 发布

阅读量1.5k

点赞数

分类专栏： Web 报错摘记

本文链接：https://blog.youkuaiyun.com/qq_44537414/article/details/105670161

版权

报错摘记同时被 2 个专栏收录

27 篇文章

订阅专栏

Web

12 篇文章

订阅专栏

本文介绍了在使用Ajax时遇到的一种情况：数组对象中实际有元素，但其长度却显示为0。分析原因是由于异步操作，导致在执行打印或检查时，数据尚未完全添加到数组中。解决方案包括将异步变为同步操作或者调整业务逻辑以正确处理异步数据。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

情况描述

在这里插入图片描述

$(document).ready(function(){
	init();
	getQuestion();
});

function init() {
	$.ajax({
		url: 'questions.xml',
		cache: false,
		dataType: 'xml',
		success: function(data) {
			$(data).find('issue').each(function(){
				let tmp = {};
				tmp['question'] = $(this).find('q').text();
				tmp['answer'] = $(this).find('a').text();
				tmp['reward'] = $(this).find('reward').text();
                dataList.push(tmp);
			})
		}
	})
}

function getQuestion() {
	console.log(dataList, dataList.length);
}

原因分析

受启发后，顿悟可能是Ajax异步操作的原因，使得在打印时，数组并没有添加完数据，截图中用红框标注的length也在提示这一点

解决办法

1.异步变同步

	$.ajax({
        ...
        async: false, //设置为同步
        ...
	})

在这里插入图片描述

2.修改逻辑

如上述代码所示，可修改为

$(document).ready(function(){
	init();
	//getQuestion();
});

function init() {
	$.ajax({
		url: 'questions.xml',
		cache: false,
		dataType: 'xml',
		success: function(data) {
			$(data).find('issue').each(function(){
				let tmp = {};
				tmp['question'] = $(this).find('q').text();
				tmp['answer'] = $(this).find('a').text();
				tmp['reward'] = $(this).find('reward').text();
                dataList.push(tmp);
			})
			getQuestion(); // +
		}
	})
}

...