Javascript全局变量只能在应用程序运行后访问
Javascript global variables only accessible after application runs
我有一系列嵌套的Ajax请求到外部api,这是非常丑陋的,但这是唯一的方法,我可以弄清楚如何以指定的顺序进行调用,每个调用利用从前一个调用带回的一些值。(我尝试过,但不能让它工作,所以我回到这里的建议。)
无论如何,这在一定程度上是有效的。我所有的调用都是连续工作的,最后得到一个名为people
的数组,它只是一个名称列表:["name1","name2","name3"]
。
我的问题是,我似乎不能做任何事情与这个数组从我的javascript代码。我不能将它们附加到div中,也不能在代码执行期间警告它们,甚至不能在console.log 中记录它们。然而,一旦我的代码完成,我可以在浏览器控制台中输入people
,它们都在那里,如预期的那样。
我猜这与变量的范围有关-我曾尝试使其全局并移动其声明的位置,但我可以从可运行代码访问people
的唯一方法是从最后的AJAX循环内,然后我得到很多重复的值,因为它正在循环并增量地添加到数组中。
这里的目标是获得最终API调用的人员并在HTML中列出他们。
这是我的代码。如有任何建议,不胜感激。
HTML触发事件:
<input type='file' accept='image/*' onchange='openFile(event)'>
<!--process is triggered by file upload-->
javascript: var openFile = function(event) {
//... Some UI stuff happens here.
//... When finished, just call getGraph(); below
performances = new Array(); // global scope
people = new Array(); // global scope
getGraph(); // call function below
console.log(people); // retrieve array; doesn't work
};
function getGraph(){
$.ajax({
url:'http://...' + document.getElementById('prDate').value,
dataType:'json',
success: function(response){
$.each(response, function(i, item) {
var programID = item.id;
$.ajax({
url:'http://...'+ programID',
dataType:'json',
success: function(response){
$.each(response, function(i, item) {
performances.push( item.id );
});
$.each(performances, function(index, value){
$.ajax({
url:'http://...' + this.valueOf() +'/persons/',
dataType:'json',
success: function(response){
$.each(response, function(i, item) {
people.push( item.firstname + ' ' + item.lastname ); // the magic moment
});
}
});
});
}
});
});
}
});
}
从您的代码中可以看到,people
变量将只在您调用openfile
函数时创建。如果你想要它被创建,即使openfile
方法没有被调用,然后在所有的函数之外声明它,然后它将是可访问的,或者在你打算在ajax调用上面使用它的地方声明它,然后使用它。
你试过把它放在IIFE闭包里吗?
(function(){
var OpenFile = function() {
if ( !(this instanceof OpenFile) ) {
return new OpenFile();
}
var performances = new Array(); // closure Scope
var people = new Array(); // closure Scope
function getGraph(){
$.ajax({
url:'http://...' + document.getElementById('prDate').value,
dataType:'json',
success: function(response){
$.each(response, function(i, item) {
var programID = item.id;
$.ajax({
url:'http://...'+ programID',
dataType:'json',
success: function(response){
$.each(response, function(i, item) {
performances.push( item.id );
});
$.each(performances, function(index, value){
$.ajax({
url:'http://...' + this.valueOf() +'/persons/',
dataType:'json',
success: function(response){
$.each(response, function(i, item) {
people.push( item.firstname + ' ' + item.lastname ); // the magic moment
});
}
});
});
}
});
});
}
});
}
return {
get performances() : { return performances;},
get people() : { return people; },
getGraph : getGraph
};
};
window.OpenFile = OpenFile;
})();
,然后你可以像
这样调用它var myOpenFile = new OpenFile();
var people = myOpenFile.people;
myOpenFile.getGraph();
console.log(people);
的额外好处是,OpenFile对象在代码加载后立即可用。代码中的所有变量仅作用于对象OpenFile,并且不污染全局名称空间,您可以通过将它们放在最后的返回语句中来选择希望向其他人公开的内容。
- 在单独的上下文中运行 js 代码并访问其全局变量
- 如何在运行时访问typescript类公共属性(调试)?只有构造函数和函数是可访问的
- JavaScript 访问对象属性的运行时复杂度 O(?) 是多少?
- 未访问全局变量,未运行代码
- 当 json 给出 NetworkError: 503 禁止访问时如何运行函数
- 可以在模块中运行.导出访问模块中的全局变量
- AJAX 可访问的长时间运行的服务任务阻止在启用 ASP.NET 兼容性/会话的环境中的后续 AJAX 服务请求
- 如何在Android上运行的PhoneGap中访问联系人的电话号码
- 访问当前正在运行的脚本错误日志
- 阻止 Javascript 在只能访问 css 的情况下运行
- 0x8000ffff JavaScript运行时错误对方法或属性访问的意外调用
- 从“”中运行的代码访问变量;eval”;在Javascript中
- 访问为mongo运行JavaScript文件的字段值的正确语法是什么
- 使用Javascript访问本地主机上运行的服务
- Docker运行,无法访问应用程序
- Javascript变量在chrome中不可访问,但在firefox中运行良好
- 访问节点中长时间运行的进程的grpc流变量
- 如何在没有用户访问页面的情况下运行php代码
- 有没有一种方法可以在页面上运行JavaScript我可以't访问
- 如何在应用程序再次运行后使访问的链接字体正常