參考jQuery中變量的選項

Question

只是對jQuery/Javascript感興趣並且引用變量中的選項。

所以，我寫了一個小插件，當我打電話「填充」將填寫一些文本。非常基本。這裏的我想要做什麼：

var foo = { 
    msg1: "Hey", 
    msg2: this.msg1 + "how", 
    msg3: this.msg2 + "are", 
    msg4: this.msg3 + "you", 
    msg5: this.msg4 + "doing", 
    msg6: this.msg5 + "today" 
} 

$("#bar").populate({text: foo.msg6});

所以當.populate插件被調用時，#bar將獲得「嘿你今天怎麼做」添加到它。

填充插件很難解釋，但請相信我這很好，而不是問題。我只是好奇，如果這種類型的變量和選項的組織是可能的，因爲似乎更清潔，更「語義」，並不僅僅是一組變量引用其他變量更有條理，我...

希望我有道理！謝謝大家！

Answer 1

this只有在execution context意義。當你定義一個函數時，爲該函數創建一個作用域鏈，當該函數進入當前執行上下文時將使用該作用域鏈。當發生這種情況時，將會定義this（在運行時）。有關更多詳情，請參閱this。

在你的例子中，你沒有定義任何新的作用域鏈，因爲你沒有在你的對象上創建任何方法。因此，當您參考this時，無論何時您製作foo對象，您都指的是this。很可能，您正在全球空間中工作，因此this將會是window（如果您在瀏覽器中），但它可能是另一個具有您正在執行的功能的對象。例如：

var myScopeObj = { 
     myMethod: function() { 
      var foo = { 
       msg1: "Hey", 
       msg2: this.msg1 + "how", 
       msg3: this.msg2 + "are", 
       msg4: this.msg3 + "you", 
       msg5: this.msg4 + "doing", 
       msg6: this.msg5 + "today" 
      }; 
      var foo2 = foo.msg6; 
     } 
    }; 

有在上面的例子幾個可能的原因：

myScopeObj.myMethod(); // 'this' refers to myScopeObj 

或

var method = myScopeObj.myMethod; 
    method(); // 'this' refers to window 

或

myScopeObj.myMethod.call(window); // 'this' refers to window 

你可以做的是使用爲你的對象創建一個構造函數，並使用this來映射屬性。

function Foo() { 
     this.msg1 = "Hey"; 
     this.msg2 = this.msg1 + "how"; 
     this.msg3 = this.msg2 + "are"; 
     this.msg4 = this.msg3 + "you"; 
     this.msg5 = this.msg4 + "doing"; 
     this.msg6 = this.msg5 + "today"; 
    }; 
    var foo = new Foo(); 
    $("#bar").populate({text: foo.msg6}); 

Answer 2

在像你這樣的對象定義中，this沒有引用對象本身，所以你的對象聲明不會做你想要的。

事實上，在this sample code，你可以看到，this在該對象定義是window對象，它是什麼樣的JavaScript解釋器將其設置爲當不存在，它應該有一些其他的價值。

我不明白你爲什麼要嘗試做你正在做的事（所以我不能建議更好的選擇），但你可以用init()方法結束這樣的所需的foo對象：

var foo = { 
    msg1: "Hey", 
    init: function() { 
     this.msg2 = this.msg1 + "how"; 
     this.msg3 = this.msg2 + "are"; 
     this.msg4 = this.msg3 + "you"; 
     this.msg5 = this.msg4 + "doing"; 
     this.msg6 = this.msg5 + "today"; 
    } 
} 

foo.init(); 
$("#bar").populate({text: foo.msg6}); 

，或者你可以用一個構造函數使用：

function Foo() { 
    this.msg1 = "Hey"; 
    this.msg2 = this.msg1 + "how"; 
    this.msg3 = this.msg2 + "are"; 
    this.msg4 = this.msg3 + "you"; 
    this.msg5 = this.msg4 + "doing"; 
    this.msg6 = this.msg5 + "today"; 
} 

var foo = new Foo(); 
$("#bar").populate({text: foo.msg6});