我已经阅读了很多关于Javascript范围的内容并且已经产生了我想要的功能 - 我想我会在一个地方发布这个问题来澄清这些/ hys。
就我而言,我使用的是Leaflet - 一个用于映射的JavaScript库。
我的第一个问题是'L'是什么。
例如,我可以使用以下代码:
current_map = L.map(map_id);
L代表什么,为什么我可以通过它来访问函数?
其次在我的网站上,我有不同的地图共享一些共同的代码,例如设置地图。
因此我想开发一些“公共代码”来设置地图并添加标记。例如。
所以我在map_global.js中编写了以下代码:
var current_map;
window.setup_map = function(map_id)
{
if ($("#"+map_id)[0])
{
$("#"+map_id).show();
current_map = L.map(map_id);
}
}
然后在我的map_individual.js文件中,我只写:
map_setup('map_div');
我的地图已设置完毕。
我可以这样做,因为通过在定义函数名称中使用窗口,我在全局范围内设置函数。同样,通过将变量current_map设置在任何函数之外,它也是全局的吗?
这是实现此功能的有效/安全/合理方式吗?
最后为什么我不能访问map_individual.js中的current_map?
非常感谢。
汤姆
答案 0 :(得分:2)
这是变量范围的问题。
将“L”概念性地视为命名空间。 L向您公开方法,例如map,L.map()。
您希望公开“current_map”变量。在map_global.js文件中,current_map当前是一个局部变量 - 因为您使用 var 声明了它。因此,map_global.js范围之外的任何内容都无法访问current_map。
如果你想快速而肮脏地访问map_individual.js中的current_map,你可以通过将全局window.current_map设置为L.map(map_id)来公开它,所以改变current_map变量的范围。
这当然导致污染全球范围,因此您可以探索的一件事是如何实现“模块化”客户端javascript。这样做的一种简单方法是实现自己的命名空间。例如。在map_global.js中,您可以只公开一个“对象” - 您自己的命名空间 - 并将其附加到窗口。如果将这些方法和变量附加到该“对象”,则可以使用命名空间访问current_map和setup_map(),而不是将所有方法和变量直接附加到窗口 - 全局命名空间 - 这可能会很快失控。
function setup_map(){ ...}
var current_map;
window.my_lib = {
setup_map = setup_map,
current_map = current_map
}
所以 my_lib.setup_map(),然后 my_lib.current_map 可以通过这种方式访问,因为您只能 my_lib 全球。想象一下,如果my_lib暴露了十几个函数,那么这个想法就是更有条理,而不是将所有十几个函数附加到窗口 - 全局命名空间。当你有不同的文件/“模块”,它们具有相同的功能时,这会派上用场。这样,你可以拥有my_lib.render()并说client_lib.render(),而不会互相覆盖,并保持这种分离,作为一种降低覆盖全局命名空间中已有内容的风险的方法。 p>
请注意,导入脚本的顺序也很重要!还有像RequireJS,CommonJS这样的库,仅举几例,试图处理整个模块化事物的依赖性方面,值得探讨。所以谨慎行事,希望这有帮助!