3

Statement:

Javascript can create an Object without creating a class.

Is that statement valid? Maybe I didn't get the concept here right...

For example if I create an object in Javascript:

var mercedes = new Object();
mercedes.speed = "260";
mercedes.model = "SLS";
mercedes.year = 1969;

Here I have no class but I already have an instance. Does that mean I don't need to define classes in Javascript?

Also one more question what is the difference in Javascript between creating a object as described above and creating an object in the following method: 

myCar["speed"] = "260";
myCar["model"] = "SLS";
myCar["year"] = 1969;
dj bazzie wazzie
  • 3,472
  • 18
  • 23
Nant
  • 569
  • 2
  • 10
  • 24
  • Objects are created like this: `var obj = {}`. in javascript (almost) everything is an object. class instances are just special objects that come from constructors. You can think about `Object` as the parent class for everything in javascript. – Louay Alakkad Jan 26 '16 at 23:08

4 Answers4

4

In javascript there are no classes. That being said you can simulate classes using few different ways.

Using a function and defining methods to its prototype

var Person = function(firstName, lastName) {
    this.firstName = firstName;
    this.lastName = lastName;
}; 

// you can define Person.fullname = function() {} straight to the function
// drawback to this is fullname function will be created everytimg you create a new Person
// instead you can create fullname in the prototype of the Person so it only gets created once 

Person.prototype.fullname = function() {
    return this.firstName + ' ' + this.lastName;
};

var person = new Person('John', 'Doe');
person.fullname(); // John Doe

Using object literals

var Person = {
    firstName: 'John',
  lastName: 'Doe',
  fullname: function() {
    return this.firstName + ' ' + this.lastName;
  }
};

Person.fullname(); // John Doe

Person.firstName = 'Jane';
Person.fullname(); // Jane Doe

Using Singleton

var person = new function() {
    this.firstName = 'John';
    this.lastName = 'Doe';
    this.fullname = function() {
      return this.firstName + ' ' + this.lastName;
    };
}; 

person.fullname(); // John Doe

person.firstName = 'Jane';
person.fullname(); // Jane Doe

If you are planning to get more closer to how java classes work, apply inheritance, etc then I suggest you to go with the first method. Below is example of a simple inheritance using prototype.

var Person = function(firstName, lastName) {
    this.firstName = firstName;
    this.lastName = lastName;
}; 

Person.prototype.fullname = function() {
  return this.firstName + ' ' + this.lastName;
};

Person.prototype.getFirstName = function() {
    return this.firstName;
};

Person.prototype.getLastName = function() {
    return this.lastName;
};

Person.prototype.setLastName = function(lastName) {
    return this.lastName = lastName;
};

Person.prototype.setFirstName = function(firstName) {
    return this.firstName = firstName;
};

var Student = function(firstName, lastName, grade) {
    this.grade = grade;
  Person.call(this, firstName, lastName);
};

Student.prototype = Object.create(Person.prototype);

Student.prototype.getGrade = function() {
    return this.grade;
};

var student = new Student('John', 'Doe', '5th');
student.fullname(); // John Doe
student.getFirstName(); // John
student.setFirstName('Jane');
student.getFirstName(); // Jane
student.getGrade(); // 5th

That should explain how you can use classes in javascript similar to you are used to in java.

What is difference between using dot notation and brackets to access object properties?

Long answer short, both behave exactly the same. But there would be instances where dot notation will not always work. For example:

var person = {
    "first name": "john",
    "last name": "doe",
    "fullname": "john doe"
};

person.fullname; // john doe

// to access first name property of person
person.first name; // will not work
person["first name"]; // john
Subash
  • 7,098
  • 7
  • 44
  • 70
3

There are classes in javascript. But you can also inherit an object properties using the .prototype property. This W3School's article can explain it better.

For your second question there's no real difference when you use brackets or dot properties. Accesing properties using brackets can be useful when you use a variable to access an object property. Example:

 var obj = {}:
 var val = 'value';
 obj[val] = 'new value';
 console.log(obj[val]); // Output: new value

The above can also work with:

var obj = { 'value' = 'new value'};
var val = 'value';
console.log(obj[val]); // Output: new value
Fernando Salas
  • 406
  • 4
  • 11
2

This has been answered several times on SO already, so I'll just link a very good answer I often referred to when learning javascript: https://stackoverflow.com/a/387733/3299157

A quick answer though, yes you can create an object in Javscript without creating a traditional Object-Oriented class. And to your second question, there's no discernible difference when using the "brackets style".

Community
  • 1
  • 1
Ageonix
  • 1,748
  • 2
  • 19
  • 32
1

JavaScript has no concept of class. Instead of defining classes from the beginning, with JavaScript you can just write code.

With bracket notation you can dynamically decide which property to access, and you can use special characters in property name.

var prop = "speed";
myCar = {};  // create a object
myCar[prop] = "260"; // using dynamically property
myCar["speed.a"] = "265"; // using special characters

reference: The Principles of Object-Oriented JavaScript, Nicholas C. Zakas

Douglas Gomes
  • 46
  • 3