Cookie의 MaxAge, Expires / 순수함수

MaxAge, Expires 

 

서버에서 쿠키를 전송할 때 만료일, 지속 시간, 도메인, 경로 속성 등을 전송할 수 있다.

이중에서 쿠키가 유지되는 시간을 설정할 수 있는 속성에 MaxAge와 Expires가 있다.

 

Expires은 쿠키에 대해 유효시간을 설정하여 해당 일자가 되었을 때 쿠키를 삭제하도록 설정할 수 있다.

단, 시간은 GMT형식으로 해야한다는 것을 참고해야한다.

 

//rememberme라는 쿠키에 값 1을 저장하고, 현재시간으로부터 1시간동안 유효
res.cookie('rememberme', '1', { expires: new Date(Date.now() + 3600000) }

 

MaxAge는 expires의 대안으로, 쿠키의 만료기간을 설정할 수 있다. 설정하고자 하는 만료일시까지의 시간을 밀리세컨드로 환산한 값을 설정한다

res.cookie('rememberme', '1', { maxAge: 3600000 })

 

expires나 max-age 옵션을 설정하지 않으면, 브라우저를 닫을때 쿠키도 함께 삭제된다.

이런 쿠키를 세션쿠키(session-cookie)라고 한다.
또한 expires나 max-age 옵션을 설정하면, 브라우저를 닫아도 쿠키가 삭제되지 않는다. 혹여나 expires와 max-age를 둘다 설정된다면, max-age가 우선 적용된다는 것을 참고하자.

 

 

순수함수

 

순수 함수란 어떤 함수에 동일한 인자를 주었을 때, 외부의 상태를 변경하지 않고 항상 같은 값을 리턴하는 함수를 말한다. 

함수 내부에서 외부의 상태값에 영향을 주게 된다면 절차지향적 프로그래밍가능성이 높다.

함수의 전달인자로 참조 자료형이 전달되는 경우, 의도치 않게 해당 객체 자체를 바꾸거나  외부의 값을 함부로 변경할 수 있는 사이드 이펙트를 만들수도 있고, 이는 해당 데이터의 불변성을 손상시킬 수 있다.

자바스크립트에서는 순수함수를 제작하기 위해서 데이터의 불변성을 유지하는 것이 중요하다.

때문에 함수에 인자로 전달된 데이터를 변경하지 않고 새로운 객체를 만들어서 결과값을 전달해야한다. 

 

그렇기 때문에 객체의 불변성을 보장하는 Object.freeze, 배열의 불변성을 보장하는 map,filter,reduce등이 각광을 받게 되었다.

사이드 이펙트란, 외부 변수를 참조하거나, 변경하는 모든 종류의 코드를 의미

 

왜 불변성을 지켜야 하나요?

리액트에서 불변성을 지켜주는 이유는 리액트가 상태 업데이트를 하는 원리 때문이다.

리액트는 상태값을 업데이트 할 때 얕은 비교를 수행한다. 즉 배열이나 객체의 속성 하나하나를 비교하는게 아니라 이전 참조값과 현재 참조값만을 비교하여 상태 변화를 감지하는 것.

이런 이유로 배열이나 객체를 업데이트 할때 setState([...state, newState]), setState({...state, [key]: value}) 이런식으로 새로운 참조값을 가진 배열이나 객체를 생성하는 것이다.

다시 말해,  불변성을 지킴으로써 리액트는 상태변화를 감지할 수 있다.

 

 

참조 

 

리액트 불변성이란 무엇이고, 왜 지켜야 할까?

 

[Browser] Cookie 톺아보기