javascript - 将对象传递给 JS 函数

Question

在这种情况下，如何将对象作为变量传递给函数？我收到 console.log(setup) = undefined？有没有更好的方法将回调函数传递给 getTemplate() ？谢谢

函数模板

function getTemplate (name, callback, dir) {
          if (dir === undefined) dir = ''
          var xhr = new XMLHttpRequest()
          var url = '/core/templates/' + dir + name + '.html'
          xhr.open('GET', url, true)
          xhr.onreadystatechange = function () {
            if (xhr.readyState == 4 && xhr.status == 200) {
              var raw = xhr.responseText
              var compiled = Handlebars.compile(raw)
              callback(compiled)
            }
          }
          xhr.send()
        }

调用函数

for (var i = 0; i < item.length; i++) {
 var tabActive = ''
 if (i == 0) { tabActive = 'active' }

 var tab = item[i],
 tabId = tab.id,
 tabTitle = tab.title,
 variables = {tabActive: tabActive, tabId: tab.id, tabTitle: tab.title}

 console.log(variables) // *A increments 5328, 5329

 getTemplate('tab-nav', function (tmp) {

 console.log(variables) // *B increments 5328, 5328

 $(tabNavigationId + '>ul').append(tmp(variables))

 })

}

*A

index.js:18 Object {tabActive: "active", tabId: "5327", tabTitle: "User Experience"}
index.js:18 Object {tabActive: "", tabId: "5328", tabTitle: "Design"}
index.js:18 Object {tabActive: "", tabId: "5329", tabTitle: "Web Development"}
index.js:18 Object {tabActive: "", tabId: "5330", tabTitle: "Mobile Development"}

*B

index.js:21 Object {tabActive: "", tabId: "5743", tabTitle: "Extension Settings"}
index.js:21 Object {tabActive: "", tabId: "5743", tabTitle: "Extension Settings"}
index.js:21 Object {tabActive: "", tabId: "5743", tabTitle: "Extension Settings"}
index.js:21 Object {tabActive: "", tabId: "5743", tabTitle: "Extension Settings"}

从 getTemplate 'tmp' 回调

function ret(context, execOptions) {
        if (!compiled) {
          compiled = compileInput();
        }
        return compiled.call(this, context, execOptions);
      }

Answer 1

您无法在回调函数中传递变量。

您需要将其用作

var setup = {tabActive: tabActive, tabId: tab.id, tabTitle: tab.title}

getTemplate('tab-nav', function (tmp) {
  //setup is accessible here
  console.log(setup)
  $(tabNavigationId + '>ul').append(tmp(setup))
})

-- 新更新--

你的 getTemplate 函数function getTemplate (name,callback,dir){ 期望第二个参数是回调函数。 所以你需要做的是，使用 getTemplate 函数作为

getTemplate('tab-nav', myCallBackFunc, 'dir');

那么myCallBackFunc将是这样的。

我可以看到您正在使用一些参数调用回调。

function myCallBackFunc(response) {
 //do something with response
}

此外，您还没有定义有关 tmp 函数的任何内容