저는 최근에 ES6 모듈을 읽고 테스트 해왔고 이해의 원천으로 2ality와 MDN의 조합을 사용했습니다.자바 스크립트 모듈 (ES6)의 순환 종속성
현대적인 대규모 JS 웹 응용 프로그램에서 순환 의존성이 있으며 내 문제를 해결하는 방법에 대한 해결책을 찾지 못했습니다. 가능한 한 순환 종속성을 피해야하며 마이그레이션 후 내 다음 단계는 최대한 많이 정리해야 함을 알고 있습니다.
인 test.html :
<script type="module">
import B from './B.js';
console.log(B.moo());
</script>
B.js :
// B.js
import A from './A.js';
export default class B {
static moo() {
return A.boo();
}
}
A.js :
// A.js
import B from './B.js';
export default class A extends B {
static boo() {
return "Boo";
}
}
에서 다음과 같이
내 테스트 케이스입니다 위, 나는 본질적으로 하 단 2 일을 진행했습니다 : Uncaught ReferenceError: B is not defined at A.js:3
나는 것을 얻을 :
B.moo()
것은A.boo()
A
그러나B
, 오류가 위의 코드 결과를 확장하는 정적 메소드를 호출 ES6 모듈이 정적으로 해결되고 오류가 발생합니다. 그러나 그들은 또한 (?) 순환 종속성을 지원합니다.
주위를 어지럽히고 난 후 작동하는 해결책을 찾았습니다. 그러나 더 좋은 방법이 있는지 궁금합니다. 여기
지금까지 내 작업 솔루션입니다 :인 test.html :
<script type="module">
import A from './A.js';
import B from './B.js';
console.log(B.moo());
</script>
B.js :
import A from './A.js';
export const B = class B {
static moo() {
return A.boo();
}
}
export {B as default};
A.js :
import B from './B.js';
export const A = class A extends B {
static boo() {
return "Boo";
}
}
export {A as default};
'가져 오기 A를'./A.js';*에서 b.js의 마지막 줄로 옮길 수 없었습니까? –
@Jonasw 그것은 내가 생각해내는 것보다 확실히 깨끗합니다. 그러나 작동하는 것이 놀랍습니다. 나는 수입 된 모듈의 순서가 중요하지 않다는 것을 읽을 것이라고 생각했습니다. 나는 여전히 A와 B를 모두 test.html에 가져와야한다 - 나는 그것이 피하기를 희망했다. – Jarym
"더 좋은 방법이 있는지 궁금합니다." - 네 디자인을 고쳐라. 기본 클래스는 결코 자손을 호출하면 안됩니다. 특정 문제에 대해 알려주십시오. – georg