[JS] 자바스크립트 참조에 의한 전달과 순수함수와 비순수 함수 딥카피 필요성

자바스크립트의 함수를 호출하면서 매개변수 원시 타입 값은 값을 전달 받고, 객체는 주소를 전달 받는다.

 

객체는 주소를 전달 받기 때문에 함수 body에서 객체를 변경 하였을 경우 원본이 훼손된다.

 

var changeVal = function(primitive, obj) {
    primitive += 100;
    obj.name = "kang";
}

var num = 50;

var obj = {
    name: "lee"
};

changeVal(num, obj);

console.log(num); //50
console.log(obj.name); //kang

num은 원시타입으로 값을 그대로 전달 받았지만, obj는 객체이기 때문에 주소가 전달 되었고, 함수 body에서 name을 변경 하였더니 원본 자체도 name이 lee 에서 kang으로 변경 되었다.

 

위 문제에서 원본을 변경하지 않는 함수를 순수 함수라 하고 원본을 변경 하는 함수를 비순수 함수라 한다.

 

[비순수 함수]

var cnt = 0;

function increase() {
    cnt = cnt + 1;

    return cnt;
}

increase();
console.log(cnt); //1

비순수 함수는 원본 데이터를 변경한다. increase함수안에서 매개변수 없이 cnt 를 + 1 하여 원본 cnt가 어떤 값인지에 의존되고 원본 cnt 의 값을 바꾼다.

 

 

[순수 함수]

var cnt = 0;

function increase(cnt) {
    cnt = cnt + 1;

    return cnt;
}

console.log(increase(cnt)); //1
console.log(cnt); //0

순수 함수는 원본 데이터를 변경하지 않는다. 단순히 매개변수 cnt만 넣어도 원시 값이기 때문에 값을 그대로 전달 받았다. 하지만 문제점은 객체를 전달받으면 주소를 그대로 전달받기 때문에 원본 데이터를 변경 할 수 있다 그래서 원본 객체를 완전히 복제, 즉 깊은 복사 딥카피(deep cody)를 통해 새로운 객체를 생성해서 원본 데이터를 유지할 수 있다.