자바스크립트의 값 전달 방식

• 원시 값을 변수에 할당하면 변수에는 실제 값 저장
• 객체를 변수에 할당하면 변수에는 참조 값 저장

---

• 원시값을 갖는 변수를 다른 변수에 할당하면 원본의 원시값이 복사되어 전달
• 객체를 가리키는 변수를 다름 변수에 할당하면 원본의 참조 값이 복사되어 전달

값에 의한 전달(Call by Value)

변수에 원시값을 갖는 변수를 할당 → 할당 받는 변수(copy)에는 할당되는 변수(score)의 원시값 복사되어 전달

let score = 80;
let copy = score;

console.log(score); //80
console.log(copy); //80
console.log(score === copy);//true

score = 100;

console.log(score); //100
console.log(copy); //80
console.log(score === copy); // false

“변수에는 값이 전달되는 것이 아니라 메모리 주소가 전달되는 것이다.”

단, 전달된 메모리 주소를 통해 메모리 공간에 접근하면 값을 참조할 수 있다.

참조에 의한 전달(Call by Reference)

let person = {
  name: "Lee",
};
let copy = person;

console.log(person === copy); //true

//copy를 통해 객체 변경
copy.name = "Kim"; 
//person을 통해 객체 변경
person.address = "Seoul";

console.log(person);//{name: 'Kim', address: 'Seoul'}
console.log(copy);//{name: 'Kim', address: 'Seoul'}

원본과 사본 모두 동일한 객체를 가리킨다.⇒ 두개의 식별자가 하나의 객체를 공유한다는 것

따라서 원본 또는 사본 중 어느 한쪽에서 객체를 변경하면 서로 영향을 받는다

let person1 = {
  name: "Lee",
};
let person2 = {
  name: "Lee",
};

console.log(person1 === person2); //false
console.log(person1.name === person2.name); //true

⇒ person1 변수와 person2 변수가 가리키는 객체는 비록 내용은 같지만 다른 메모리에 저장된 별개의 객체이므로 person1변수와 person2 변수의 참조값은 전혀 다른값이다.

⚠️  자바스크립트는 Call by Reference를 사용하지 않는다.

공유에 의한 전달(Call by Sharing)

• 참조값(메모리 주소)이 복사되어 전달되지만, 직접 참조가 아니라 “참조의 복사본”을 전달하는 방식이다. ⇒ 참조 제체는 Call by Value로 전달됨
  
• 객체 또는 배열의 내부 속성을 변경하면 원본이 변경되지만 새로운 객체를 할당하면 원본은 변경되지 않는다.

비교 항목	Call by Reference	Call by Sharing
참조 전달 방식	원본의 주소(메모리 위치) 자체가 전달	참조값의 복사본 전달
객체 속성 변경	원본 변경	원본 변경
새로운 객체 할당	원본이 새로운 객체로 변경	원본 변경되지 않음
(새로운 객체를 할당하면 원본과의 연결이 끊어짐)
사용 언어	C / C++ , C# 등	Java, Python, JavaScript, Ruby 등

---

예시

function change(a, b, c) {
    a = 'a changed'
    b = { b: 'changed' };
    c.c = 'changed';
}

let a = 'a unchanged';
let b = { b: 'unchanged' };
let c = { c: 'unchanged' };

change(a, b, c);

console.log(a, b, c); //'a unchanged'  { b: 'unchanged' }  { c: 'changed' }

function change(a, b, c) {
    a = 'a changed'
}

⇒ a 는 원시값으로 원본의 원시 값이 복사되어 전달되어 함수 내부에서 변경해도 원본에 영향을 주지 않는다.

function change(a, b, c) {
    b = { b: 'changed' };
}

• b 는 객체이므로 원본의 참조값이 복사되어 전달된다.

⇒ b = { b: 'changed' }; 를 실행하면 b는 새로운 객체를 참조하지만 원래 객체를 변경하는 것이 아니므로 외부의 b는 여전히 원래 객체 { b: ‘unchanged’ } 유지한다.

function change(a, b, c) {
    c.c = 'changed';
}

• c 는 객체이므로 원본의 참조값이 복사되어 전달된다.

⇒ `c.c = 'changed`` 는 기존 객체 c의 속성을 직접 변경하는 것이므로 사본 객체도 영향을 받는다.

따라서 결과는

'a unchanged'  { b: 'unchanged' }  { c: 'unchanged' }

이다.