1

I am learning to code Javascript OOP style and I have a few questions, mostly about declaring variables and not using global ones.

Question 1 - am I doing the following coding correctly?

Here i declare the "Fields" class:

/**
 * Display Fields
 */
var Fields = function(){

    this.display = function(fields){

        var test = '1st method of declaring test';
        this.test = '2nd method of declaring test';

        for (var i = 0, len = fields.length; i < len; i++) {

            jQuery('[name=' + fields[i] + ']').closest('.row').css('display', 'block');

        }
    };
}

Now I instantiate the class Fields, creating the object fields

// Fields Object
var fields = new Fields();

fields.display(requiredFields.concat(normalFields));

Question 2 - Which is the correct way of declaring class variables - in this case: "test":

this.test = 'value'

or just:

var test = 'value'

Can you explain why 1 method is preferred over the other?

Question 3 - is the "i" inside the for loop declared correctly? Is this the correct way of doing it? Or I need to be using something like:

this.i = 0

Any advice on good practices is strongly appreciated.

I read allot on the net but I am new to OOP altogether and I want to make sure I am on a correct path.

Ty!

4

4 回答 4

1

var只有当你想在类的范围内创建一个变量时才应该使用，据我所知，该范围内的变量不能从外部读取，除非它们是从同一个类构造函数中的函数读取的。这也可以用于创建私有变量。

this指使用时将创建的对象，new Classname()您可以向其添加可供使用的属性。你这样做是正确的。您还可以使用括号表示法，例如：this['i have spaces'] = 'Me too!'，稍后也可以读出，使用class['i have spaces']，这允许添加具有运算符或其他 JS 语法字符的属性。

要回答您的第二个问题，您需要决定是否希望用户访问此变量。如果您希望他们有权访问，请使用this.test，否则使用var test。

至于第三个，是的。

于 2013-09-05T16:11:19.230 回答
1

Javascript没有“类”。Javascript 使用基于对象的原型继承。有很多好的 OOP 模式。如果我是你，因为这个想法是“面向对象”的，我会从一个对象开始，而你有一个函数（从技术上讲，它本身就是一个对象，但请耐心等待）。看一下这个：

  var fields = { //this can be the only global variable we ever use.
    options: {
      //default properties object.
    },
    init: function() {
      //do some things that need setup
      this.$elem = $('.myElem'); //for example
    },
    run: function(options) { //describe a general flow here, then write the functions to execute that, again, this is just an example of what might make sense. There are many approaches.
      this.init(); //maybe this is all you need to kick off your app and you could call it at document.ready. Don't let me example make you think too strictly. These are just ideas.
      var data = this.getData();
      this.useData(data);
    }
    getData: function() {
       var data;
       var example = 'blah'; //no need for everything to be a property of the object (this)
       //whatever here, probaby async request, so use promises
       return data;
    }
    //etc
  }

fields.run(); //you could pass some options, by the way. Whatever you do here, it should kick off the app and make everything do what it does. Calling this `init()` often makes more sense, btw.

你的问题不是特别关于继承，但这里是一个很好的阅读。 Object.create(myObj)很好:)

这是我最近的一个答案（点击），它展示了一个真实（简单）的应用程序编写的 OOP 风格，还有一个现场演示（点击），你可以随意摆弄。

如果您对此有任何具体问题，请继续发表评论，我将很乐意提供帮助！想要遵循更好的做法是一件好事！

于 2013-09-05T16:16:54.357 回答
1

这值得一读。这都是关于 Javascript 范围的。

这（双关语）也值得一读。这是关于 Javascript 中的“this”。

快速阅读 Javascript 中的 OOP。

在阅读所有这些并理解之后，您可能想要研究 Javascript 设计模式。

于 2013-09-05T16:05:26.613 回答
1

  1. 没关系。

  2. 如果你使用this.test = 'value'and var test2 = 'value'，那么你可以做fields.test，但不能做fields.test2。

  3. 它是正确的。在这种情况下，您的 i 应该是局部变量。

于 2013-09-05T16:05:48.443 回答