javascript - backbone 不能在定义后立即使用 this.el

Question

我对变量声明后立即使用有疑问。

我一直试图做这样的事情:

var BuzzQuizView = Backbone.View.extend({
    el: $('.buzz-quiz'),
    liveMarked: this.el.data('live-marked'),
    questionTotal: this.el.data('question-count'),
    quizId: this.el.data('quiz-id'),
    ...

或者如果我们将问题从 Backbone 中移开，我总是尝试这样的事情:

var $answer = $('.answer'),
    $question = $answer.parent().parent();

但我总是得到一个错误，对于 Backbone 示例，它是:

无法读取未定义的属性“数据”

在变量的情况下我得到错误:

$answer 未定义

这是为什么？我只是想不通，为什么我不能使用变量？如我所见，变量已声明，代码已执行，因此变量应该可用。

如有任何帮助，我们将不胜感激。

----编辑----

所以我发现上面使用 var 的普通 JS 示例确实可以完美运行。

我想问的是为什么同样的问题在任何类型的对象中都存在，以下面为例:

var obj = {
    $body: $('body'),
    allDivs: $body.find('allDivs'),
    ...
}

为什么此时 $body 不可用？

Answer 1

this.el应指定为 jQuery 选择器 string 或 DOM 元素。不是 jQuery 对象，如您的代码 ($('.buzz-quiz'))。

此外，当您将选项传递给 Backbone.View 构造函数时，this.el 也是未定义的。它仅在 Backbone.View 被实例化后可用。

因此您必须在 Backbone.View 构造函数中初始化该属性:

var BuzzQuizView = Backbone.View.extend({
    el: '.buzz-quiz',
    initialize: function() {
        this.liveMarked = this.$el.data('live-marked');
        this.questionTotal = this.$el.data('question-count');
        this.quizId = this.$el.data('quiz-id');
    }
    ...
});