Copy variables in ECMAScript, and pass parameters to functions

Original and reference values

ECMAScript variables can contain two different types of data: raw and reference values

• The original value

  • Is stored in theThe stack (stack)Simple data segments in, whose values are stored directly where variables are accessed.
  • Contains 6 types: Undefined, Null, Boolean, Number, String and Symbol.
  • Stored on the stack because such primitive types occupySpace is fixed, so you can store them inThe smaller memory area -- the stackIn the. It’s easy to storeQuickly look up the value of a variable.

• Reference value

  • Is stored in theHeap (heap)That is, the value stored at a variable is a pointer to the memory where the object is stored.
  • Why it’s stored in the heap: The size of the reference value willchange(such as object properties, etc.), so do not put it on the stack, otherwise it will slow down the variable search. Instead, the value placed in stack space isThe address where the object is stored in the heap, and the address size is fixed, so storing it on the stack has no negative impact on variable performance.

Duplicate values

• JavaScript does not allow direct access to memory locations, that is, objects stored in heap memory.
• So when you access an object, you’re actually operating on that objectreference(object inAddress in heap memory), and then use this address to get the value of the object, that isAccess by reference.
• Values of primitive types (stack memory values) are directly accessible.

Copy of the original value

When assigning an original value from a variable to another variable, the original value is copied directly to the location of the new variable. These two variables can be used independently of each other.

let num1 = 5;
let num2 = num1;
Copy the code

In this case, the variables a and B are completely independent but have the same value because b’s value is a copy of A’s value.

Copy of a reference value

• When a reference value is assigned from one variable to another, the value stored in the variable is copied to the location of the new variable. The difference is that the value copied here is actually a pointer to the value stored inHeap memoryObject in.
• After the operation is complete, both variables actually refer to the same object, so changes on one object are reflected on the other.

let obj1 = new Object(a);let obj2 = obj1;
obj1.name = "Nicholas";
console.log(obj2.name);  // "Nicholas"
Copy the code

In this example, by definition ‘the value stored in the variable will also be copied to the location of the new variable’, where the copied value is actually a pointer to obj1, the object’s address 0x1234, so that both obj1 and obj2 refer to the same object in heap memory.

Passing parameters

Remember: arguments to all ESMAScript functions are passed by value!!

How to remember: Function arguments are passed by value, using the same mechanism as copying values. That is, the original value copies the value directly, and the reference value copies the address of the object.

Here are three classic Examples from the Little Red Book to illustrate how to remember function argument passing.

The original value is the input parameter to the function

example 1:

function addTen(num) { Num is a local variable
    num += 10;
    return num;
}

let count = 20;
let result = addTen(count);
console.log(count);    // 20, no change
console.log(result);   / / 30
Copy the code

In this example:

• The function addTen() takes one argument, num, which is actually oneA local variableThe function is destroyed when it finishes executing.
• When called, the function takes count, which is oneThe original value.
• Since the parameter of the function is”Pass by value“, so copy the original value and pass it to the function.
• Next, following the original copy mechanism, copy the value of count, pass it into the function, and assign it toThe num variable in the scope of the function.
• The argument num and the variable count do not interfere; they just happen to hold the same value.

Arguments to ECMAScript functions are local variables.

Reference values as input arguments to the function

example 2:

function setName(obj) {
    obj.name = "Nicholas";
}

let person = new Object(a); setName(person);console.log(person.name);    // "Nicholas"
Copy the code

In this example:

• When called, the function’s entry parameter is Person, which is oneReference value (object).
• So the reference value is copied and passed to the function.
• Next, following the reference-value copying mechanism, we pass a copy of the value of Person into the function, in which case the value of the local variable obj is passedThe address of the person.

example 3:

function setName(obj) {
    obj.name = "Nicholas";
    obj = new Object(a);// Please pay attention to these two sentences
    obj.name = "Greg";    // Please pay attention to these two sentences
}

let person = new Object(a); setName(person);console.log(person.name);    // "Nicholas"
Copy the code

In this example:

• When called, all the steps up to obj = new Object() are unchanged, and the argument passed to the function is the address of the Person Object in heap memory.
• After executing obj = new Object(), theA new segment of heap memory has been createdtheaddressObj is assigned to obj, so the value of OBj is changed to point to the new memory address instead of the address value of Person. The value of person has not changed, so the pointer has not changed.

conclusion

Always remember:

• Variables are stored inStack memory;
• Objects are stored inHeap memory;
• The type of value stored in a variableThe original value, one isObject reference (object address);
• Function parameter passing, followPass by valueThe principle that can be remembered as transmission isStack memoryIs either a raw value or an address.

reference

• JavaScript Advanced Programming (4th edition) P83-P86
• ECMAScript original and reference values
• Does javascript pass parameters by value or by reference if they are object