불변객체

tk_jang·2022년 5월 25일

자바스크립트

목록 보기
2/7

1. 불변객체

이전 포스팅 에서 언급했지만 참조형 데이터의 가변은 데이터 자체가 아니고
내부 프로퍼티를 변경할 때만 적용 됩니다.
즉, 프로퍼티를 교환할 때 마다 새로운 객체를 만들어 재 할당을 한다면
이는 불변성을 가진 객체가 될 수 있습니다.

일반적을 객체의 가변성때문에 따르는 문제점이 있습니다.
아래 코드를 보면

var user = {
	name:'Jeanam',
    gender:'male'
};

var changeName = function(user, newName){
	var newUser = user;
    newUser.name = newName;
    return newUser;
}

var user2= changeName(user , 'Jung');
if (user !== user2){
	console.log("유저 정보가 변경 되었습니다.");
}
console.log(user.name, user2.name); // Jung Jung
console.log(user === user2); //true

이렇게 값을 변경 할때 원본의 값이 같이 변경 되서
오류가 자는 경우가 있습니다.

우리는 값으로 전달받은 객체에 변경을 가하더라도
원본 객체는 변하지 않아야 하는 경우가 종종 있습니다 .
이럴때 바로 불변 객체를 사용하면됩니다.

해당의 경우는
아래와 같은 코드로 해결할 수 있습니다.

var user = {
	name:'Jeanam',
    gender: 'male'
}

var changeName = function(user,newName) {
	return{
    	name: newname
        gender: user.gender
    }
}

changeName의 해당 함수 처럼 객체를 반환해서 새로운 객체를 넣어준다면
해당 객체는 영향을 받지 않을 것 입니다.
하지만
위의 코드도 문제가 있습니다.
객체의 프로퍼티가 많아 질수록 gender 부분 처럼 하드코딩을 해줘야 하는 경우가 생깁니다.

그래서 이런 방법 보다는 모든 프로퍼티를 복사하는 함수를 만드는 편이 더 좋을 것 입니다.

0개의 댓글