All TalkersCode Topics

Follow TalkersCode On Social Media - A Social Media Network for developers Join Now ➔

Call By Value And Call By Reference In JavaScript

Last Updated : Mar 11, 2024

Call By Value And Call By Reference In JavaScript

In this tutorial we will show you the solution of call by value and call by reference in JavaScript, here we are going to show you both of them with some example.

We have to know first thing is call by value will change its value when we update with differ value if we print them each value it shows but call by reference is its contrast because it once update with new value then result will maintains the recent updated value in both definition.

Step By Step Guide On Call By Value And Call By Reference In JavaScript :-

Here we defined variable ‘a=24’ with value then we defining variable ‘b’ and assigning value as a’s value then we changed a value to ‘8’. Finally we printing both variables value on console with call by value heading.

We declared variable ‘c’ with key ‘msg’, value ‘Hi Everyone’ string message and we declared variable ‘d’ then we assigning c value to ‘d’.

We sets c’s msg value with new string then finally we printed both ‘c,d’ on console with heading call by reference.

<!DOCTYPE html>
        <title>CALL BY VALUE & CALL BY REFERENCE</title>
            var a=24;
            var b=a;
            console.log("Call By Value Result");
            var c={msg:'Hi Everyone'};
            var d;
            c.msg="Welcome All";
            console.log("Call By Reference Result");
  1. <!DOCTYPE html> tag which is instruct the web browser about what version of HTML file written in and it’s not have any ending tag.
  2. The<html> tag is used to indicate the beginning of HTML document.
  3. As above shown <head> tag is contain information about webpage and external file links are declared here. <title> tag is used for set the webpage title.
  4. Both <head> and <title> tags having their pair end tag, so we need to close the ending tags respectively. If you’re not closed anyone of ending tag properly that is also affect the webpage result.
  5. <body> tag is beginning of main coding part because it contain coding of entire website blocks and elements described here.
  6. In script we declared variable ‘a’ with value ‘24’ then we defined another variable ‘b’. We assigns a value to ‘b’ and for variable ‘a’ we sets new value ‘8’.
  7. Then we printed ‘a, b’ on console there we can see two different values because it won’t change with address.
  8. Now we defining variable ‘c’ with key ‘msg’, value ‘Hi Everyone’ string then we defined another variable ‘d’. Here we sets c value to variable ‘d’ and we changing c’s key ‘msg’ value as ‘Welcome All’.
  9. At last we printed both ‘c, d’ variables on console. For seeing console result we need to use shortcut ‘ctrl+shift+j’ then at right hand side console panel will open with results.
  10. Both </body>,</html> tags closed respectively. </body> tag indicates the end of body, Then </html> tag indicates the end of HTML document.

Conclusion :-

In conclusion now we are able to know how to use call by value and call by reference in JavaScript.

When we executes program on browser we can’t see anything so we have to open console panel as we said at last point of explanation because we printed result on console only. In console we can see results of ‘Call By Value Result, 8, 24 and Call By Reference Result, {msg: 'Welcome All'}, {msg: 'Welcome All'}’.

Now we can understand how both will work call by value not affect’s old value but call by reference totally changed with recent value because it gets affected from its address.

I hope this tutorial on call by value and call by reference in JavaScript helps you and the steps and method mentioned above are easy to follow and implement.

Author Image About Riya

A recent graduate with a Bachelor of Technology (B.Tech) in Computer Science from India. She is passionate about leveraging technology to solve real-world problems. With a strong foundation and experience in programming languages such as Python, Django, HTML, CSS, and JavaScript, java, php and have honed her skills through hands-on projects and coursework.

Follow Riya On Linkedin 🡪