Question

我想将一个变量传递给另一个文件，但直到现在我还不确定我做错了什么。

让我们说 file1.js 我有：

$('.selector').on('click', function (e) {
  var getClicked = $(e.currentTarget).find('img').attr('data-type');

  if (getClicked === "360") {
    function detect360Src() {
        var imgUrl = $(this).find('img').attr('src');
    }
    view360.init();
  }
})

现在，我想将变量imgUrl及其值/数据传递给 file2.js ，在其init - 函数中：

init: function() {
// imgURL variable/data here
}

我怎样才能实现这一目标？提前致谢

Answer 1

当JS在浏览器上下文中执行时，在全局范围内声明的变量或未声明初始化的变量（不带var关键字）将自动存储并在window对象中读取。因此，如果你创建一个变量，比如说，在文件的顶部，它仍然可以在页面上运行的任何其他JS代码中访问。

但是，由于此类变量会污染全局命名空间，因此最好创建一个容器对象来存储所有共享数据。在所有文件的顶部，添加如下内容：

myContainer = myContainer || {};

这会创建myContainer全局对象（如果它不存在），但如果有，则不会更改任何内容。

默认情况下变量是全局的这一事实是许多库将自己包装在闭包中的原因。要确保代码中的所有变量都不会被其他文件中的代码覆盖，您应该执行以下操作：

myContainer = myContainer || {};

(function(){
    var someVariable; // not accessible in other files
    myContainer.sharedVariable = 10; // accessible in all files
})();

请注意，在myContainer是全局的情况下，这仍然不是“安全”，并且可能会被类似于myContainer = something的任何代码覆盖。

Answer 2

如果两个文件属于同一个网站，请尝试使用LocalStorage或SessionStorage

http://www.w3schools.com/html/html5_webstorage.asp

if (localStorage.clickcount) {
    localStorage.clickcount = Number(localStorage.clickcount) + 1;
} else {
    localStorage.clickcount = 1;
}

Answer 3

将值保存在全局window变量中。

它可能不是最美丽的方式，但这就是Meteor.js如何进行......

至少你肯定能够检查var存在并在任何地方重复使用。

Answer 4

长版：阅读this document on variable scopes in JavaScript

<强> TL; DR ：

JavaScript中变量的范围是它声明的函数（或全局范围，如果它是在任何函数的主体之外声明的那样）。

因此，如果你有这样的代码，那个变量的生命周期就是这样：

function detect360Src() {
  var imgUrl = $(this).find('img').attr('src');
  // imgUrl is in the scope
}
// imgUrl is out of scope

如果你需要在两个文件之间传递一个变量（它本身就是一个警告标志），你需要在全局范围内传递一个变量。

但是为了避免污染全局命名空间，拥有自己的包装器是个好主意（就像许多JS库一样）：

// in the global scope:
var myLibContainer = mylibContainer || {}
// .. in file 1 attach things to it 
lyLibContainer.imgData = ....
// .. in file 2 get access
console.log(myLibContainer.imgData)

javascript将变量传递给另一个文件

4 个答案: