Introduction About Object in Javascript
buayaberdiri.blogspot.com - In JavaScript, everything is an object. Even simple data types like numbers and strings are objects under the hood. Objects in JavaScript are the fundamental building blocks of the language and allow for powerful programming techniques like object-oriented programming.
What is an Object in JavaScript?
An object is a collection of key-value pairs in JavaScript. Keys are also called properties, and values can be any data type, including other objects. In other words, an object in JavaScript is a container for data that has properties and methods.
Properties are like variables that hold values. They can be accessed and modified using dot notation or square bracket notation. For example, consider the following object:
let person = {
firstName: 'Buaya',
lastName: 'Berdiri',
age: 30,
fullName: function() {
return this.firstName + ' ' + this.lastName;
}
};
This object has four properties: firstName, lastName, age, and fullName. The first three are simple properties that hold values, while the last property is a method that returns the person's full name.
You can access and modify properties using dot notation or square bracket notation, like this:
console.log(person.firstName); // Output: 'Buaya'
person.age = 40;
console.log(person.age); // Output: 40
console.log(person['fullName']()); // Output: 'Buaya Berdiri'
In the first example, we use dot notation to access the firstName property of the person object. In the second example, we use dot notation to modify the age property. In the third example, we use square bracket notation to access the fullName method of the person object.
Methods are functions that are associated with an object. They can be called using dot notation, like this:
console.log(person.fullName()); // Output: 'Buaya Terbang'
In this example, we call the fullName method of the person object using dot notation.
Creating Objects in JavaScript:
There are several ways to create objects in JavaScript. The most common way is to use object literal notation, which is what we used in the previous example:
let person = {
firstName: 'Buaya',
lastName: 'Terbang',
age: 30,
fullName: function() {
return this.firstName + ' ' + this.lastName;
}
};
Object literal notation allows you to define an object and its properties in a single statement.
Another way to create objects is to use the new keyword with a constructor function. Constructor functions are functions that are used to create objects. They are called using the new keyword, like this:
function Person(firstName, lastName, age) {
this.firstName = firstName;
this.lastName = lastName;
this.age = age;
this.fullName = function() {
return this.firstName + ' ' + this.lastName;
}
}
let person = new Person('John', 'Doe', 30);
In this example, we define a constructor function called Person that takes three parameters: firstName, lastName, and age. The function creates a new object and assigns the parameters to its properties. It also defines a fullName method for the object.
We create a new object using the new keyword and the Person constructor function.
You can also create objects using the Object.create() method or by using a class, which is a new feature introduced in ES6.
Inheritance in JavaScript:
JavaScript supports inheritance through prototypes. Every object in JavaScript has a prototype object, which is used to inherit properties and methods from other objects. When you access a property or method on an object, JavaScript first looks for it on
See the article about javascript here:
- Learn Array Method - forEach, map, reduce, filter
- Learn Basics Array In Javascript
- Learn Basics Asynchronous In Javascript
- How To Change String Value Using Replace in Javascript
- How to Learn a Calculator Basic in Javascript
- What Are Switch in Javascript And How to Use Them
- Create a Calculator Using the Python Flask Framework
- Basic Learning to Make a Calculator With PHP and HTML
- How to Use a FOR Loop in Javascript
Check out other articles about HTML & CSS:
- Learn Input Types In HTML For Login And Register Form
- Learn HTML List - How To Create Square, Circle, Number List
- How To Create Comments Line In HTML
- How to Add Text Formatting In HTML
- Adding The Fieldset Code To The Form In HTML
- How to Create a Search Box in Pure HTML
- Create Color Charts With Pure HTML
- How to change font size using CSS
- Types of Border Styles in CSS Code
- How to Change the Background Color in CSS