Javascript OOP和类问题

时间:2015-08-16 00:48:23

标签: javascript oop

我想将我的代码重新排列为OOP,但我无法在此处弄清楚我的错误,特别是因为根据不同的教程和示例它们看起来是正确的。 我想我误解了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.如果我现在实例化语法并从中调用,则来自Lex的publicFunc都是未定义的。但是如果我从Syntax运行foo()并再次调用publicFunc,则x被设置为值,而h是未定义的。为什么不能预先定义一个变量(在这种情况下是h)然后使用它?

编辑Jan的答案:

我在许多教程和一些生产代码中读到了你应该将“this”存储到变量中。为什么myRef指向除语法对象之外的任何东西? :o 为什么myRef不是Syntax的变量?它必须是this.myRef吗? 啊,对,var意味着本地,所以我只能在构造函数中访问?!

我不想初始化“x”,只定义它。 啊,返回{}我正在创建一个新的类/对象,然后很清楚这一点。不指向上述变种。但要引入myRef =这应该可以完成这项工作,对吗?

...那么,使用原型来添加函数而不是内部函数是明智的吗?

1 个答案:

答案 0 :(得分:2)

是的,你有很多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();