It's no exaggeration, everything in JavaScript can be constructed to be objects, be it strings, numbers, etc.
See the example below:
const name = "Monica"
typeof name; // string
const toObj = new Object(name);
typeof toObj; // object
Also, the regular { ... } syntax in the previous article only allows the creation of a single object. It is possible to create multiple similar-objects as well.
Everything is an Object in JavaScript -
Audio,Date, etc.
const date = new Date();
const hrs = date.getHours();
const mins = date.getMinutes();
const secs = date.getSeconds();
const msecs = date.getMilliseconds();
const time = `The time is ${hrs}:${mins}:${secs}:${msecs}`;
console.log(time);
Constructor Function
The constructor functions are like the regular function declaration. The exception is that the initial letter of the function name is always in uppercase.
See the example below:
function Person(name, age) {
this.name = name;
this.age = age;
}
const person = new Person("Monica", 53); // instantiation
console.log(person.name, person.age); // Monica 53
It can be rewritten in form of an anonymous function but not in form of an arrow function.
const Person = function(name, age) {
this.name = name;
this.age = age;
}
const person = new Person("Monica", 53); // instantiation
console.log(person.name, person.age); // Monica 53
The above code snippet is the same below:
class Person {
constructor(name, age) {
this.name = name;
this.age = age;
}
}
const person = new Person("Monica", 53); // instantiation
console.log(person.name, person.age); // Monica 53
A new object was constructed by the new operator.
The process of creating a new object is called instantiation. To create more similar objects, instantiation is needed.
const person1 = new Person("Monica", 53);
console.log(person1.name, person1.age); // Monica 53
const person2 = new Person("John", 53);
console.log(person2.name, person2.age); // John 34
We can rewrite the entire code snippet as shown below:
const person = new function Person(name="Monica", age=53) {
this.name = name;
this.age = age;
};
console.log(person.name, person.age); // Monica 53
The syntax above can not be called again.
Return from constructor
If return is called with an object, then the object is returned instead of this object.
function Person(name, age) {
this.name = "Monica";
this.age = 53;
return { name: "John", age: 34};
}
console.log(new Person().name, new Person().age); // John 34
The code above is the same below:
const person = new function Person(name="Monica", age=53) {
this.name = name;
this.age = age;
return { name: 'John', age: 34 }
};
console.log(person.name, person.age); // John 34
If return is empty, then this object is returned.
function Person(name, age) {
this.name = "Monica";
this.age = 53;
return;
}
console.log(new Person().name, new Person().age); // Monica 53
Methods in the constructor
A function used on an object is a method.
object.method()
See the example below:
function Person(name, age) {
this.name = name;
this.age = age;
this.saying = function() {
return `${this.name} is ${this.age} years old.`;
};
}
const person = new Person("Monica", 53);
person.saying(); // "Monica is 53 years old."
The syntax used sp far is the old syntax of creating classes.
The syntax above almost looks like the syntax in creating objects. This is because classes are the blueprint to an object. It describes the object.
Let's recall how objects are created and compare it with the examples above. See below:
const Person = (name, age) => {
return {
name: name,
age: age,
saying() {
console.log(`${name} is ${age} years old.`);
}
}
};
const person = Person("Monica", 53);
person.saying(); // "Monica is 53 years old."
But we can use a destructuring technique, called property value shorthand, to save ourselves some keystrokes.
const Person = (name, age) => {
return {
name,
age,
saying() {
console.log(`${name} is ${age} years old.`);
}
}
};
new target function check
To check if a function was called with new. It is checked by having the new.target property it.
If
new.targetproperty in the constructor mode returns the function name, thenewoperator was used with the function. Otherwise, it returnsundefined.
See the example below:
function Person(name, age) {
this.name = name;
this.age = age;
console.log(new.target); // [Function: Person]
}
const person = new Person("Monica", 53); // instantiation
console.log(person.name, person.age); // Monica 53
Top comments (0)