There is a lot of confusion among developers regarding arguments and parameters. They used these two terms interchangeably. But actually, parameters refer to the variables that are declared in function definition or declaration. On the other hand, arguments are the values that are passed to the function during a function call.
function add(a, b){
console.log(`Sum of ${a} and ${b} is ${a+b}`);
}
add(5, 10);
In the above code, 5 and 10 are arguments. Variables a and b are parameters.
Note: Parameters are also known as formal arguments, whereas arguments are called actual parameters.
Before you start with this tutorial, you should know object destructuring. Refer to What is Object Destructuring in JavaScript for complete information about it.
In this tutorial, you will learn how to use object destructuring as a function parameter. In general, you use variables, arrays and objects as function parameters, but ES6 specifications allow you to extract function arguments using object destructuring. Let's understand this with the help of an example:
let product = {
pdtName:'Amazon Echo Dot',
pdtPrice:39.99,
pdtQuantity:25
};
function TotalPrice({pdtPrice, pdtQuantity}){
return pdtPrice*pdtQuantity;
}
let total = TotalPrice(product);
console.log(`The total price is ${total}`);
In the above code, the product object is passed to TotalPrice() function. In TotalPrice() function, product price and quantity are extracted from the product object using destructuring.
