데이터 분류 | 자료형 | 전달방식 |
원시데이터 | number, string, boolean, null, undefined,Symbol | call by value |
복합데이터 | object(array) | call by object |
자바스크립트에서도 call by value, call by reference가 있다.
이 call by value와 call by reference는 쉬운 개념처럼 보이지만
헷갈리게 될 경우 처리에 차이가 나게 된다.
그렇다면 call by value와 call by reference란 무엇일까
한국어로 하면 값에 의한 전달과 참조에 의한 전달인데,
변수메모리에 할당되는 데이터 내용에 의한 차이이다.
값에 의한 전달인 call by value는 원시타입의 데이터를 그대로 넣어둔다
let cbv = 1이라면 cbv가 가리키는 메모리안에는 1이 저장된다.
그렇다면 let copy = cbv가 될 경우 cbv가 가리키는 메모리 주소에는 무엇이 저장될까 역시 1이 저장된다.
만약 copy에 2를 재할당한다면 copy와 cbv는 각각 어떻게 될까?
let cbv = 1;
let copy_cbv = cbv ;
console.log(`let cbv = 1;
let copy_cbv = cbv ;`);
console.log(`// 결과 cbv=${cbv}`);
console.log(`// 결과 copy_cbv=${copy_cbv}`);
console.log(`copy_cbv = 2;`);
copy_cbv = 2;
console.log(`// 결과 cbv=${cbv}`);
console.log(`// 결과 copy_cbv=${copy_cbv}`);
node call_variable.js
let cbv = 1;
let copy_cbv = cbv ;
// 결과 cbv=1
// 결과 copy_cbv=1
copy_cbv = 2;
// 결과 cbv=1
// 결과 copy_cbv=2
위의 네모를 실행시키면 아래의 결과를 출력한다.
cbv = 1이고, copy_cbv는 2이다. 값을 메모리 주소값에 저장하기 때문에
코드상으로는 두 변수가 연결된 것처럼 보일 수 있지만,
값이 전달되기 때문에 값을 전달한 이후 둘은 상관이 없는 변수가 된다.
반면에 call by reference는 어떠한가
let cbr = {name:'cbr'}
let copy_cbr = cbr;
console.log(`let cbr = {name:'cbr'}
let copy_cbr = cbr;`);
console.log(`console.log : cbr=${cbr}`,cbr)
console.log(`console.log : copy_cbr=${copy_cbr}`,copy_cbr)
cbr.name = 'copy_cbr_change';
console.log(`cbr.name = 'copy_cbr_change;`);
console.log(`console.log : cbr=${cbr}`,cbr)
console.log(`console.log : copy_cbr=${copy_cbr}`,copy_cbr)
위 코드를 실행시키면 아래와 같은 결과가 나온다.
call by reference-----------------
let cbr = {name:'cbr'}
let copy_cbr = cbr;
console.log : cbr=[object Object] { name: 'cbr' }
console.log : copy_cbr=[object Object] { name: 'cbr' }
cbr.name = 'copy_cbr_change;
console.log : cbr=[object Object] { name: 'copy_cbr_change' }
console.log : copy_cbr=[object Object] { name: 'copy_cbr_change' }
한 변수에 할당된 객체 내의 데이터를 바꿨는데
두 변수 모두 name이 가지고 있는 값이 바뀌었다.
이는 값이 아닌 참조값이 전달되었다는 것을 의미한다.
이는 뭐랄까
우리가 간식을 받는데 영희가 초콜렛을 두개 받아서 하나를 철수에게 준다
철수의 초콜릿을 누군가 사탕으로 바꿔줘도 영희의 초콜릿은 그대로이다.
반면에 영희가 간식교환권을 두개 받아서 하나를 철수에게 준다고 하자
원래 오늘의 간식을 초콜릿을 주려고 했는데 주는 곳에서 사탕으로 바꼈다면
영희나 철수나 받을 수 있는 것은 사탕이다.
가끔 코딩을 하면서 분명 변수를 다른 변수에 넣어줬는데
변수를 바꿔도 할당된 변수가 바뀌지 않는다면
이러한 값에 의한 전달, 참조에 의한 전달을 확인해봐야할 것 같다.
'프로그래밍 > javascript' 카테고리의 다른 글
번들러 (0) | 2022.11.04 |
---|---|
자바스크립트와 비동기 (0) | 2022.08.05 |
[툴] babel (0) | 2022.05.19 |
[socket.io] 실시간, 양방향, 이벤트 통신 (0) | 2022.04.21 |
CRP(Criticla rendering path) (0) | 2022.04.17 |