javascript - 为什么我的 JavaScript 对象抛出未定义的错误？

Question

我在控制台中收到此错误:

Uncaught TypeError: Cannot read property 'kbsrc' of undefined

我收到此错误是因为我认为我创建 JavaScript 对象的方式可能有问题。我从来没有创建过像这个这样多维的对象，所以我可能在某个地方搞砸了语法。我在此处生成标记文件中的对象:

var kb_work = {}
    kb_work['2014'] = {};
        kb_work['2014']['kbid'] = ["51","47"];
        kb_work['2014']['kbsrc'] = ["images\/images-4.jpeg","images\/imgres-3.jpeg"];
        kb_work['2014']['kbtitle'] = ["shalom","Test 6"];
        kb_work['2014']['kbmedium'] = ["2x2","Oil"];
        kb_work['2014']['kbsize'] = ["2x2","2x6"];
        kb_work['2014']['kbdate'] = ["2014","2014"];
    kb_work['2013'] = {};
        kb_work['2013']['kbid'] = ["55","54","53","52","50"];
        kb_work['2013']['kbsrc'] = ["images\/imgres-4.jpeg","images\/imgres-3.jpeg","images\/imgres-1.jpeg","images\/images.jpeg","images\/images-3.jpeg"];
        kb_work['2013']['kbtitle'] = ["totally","heheh","Howdy","tickle","hi"];
        kb_work['2013']['kbmedium'] = ["oil","oil","2x2","o","oil"];
        kb_work['2013']['kbsize'] = ["2x2","2x2","2x2","2x2","2x1"];
        kb_work['2013']['kbdate'] = ["2013","2013","2013","2013","2013"];
    kb_work['2012'] = {};
        kb_work['2012']['kbid'] = ["49"];
        kb_work['2012']['kbsrc'] = ["images\/images-2.jpeg"];
        kb_work['2012']['kbtitle'] = ["chicked"];
        kb_work['2012']['kbmedium'] = ["oil"];
        kb_work['2012']['kbsize'] = ["3x4"];
        kb_work['2012']['kbdate'] = ["2012"];

这些数组中的每一个现在只有一个值，但会随着用户添加工作而增长。接下来，我链接到一个文件，其中包含 TypeError 引用的函数(我在特定行上进行了注释):

function changeGal(gallery_year) {
  $("#gallery-control-bar").fadeOut(t);
  $("#gallery-image").fadeOut(t);
  $("#info").fadeOut(t);
  $("#gallery-viewer").fadeOut(t);

  //this is where the script chokes up referring to "currentImg" which is 0 and refers to the first value in the array "['2014']['kbsrc']".

    $("#gallery-image").html("<img src='" + kb_work[gallery_year]['kbsrc'][currentImg] + "'>");
    $("#gallery-title").html(kb_work[gallery_year]['kbtitle'][currentImg]);
    $("#gallery-medium").html(kb_work[gallery_year]['kbmedium'][currentImg]);
    $("#gallery-size").html(kb_work[gallery_year]['kbsize'][currentImg]);
    $("#gallery-date").html(kb_work[gallery_year]['kbdate'][currentImg]);

  $("#gallery-control-bar").delay(t + d).fadeIn(t);
  $("#gallery-image").delay(t + d).fadeIn(t);
  $("#info").delay(t + d).fadeIn(t);

  var userCurrent = currentImg + 1;
  var userTotal = kb_work[gallery_year][0].length;

  $("#current-post").html(userCurrent);
  $("#post-total").html(userTotal);

  var galWidth = $("#gallery-image" > "img").width();
  $("#gallery").width(galWidth);

}

有什么想法为什么它不能引用该值吗？

Answer 1

我认为你需要

$("#gallery-image").html("<img src='" + kb_work[gallery_year][gallery_year + '.kbsrc'][currentImg] + "'>");

因为看起来 gallery_year 是一个像 2013 这样的年份值，但键是一个串联字符串值，例如 2013.kbsrc

您的结构还有另一个问题，因为 kb_work[year] 应该是一个对象而不是数组，同样，第二级键不需要再次包含年份。

因此结构可以更新为

var kb_work = {}
kb_work['2014'] = {};
kb_work['2014']['kbid'] = ["46"];
kb_work['2014']['kbsrc'] = ["images\/screen shot 2014-03-05 at 11.31.04 pm.png"];
kb_work['2014']['kbtitle'] = ["Test 5"];
kb_work['2014']['kbmedium'] = ["Oil"];
kb_work['2014']['kbsize'] = ["2x5"];
kb_work['2014']['kbdate'] = ["2014"];
kb_work['2013'] = {};
kb_work['2013']['kbid'] = ["44"];
kb_work['2013']['kbsrc'] = ["images\/screen shot 2014-03-05 at 11.31.04 pm.png"];
kb_work['2013']['kbtitle'] = ["Test 3"];
kb_work['2013']['kbmedium'] = ["Oil"];
kb_work['2013']['kbsize'] = ["2x1"];
kb_work['2013']['kbdate'] = ["2013"];
kb_work['2012'] = {};
kb_work['2012']['kbid'] = ["45"];
kb_work['2012']['kbsrc'] = ["images\/screen shot 2014-03-05 at 11.31.04 pm.png"];
kb_work['2012']['kbtitle'] = ["Test 4"];
kb_work['2012']['kbmedium'] = ["Oil"];
kb_work['2012']['kbsize'] = ["2x3"];
kb_work['2012']['kbdate'] = ["2012"];

然后访问它

kb_work[gallery_year]['kbsrc'][currentImg]