Javascript面向對象和類問題

Question

我想重新排列我的代碼到面向對象，但我無法找出我的錯誤在這裏，尤其是因爲它們根據不同的教程和示例顯示正確。 我想我誤解了JS的對象實例化和調用堆棧。

我會提供一些我不明白的例子。

我想在這裏做的是對數組做一些操作，然後把它拿到另一個類。

https://jsfiddle.net/8g22nj8y/1/

<script> 
$(document).ready(function() { 
    var p = new Parser(); 
    p.init(); 
    p.getArray(); 
    p.getArray2(); 
    p.get3(); 
}</script> 

function Parser() { 

var myArray = []; 
this.myArray2 = []; 
thisReference = this; 
    this.myArray3=[]; 

return { 
    init: function() { 
     alert("huhu"); 
     this.parse2(); 
     parse(); 
    }, 
    getArray: function() { 
     alert(thisReference.myArray2.length); 

    }, 
    getArray2: function() { 
     alert(myArray); 
    } 
} 

function parse() { 
    var arr = [1, 2, 3]; 
    myArray.push(arr); 
    myArray2.push(arr); 

for(var i =0;i<10;i++){ 
     a=[]; 
     a.push(i); 
     thisReference.myArray3.push(a); 
    } 

}}Parser.prototype.parse2 = function() { 
var arr = [1, 2, 3]; 
myArray.push(arr); 
this.myArray2.push(arr);}; 

獨立我如何運行它，它總是說this.parse2（）不是一個函數。 當我只使用parse（）時，它說myArray2是未定義的，儘管它顯然存在 - 就像「類變量」一樣。如果我將parse（）中的myArray2更改爲thisReference.myArray2，它可以工作。

爲什麼？我認爲解析（）明確的內部函數能夠獲取外部函數中的所有變量 - 在本例中爲Parser（）。當我現在使用myArray3時，如果它與thisReference一起使用或者與此一起使用。 「它沒有被定義」。 如果我使用thisReference調用parse2它工作，但然後「myArray沒有定義」，是它是一個局部變量，但它在同一個類中，如果我調用parse（）我可以使用它沒有問題。

此外：

簡化：https://jsfiddle.net/Lzaudhxw/1/

function Syntax(){ 
    var mine = new Lex(); 
    myRef=this; 
    } 
    Class1.prototype.foo=function(){ 
     myRef.mine.setFunc(5); 
     myRef.mine.publicFunc();} 


function Lex(){ 
    this.x, this.h=1; 
    return{ 
     publicFunc: function(param){ 
     this.h; 
     this.x; 
     }, 
     setFunc: function(x){ 
     this.x=x; 
     } 
} 

最初我集合H爲1。如果現在instantiiate語法，並從該從萊克斯的publicFunc都是未定義的呼叫。但是，如果我從語法中運行foo（）並再次調用publicFunc，則將x設置爲該值，並且h未定義。爲什麼不可能預先定義一個可變的（在這種情況下是h），然後使用它？

編輯到Jan's答：

我看了很多教程，您應該存儲「這種」爲變量的一些生產代碼。爲什麼myRef指向語法對象以外的其他東西？ ：O 爲什麼myRef不是語法的變量？它是否必須是this.myRef？ 啊，對，var表示本地，所以我的構造函數只能訪問？！

我不想初始化「x」，只定義它。 Ahh with return {}我正在創建一個新的類/對象，然後很清楚這一點。並沒有指出上述的變數。但要介紹一個myRef =這應該可以完成這項工作，對吧？

...那麼，使用原型來添加函數而不是內部函數會更明智嗎？

Answer 1

是的，你有一堆JS概念錯誤。我建議你閱讀文檔。試着添加一些解釋。

function Syntax(){ 
    // Since you're returning a new object from "Lex" straight away, there's 
    // little point of using "new" here 
    var mine = new Lex(); 
    // Why store "this" here? "this" will be accessible from your prototype 
    // methods pointing to your object instance... Provided you use "new Syntax()", 
    // Otherwise "myRef" will (probably) point to the global object. 
    myRef=this; 
} 

// Where's "Class1"? You don't have a Class1 function anywhere. You probably mean "Syntax" 
Class1.prototype.foo=function() { 
    // "myRef" is not a property of "Syntax", so it wouldn't be accessible here. 
    // Furthermore, "mine" is declared as a variable above, so it wouldn't be 
    // accessible in this manner even if "myRef" pointed to "this" (which it doesn't). 
    myRef.mine.setFunc(5); 
    myRef.mine.publicFunc(); 
} 

function Lex(){ 
    // This is a correct property declaration of h. You're not setting the 
    // value of x here though, just calling it. Javascript allows "trying" 
    // to call ANY property of ANY object without giving neither a compilation 
    // nor runtime error, so calling the undefined "this.x" here is valid. 
    // It just won't do anything. 
    this.x, this.h=1; 
    // Here you return a new object straight off, so the below "this" will point 
    // to the object below, not the "Lex" object defined above. So your above 
    // defined "this.h" will not be used, it's a property of a different object. 
    return { 
     publicFunc: function(param){ 
      this.h; 
      this.x; 
     }, 
     setFunc: function(x){ 
      this.x=x; 
     } 
    } 
// You're missing a closing bracket here. 

什麼你可能嘗試做會看起來像這樣用正確的JavaScript語法

function Syntax(){ 
 
    this.mine = Lex(); 
 
} 
 
Syntax.prototype.foo=function() { 
 
    this.mine.setFunc(5); 
 
    this.mine.publicFunc(); 
 
} 
 

 
function Lex() { 
 
    return { 
 
     h:1, 
 
     publicFunc: function(){ 
 
      console.log(this.h); 
 
      console.log(this.x); 
 
     }, 
 
     setFunc: function(x){ 
 
      this.x=x; 
 
     } 
 
    } 
 
} 
 

 
var s = new Syntax(); 
 
s.foo();

但是從Lex返回一個對象將在大多數情況下非常不切實際。所以，你真的真的想要做的可能是

function Syntax(){ 
 
    this.mine = new Lex(); 
 
} 
 
Syntax.prototype.foo = function() { 
 
    this.mine.setFunc(5); 
 
    this.mine.publicFunc(); 
 
} 
 

 
function Lex() { 
 
    this.h = 1; 
 
} 
 
Lex.prototype = { 
 
    publicFunc: function(){ 
 
     console.log(this.h); 
 
     console.log(this.x); 
 
    }, 
 
    setFunc: function(x){ 
 
     this.x=x; 
 
    } 
 
}; 
 

 
var s = new Syntax(); 
 
s.foo();