본문 바로가기

JavaScript/ETC

불변성

우리가 sameArray = array 를 했다고 해서 기존에 있던 배열이 복사되는것이 아니라 똑같은 배열을 가르키고 있는 레퍼런스가 하나 만들어진 것이기 때문에, 우리가 sameArray 에 push 를 하게 된다고 해서 array 와 sameArray 가 달라지지 않는다.

const array = [1,2,3,4];
const sameArray = array;
sameArray.push(5);

console.log(array !== sameArray); // false

하지만, 우리가 불변성을 유지하려면 아래와 같이 작성해야 된다.

const array = [1,2,3,4];
const differentArray = [...array, 5];
  // 혹은 = array.concat(5)
console.log(array !== differentArray); // true

객체를 다룰때도 마찬가지이다.

// 불변성 X
const object = {
  foo: 'hello',
  bar: 'world'
};
const sameObject = object;
sameObject.baz = 'bye';
console.log(sameObject !== object); // false
// 불변성 O
const object = {
  foo: 'hello',
  bar: 'world'
};
const differentObject = {
  ...object,
  baz: 'bye'
};
console.log(differentObject !== object); // true

 

'JavaScript > ETC' 카테고리의 다른 글

호이스팅  (0) 2019.04.20
Naver ESLint 적용  (0) 2019.04.08
Object.entries()  (0) 2019.03.29
자바스크립트 비동기 처리와 콜백함수  (0) 2019.03.07
async.js  (0) 2019.03.06