[JavaScript] eval 대신 Dynamic Import

JavaScript에는 지정된 문자열을 코드로 해석하고 실행하는 함수eval가 있습니다.
외부에서 임의의 코드를 실행할 수 있는 위험 처리로 성능에도 문제가 있다.
MDN에도 "eval 사용하지 마세요!"이렇게 쓰여 있다.
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/eval#eval_% 1을 (를) 사용하지 마십시오.
MDN 기사에서는 대체 사용Function() 방법, 이 편에서는 다른 방법을 소개했다.

메서드

import().
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Statements/import#dynamic_imports

const src = `
export function hello(name){
  console.log("Hello, " + name);
};
`;
const data = "data:text/javascript;base64," + btoa(src);
// ↓こっちもOK
// const data = "data:text/javascript;charset=utf-8," + encodeURIComponent(src);
const mod = await import(data);
mod.hello("world");
// → Hello, world

import()는 기본적으로 파일 경로를 매개 변수로 하지만 여기에 데이터 URI를 추가하여 문자열을 변환하고 전달하여 모듈로 해석한다.
상기 예에서 src의 문자열을 모듈로 가져오고 실행합니다.eval()에 비하면 안전하지는 않지만, 일본어로 소개된 글은 발견되지 않아 요약했다.
실용성은 불분명하지만, 미리 머리 한 구석에 놓으면 어떤 작용을 할지 모르겠다.
아.. 아니요, 사용하지 마세요..

참고 자료

https://stackoverflow.com/questions/57121467/import-a-module-from-string-variable
https://2ality.com/2019/10/eval-via-import.html