Methods in objects
Methods in JavaScript programming are user-created functions that are stored and processed in the properties format order of a declared object in the current function. Methods in JavaScript programs are used to apply operations to the data of a declared program object or to perform multiple actions related to the declared object. Methods are defined in the program object properties order, while the value of these method objects is treated like a function.
Defining methods objects in JavaScript programs.
In any declared JavaScript program, function object methods can be added to the object in the function expression order or by using simple method syntax.
Using function expressions in object methods.
JavaScript programmers can define object methods inside the object by applying function expressions. You can define it like a basic function, while in the current function a single or multiple properties of the object can be assigned.
Example of methods objects.
let employee = {
compname: “Vcanhelpsu”,
empcont: 94,
displayinfo: function() {
console.log(“Hi, best for programming ” + this.compname);
}
};
employee.displayinfo(); // Result – Hi, best for programming Vcanhelpsu
Explanation of Example of methods objects.
In this program example, the displayinfo method is defined in the order of a function expression, and it is assigned to the displayinfo property of the employee object. This function uses this.compname to access the compname property of the object in the method.
Using shorthand method syntax in object methods (ES6).
ES6 introduces a shorthand syntax for defining methods in objects. This syntax is more concise than using the function keyword, and is a popular way to define methods in modern JavaScript.
Syntax of shorthand in object method.
let objectName = {
methodName() {
// define your custom function body method
}
};
Example of shorthand in object method.
let employee = {
empname: “Siddhi”,
empcont: 40,
displayempinfo() {
console.log(“Hi, Employee name is – ” + this.empname);
console.log(“Hi, Employee contact is – ” + this.empcont);
}
};
employee.displayempinfo(); // Result – Hi, Employee name is – Siddhi
Explanation of shorthand in object method.
In this program, displayempinfo() method is defined by applying shorthand method syntax. Which behaves like a basic function.
Use of this keyword in object methods.
In a JavaScript program, the value of this keyword for a declared method object indicates the object value information to which it is connected. Here this keyword provides you permission to access the properties and other methods of the object in that program object.
Example of this keyword in object methods.
let employee = {
empname: “Bhavishi”,
empcont: 91,
displayempinfo() {
console.log(“Hi, employee name is – ” + this.empname + ” ,and this her contact number – ” + this.empcont + “”);
}
};
employee.displayempinfo(); // Result – Hi, employee name is – Bhavishi ,and this her contact – 91 number
Explanation of this keyword in object methods.
In this program, displayempinfo() method is used to access empname and empcont object properties in employee object using this.empname and this.empcont methods.
Object methods with JavaScript parameters.
In JavaScript program, method parameters are accepted in declared function objects just like basic functions.
Example of object methods with parameters.
let employee = {
empname: “Siddhi”,
displayempinfo(otherempName) {
console.log(“Hi – ” + otherempName + “, And my name is – ” + this.empname);
}
};
employee.displayempinfo(“Bhavishi”); // Result – Hi – Bhavishi, And my name is – Siddhi
Explanation of object methods with parameters.
In this program, the displayempinfo() method accepts otherempName as a parameter format, applies it to the program output, but accesses the empname property of the employee object.
Returning values from JavaScript object methods.
Methods in JavaScript function programs can return values just like basic or regular functions. These returned function program values can be anything, such as a numeric, string, object, or other types of user-defined data types.
Example of returning values from object methods.
let employee = {
empname: “Harry”,
empid: 20,
displayinfo() {
return “Hy, my name is – ” + this.empname + ” and this is my employee id – ” + this.empid + “”;
}
};
console.log(employee.displayinfo()); // Result – Hy, my name is – Harry and this is my employee id – 20
Explanation of returning values from object methods.
In this program, the displayinfo() method returns a string value containing the properties of the employee object, empname and empid attributes.
Methods that modify object properties in a JavaScript program.
In a JavaScript function program, the method declaration can also modify the properties of the object to which it is attached.
Example of modifying object properties.
let employee = {
empname: “Siddhi”,
empage: 30,
awarded() {
this.empname; // here this keyword use with empname property
console.log(“Hi employee, You are awarded ” + this.empname + ” with javascript certificate”);
}
};
employee.awarded(); // Result – Hi employee, You are awarded Siddhi with javascript certificate
Explanation of modifying object properties.
In this program, the awarded() function method modifies the empame properties of the employee object.
JavaScript function method chaining.
JavaScript allows you to chain features together to multiple method calls. This feature works when function methods return a this value, which references the object in the current function, allowing you to call methods on the same function object.
Example of function method chaining.
let employee = {
empname: “Harry”,
empage: 30,
displayName(modifyName) {
this.name = modifyName;
return this; // here it Returning this allows method chaining features
},
displayAge(modifyAge) {
this.age = modifyAge;
return this; // here it Returning this allows method chaining features
},
empinfo() {
console.log(“Hi, employee name is – ” + this.empname + ” , and his age is – ” + this.empage + ” year”);
return this; // Returning ‘this’ allows method chaining
}
};
employee.displayName(“David”).displayAge(33).empinfo();
// Result – Hi, employee name is – Harry , and his age is – 30 year
Explanation of function method chaining.
Here displayName, displayAge and empinfo() methods return this value, which makes method chaining features possible. Where programmers can call all three methods in a single line in a program, and empinfo method will use the updated properties.
Methods with this context in JavaScript.
In JavaScript programs, the value of this keyword depends on how the method is invoked in the function. If the current function method is not called as a method of an object, then here this keyword cannot properly reference that object. This can be a problematic condition for you, especially when you pass methods to a function.
Example of methods with this context problem.
let employee = {
empname: “Harry”,
empinfo() {
console.log(“Hi, employee name is ” + this.empname);
}
};
let empinfoFunction = employee.empinfo;
empinfoFunction(); // Result – Hi, employee name is undefined
Explanation of methods with this context in JavaScript.
In this program empinfo is assigned to a different variable (empinfoFunction), so inside the function method this no longer refers to the employee object. It defaults to undefined in strict mode.
Solution in JavaScript function: Use .bind().
JavaScript programmers can use the .bind() function method to explicitly set the this keyword reference for a function.
let employee = {
empname: “Harry”,
empinfo() {
console.log(“Hi, employee name is ” + this.empname);
}
};
let empinfoFunction = employee.empinfo.bind(employee); // here we use bin’this’ to the ’employee’ object prperties
empinfoFunction(); // Result – Hi, employee name is Harry
Explanation of the use of .bind() in JavaScript function resolve.
In this program, the .bind() method is used to create a new function where the this keyword is always bound to the employee object, no matter how the function object is called in the program.
Summary of Methods in Objects in JavaScript.
Methods in a JavaScript program are user-defined object functions that are stored and processed as properties in an object.
- Accessing function methods – Methods in a JavaScript function program are accessed and processed using features such as dot notation, e.g. object.method() or bracket notation, e.g. object[“method”]().
- this keyword – Inside a declared function method, this keyword references the object itself, allowing you to access other function object properties and methods.
- Method chaining – If methods in a function program return a this value, you can chain them, allowing you to call multiple methods in a single function object statement.
- this binding – If JavaScript function methods are passed as standalone functions, they may lose the correct reference for the this keyword. Here you need to explicitly update the this keyword value by using the .bind() function method to make it a property.
