What is the internal mechanism behind the operation of JavaScript function parameters?

As someone who is new to programming, I've been struggling to understand how parameters and arguments work behind the scenes. For example:

function changeStuff(a) {
        return a = a * 10;
      }

var num = 10;
console.log(changeStuff(num)); //prints 100
console.log(num); //prints 10

When I use the changeStuff function, how exactly does JavaScript pass the variable num into the parameter a? Is it performing something like a = num internally?

I hope my question isn't too basic or silly.

Answer №1

To truly grasp the inner workings of this code, you would need to examine the compiled version rather than relying solely on this interpreted code. Register manipulation is not evident in this snippet, making it challenging to fully comprehend.

If we assume that this operates similarly to C++, when a function is called, its parameters are placed on the current stack. The function then accesses and manipulates these values accordingly.

In compiled code, there is no 'a' variable as seen here. With only a limited number of registers available, 'a' would likely be stored in one of those registers. Before storing it, the register's current value must first be pushed onto the stack. This ensures that once the function completes, the register can revert to its previous state for other parts of the program utilizing it.

For further reading on this topic, check out this informative resource.

Answer №2

In this scenario, Javascript duplicates the reference to the function a * 10 and assigns it to the variable a. As a result, the value of a becomes a * 10, which will then be calculated and returned.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Exploring the process of assigning responses to questions within my software program

I am looking to display my question choices as radio buttons in a modal window. I have tried several solutions without success. Here is my question module: import questions from "./Data"; const QuestionModel = () => { return ( <div cl ...

Encountering an issue with receiving "undefined" values while utilizing WordPress post metadata in AngularJS

Utilizing the Wordpress REST API v2 to fetch data from my functional Wordpress website to an AngularJS application. Everything is functioning properly, however when I attempt to access post meta such as "_ait-item_item-data", it returns an error stating "u ...

The deletion request using the form in Express is experiencing issues and not functioning properly

When attempting to delete data from a database using a form in node.js and express, I am encountering issues with the deletion process. It seems that there are only two methods available - get and post - and no specific delete method. router.js code rout ...

Any number of elements in a single JSX code snippet

In my React code, I've created a function called optionTemplate to be used as a prop in a React component. const optionTemplate = (option) => { return ( <div className="flex align-items-center gap-2" style={ ...

The use of jQuery ajax requests is leading to a refresh of the page

I've encountered an issue with a button on my HTML page that is not associated with any form. <input type='button' id='submitter' value='add'/> There is a click handler attached to it: $('#submitter').c ...

transferring the value of a textbox into another textbox

I am trying to extract the value from one textbox and transfer it to another textbox. Here is my current code: <input type="text" value="Keyword" id="one" /> <input type="text" value="Search" id="two" /> <a href="#" id="btn">button</ ...

React.js: Why does the array index change after dropping an element?

When I create a table with items in a checkbox list, the issue arises; after selecting and submitting some items, the index of the remaining items changes. Consequently, re-submitting the remaining items becomes impossible. Below is my code snippet: expo ...

Transfer the Vue query parameter from the current route to the router-link

Why is it so challenging to detect and pass query parameters in Vue components? I'm trying to access the router from my component, but nothing seems to be working. How can I achieve this? <router-link :to="{ path: '/', query: { myQue ...

Exploring the power of V-for with checkboxes in VueJS

One issue I am facing is related to triggering my save method only when a checkbox is selected or true in Vue JS. I have no problem listing values and saving them to the database using axios, Vue JS, and Spring Boot. However, every time I click the checkbo ...

Manipulate Attributes in Javascript

Having an issue here - I'm trying to use JavaScript to set some attributes. for(i=0;i<div_navi.childNodes.length;i++){ if(div_navi.childNodes[i].nodeName =="SPAN"){ div_navi.childNodes[i].setAttribute("onclick","g ...

Is there a way to substitute the function variable using JavaScript?

Is there a method to dynamically replace the variable 'abc' with 'cde' in HTML using JavaScript? For example, if I have the following code: <table width="150" border="0" cellspacing="0" cellpadding="2" id="productBox"> <tr> ...

Is it possible to create Interactive Tabs using a Global BehaviorSubject?

Trying to adjust tab visibility based on different sections of the Ionic app, an approach involving a global boolean BehaviorSubject is being utilized. The encapsulated code has been condensed for brevity. In the provider/service globals.ts file, the foll ...

The ".splice()" method continuously removes the final element from an array

I have implemented a function on my form that allows me to add multiple file inputs for various images by clicking a button. Although this functionality is working correctly, I am facing an issue while trying to delete an input field using .splice. Instead ...

Navigating Pre-Fetched Client Routes in Gatsby with @ReachRouter

Let's consider this scenario. Imagine a user enters /company/<company-id> in the address bar. Because the app is completely separate from the backend, it must prefetch the companies. The usual flow is /login -> /company/. Handling this sequenc ...

I am attempting to incorporate an NPM package as a plugin in my Next.js application in order to prevent the occurrence of a "Module not found: Can't resolve 'child_process'" error

While I have developed nuxt apps in the past, I am new to next.js apps. In my current next.js project, I am encountering difficulties with implementing 'google-auth-library' within a component. Below is the code snippet for the troublesome compon ...

Angular Translate - Utilizing translate-values attribute for translation

Having trouble using angular translate with dynamic translation values that need to be translated first. If you want a better explanation of the issue, check out this plunker: PLUNKER <p translate="PARAGRAPH" translate-values="{username: ('us ...

What is the best way to access HTML attributes within a JavaScript function when working with a dynamic element?

When a user interacts with an HTML element on my website, I aim to display the attributes of that specific element in a new browser tab. An example of such an HTML element is: <a id="d0e110" onclick="GetWordFile(this.id)" attr1="attr1_value" attr2="at ...

React/NextJS: Firebase Realtime Database displaying the message "Error: Client is offline"

Encountering an occasional error when using React with NextJS to fetch data from a Firebase Realtime Database. Unhandled Runtime Error Error: Error: Client is offline. Currently utilizing Firebase version 9.0.1 for React. The initialisation and configura ...

Is there a way in Angular Material to consistently display both the step values and a personalized description for each step?

Is there a way to display both numerical step values and corresponding custom text in Angular Material? I prefer having the number at the top and the descriptive text at the bottom. Check out this image for reference: https://i.stack.imgur.com/LGMIO.png ...

What is the best way to execute operations on two distinct datasets within a single function using RxJS?

Is there a way to perform operations on two separate data collections within a single function in RxJS, returning an observable instead of void? This function is located within a service and I intend to subscribe to it from my component. I believe some re ...