When should I use data type classes in JavaScript

Question

I come from a C# background. I've been working a lot with JavaScript lately. On a new app, I have a mysql/php back end. I'm going to be passing a lot of "types" back and forth.

So in my data base, I have several tables like

table1
id, fieldx,fieldy,fieldz

table2
id, fielda,fieldb,fielc

In c# I would definitely write classes for all those in the code. Which led me to implement things like so (in my JavaScript app):

function table1(id, x,y,z){
    this.id=id;
    this.x=x;
    this.y=y;
    this.z=z;
}

After about 6 tables worth of that, it suddenly occurred to me that maybe there was no point at all in making these classes.

So my question is, in a JavaScript app, do I use "classes" for data types? or should I just "document" which fields/types are expected and so in the code instead of

a.push(new table1(5,1,2,3));

I would just have

a.push({id:5,x:1,y:2,z:3});

This may seem like a preferences question but it's a fundamental language question that I have as I try to understand how to model my app's data in JavaScript. Is there any advantage of the classes (with only data fields) or is it just a mistake. Thanks.

Answer 1

It depends,
Note: Most of the programmers coming from a strong OO language will have trouble like you in regard to JavaScript's functional behavior (you are not alone).

If you want to create something closer to C# I would do the following:

function Table1(id, x, y, z) {
  this.id=id;
  this.x=x;
  this.y=y;
  this.z=z;
}

Table1.prototype.mySpecialTable1Method= function()
{
  console.log(this.id);
};

Implementation:

var t = new Table1(1, 2, 3, 4);
t.mySpecialTable1Method();// outputs: 1

If you need to have methods that interact with the (soon to be) objects then I would definitely go with the code above. In addition it will make it clear when working with the objects that are related to a specific 'type' (naming the data).
But if your objects do not require any special "treatment" then I don't see any problem to use normal js object literals and pass them along (probably good for small projects).

Something along the lines:

var table1 = {};
table1.id = 1;
table1.x = 2;
table1.y = 3;
table1.z = 4;
console.log(table1.id); //outputs: 1

Extra reference:
http://www.youtube.com/watch?v=PMfcsYzj-9M
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Introduction_to_Object-Oriented_JavaScript

Update:
For the sake of readability and scalability and the point that you are coming from C# you may want to stick to the "class" implementation just because it will define the correlation between the raw data and the objects you are working with.
There is a good chance that you are going to work with some data that will probably be messy and unorganized.
MVC may be the solution for you. It tries to bring some order to the chaos that you are expecting. I recommend to check out some of them like: AngularJS or Ember.
Another solution may be reactive js - but mostly if you are going to interact with the DOM according to your data (ReactJS, and Facebook's React as some good ones).

As a note for security, I would like to add that mapping the data closely to the db isn't a best practice but its your call.

Answer 2

Javascript is a funny language, and there are plenty of ways to do things. An Object is an Object in Javascript with or without a name. {} is just a short-hand way to create one.

If you are going for readability, then your initial example would be the way to go.

If you just want to get the block of data into an array, then your second example is appropriate. Personally, I would use your later example if it is just data.

If you are using functions and what not as well as data storage, and plan on reusing it several times in your code, then yes, define your object and call it appropriately.

Answer 3

JavaScript has no classes, it is a functional language and a function is a first class citizen in js meaning that a function is an object.

From your example I can see that your intention for classes is simply to pass data and using json is perfect for this.