我正在创建一个插件,我想加载一些脚本,并为每个脚本运行函数plugin
。
我创建了一个set of tests/examples(下面的代码)。
问题:
AJAX传递通常的data, textStatus, jqxhr
个参数集。但显然也创建了plugin
函数可用的范围。在文档中找不到任何相关内容。更多细节/解释请!
this
似乎在范围内是什么?
我通过映射脚本名称列表运行get脚本的第三个示例按预期工作。
建立一个延迟列表,然后使用when
行动很奇怪。我没有表明函数已经运行(没有输出),当我删除延迟时,它似乎总是先完成("完成"打印在其他所有内容之前)。功能是否正在运行?我尝试添加alert
,但在使用when
时却没有显示。
index.js
var script_names = ["one.js", "two.js", "three.js"];
function as_callback(script_name)
{
console.log("plugin function run as callback");
console.log(`$.getScript(${script_name}, (data, textStatus, jqxhr) => plugin());`);
$.getScript(script_name, (data, textStatus, jqxhr) => plugin());
console.log();
}
function from_this(script_name)
{
console.log("plugin function referred to from 'this'");
console.log(`$.getScript(${script_name}, (data, textStatus, jqxhr) => this.plugin());`);
$.getScript(script_name, (data, textStatus, jqxhr) => this.plugin());
console.log();
}
function with_map(script_names)
{
console.log("with map");
console.log("string_names: " + JSON.stringify(script_names));
console.log(`
script_names.map((x) =>
{
$.getScript(x, (data, textStatus, jqxhr) => plugin())
});
`);
script_names.map((x) =>
{
$.getScript(x, (data, textStatus, jqxhr) => plugin())
});
console.log();
}
function with_push_and_when(script_names)
{
console.log("build array of deferred and run with when");
console.log(`
var plugs = [];
script_names.map(x => $.getScript(x, (data, textStatus, jqxhr) => plugs.push(plugin)));
$.when(plugs).done(console.log("done"));
`);
var plugs = [];
script_names.map(x => $.getScript(x, (data, textStatus, jqxhr) => plugs.push(plugin)));
$.when(plugs).done(console.log("done"));
console.log();
}
as_callback('one.js');
setTimeout("from_this('two.js')", 2000);
setTimeout("with_map(script_names)", 4000);
setTimeout("with_push_and_when(script_names)", 6000);
var plugs = [];
script_names.map(x => $.getScript(x, (data, textStatus, jqxhr) => plugs.push(plugin)));
setTimeout("console.log('run when in global scope');$.when(plugs).done(console.log('done'))", 8000);
one.js
var plugin = function()
{
console.log("one.js\n\n");
// alert("one");
return "one";
}
two.js
var plugin = function()
{
console.log("two.js\n\n");
return "two";
}
three.js所
var plugin = function()
{
console.log("three.js\n\n");
return "three";
}
输出
plugin function run as callback
$.getScript(one.js, (data, textStatus, jqxhr) => plugin());
one.js
plugin function referred to from 'this'
$.getScript(two.js, (data, textStatus, jqxhr) => this.plugin());
two.js
with map
string_names: ["one.js","two.js","three.js"]
script_names.map((x) =>
{
$.getScript(x, (data, textStatus, jqxhr) => plugin())
});
two.js
three.js
one.js
build array of deferred and run with when
var plugs = [];
script_names.map(x => $.getScript(x, (data, textStatus, jqxhr) => plugs.push(plugin)));
$.when(plugs).done(console.log("done"));
done
run when in global scope
done
注意: 我将接受的答案添加到 repl.it 。
答案 0 :(得分:1)
在加载脚本后,回调函数在全局上下文中运行。由于脚本定义了全局变量plugin
,因此可以从回调函数中访问它。
$.getScript
未设置特定上下文,因此this
将成为全局window
对象。 this.plugin
与window.plugin
相同,后者是全局变量。
这是对的。
$.getScript
会返回一个承诺,但您并未将其推送到plugs
,而您只是推送plugin
。
将.map()
的结果分配给plugs
以获取正确的承诺数组。
var plugs = script_names.map(x => $.getScript(x, (data, textStatus, jqxhr) => plugin()));
$.when(plugs).done(console.log("done"));