JavaScript - Change the imported Value

문제사항

• static value로 선언해서 외부 파일에 선언된 변수가 있다.
• 파일을 잘 분리했다면, static value 이기에, 변하지 않는 것이 원칙이지만, 프로그램 설계상 어쩔 수 없이 변수처럼 변경해야 할 경우도 있다.
• 그런데, import 문으로 가져온 이상, 그 파일내에서는 read-only 상수로 취급하기에 변경이 불가능하다.

// fileA.js
export let foo = 5;

// fileB.js
import {foo} from './fileA'

foo = 6 // error!

• TypeError: Cannot assign to read only property 'exports' of object '#<Object>' error 등의 에러가 발생한다.

해결방안

• module 로 가져올 파일안에서 변수를 변경시키는 함수등을 작성하면 된다.

// fileA.js
export let foo = 5;
export const changeFoo(a){
	foo = a;
}
// fileB.js
import {foo, changeFoo} from './fileA'

foo = changeFoo(6) // okay!

참고사이트

• StackOverflow
• flaviocopes.com