JavaScript에는 import 문이 있습니다. import 문은 한 모듈에서 내보낸 함수, 객체, 초기값을 다른 모듈로 가져오는 데 사용되며, 구문은 "가져와야 할 모듈의 경로 이름"에서 import {모듈 이름}입니다.
이 튜토리얼의 운영 환경: Windows 7 시스템, JavaScript 버전 1.8.5, Dell G3 컴퓨터.
import 문은 다른 모듈에서 내보낸 바인딩을 가져오는 데 사용됩니다. 엄격 모드 선언 여부에 관계없이 가져온 모듈은 엄격 모드에서 실행됩니다. import 문은 포함된 스크립트에서 사용할 수 없습니다.
import defaultExport from “module-name”; import * as name from “module-name”; import { export } from “module-name”; import { export as alias } from “module-name”; import { export1 , export2 } from “module-name”; import { export1, export2 as alias2 , [...] } from “module-name”; import defaultExport, { export [ , [...] ] } from “module-name”; import defaultExport, * as name from “module-name”; import “module-name”;
는 모듈의 기본 내보내기 이름을 참조합니다.
가져올 모듈입니다. 이는 일반적으로 모듈이 포함된 .js 파일에 대한 상대 또는 절대 경로 이름이며 .js 확장자를 포함하지 않을 수 있습니다. 일부 패키징 도구에서는 이 확장의 사용을 허용하거나 요구할 수 있습니다. 런타임 환경에서 작은따옴표 및 큰따옴표 문자열만 허용하는지 확인하세요.
참조 시 일종의 네임스페이스로 사용될 모듈 객체의 이름입니다.
가져올 내보내기의 이름
은 지정된 가져오기의 이름을 참조합니다.
name 매개변수는 네임스페이스를 사용하여 내보내기를 참조하는 데 사용되는 "모듈 개체"의 이름입니다. 내보내기 매개변수는 이름이 지정된 단일 내보내기를 지정하는 반면, import * as name 구문은 모든 내보내기를 가져옵니다.
이렇게 하면 myModule이 현재 범위에 삽입됩니다. 여기에는 /modules/my-module.js에 있는 파일에서 내보낸 모든 모듈이 포함됩니다.
import * as myModule from ‘/modules/my-module.js’;
여기서 내보내기에 액세스한다는 것은 모듈 이름(이 경우 "myModule")을 네임스페이스로 사용하는 것을 의미합니다. 예를 들어 위에서 가져온 모듈에 doAllTheAmazingThings()가 포함된 경우 다음과 같이 호출할 수 있습니다.
myModule.doAllTheAmazingThings();
myExport라는 개체 또는 값이 주어지면 모듈 my-module( 전체 모듈을 내보내거나(export 문을 사용하여) 명시적으로 내보내므로 myExport를 현재 범위에 삽입하세요.
import { myExport } from ‘/modules/my-module.js’;
현재 범위에 foo와 bar를 삽입합니다.
import { foo, bar } from ‘/modules/my-module.js’;
가져올 때 내보내기 이름을 바꿀 수 있습니다. 예를 들어 현재 범위에 shortName을 삽입합니다.
import { reallyReallyReallyLongModuleExportName as shortName } from “/modules/my-module.js”;
별칭을 사용하여 모듈의 여러 내보내기를 가져오세요.
import { reallyReallyReallyLongModuleMemberName as shortName, anotherLongModuleName as short } form “/modules/my-module.js”;
모듈은 부작용(중립적인 단어, 경멸적인 의미 없음)을 위해서만 가져옵니다. 모듈에서 아무 것도 가져오는 대신 모듈에서 전역 코드를 실행하지만 실제로는 어떤 값도 가져오지 않습니다.
import “/modules/my-module.js”
기본 내보내기(객체, 함수, 클래스 등)가 적용되는 경우 사용할 수 있습니다. 그런 다음 import 문을 사용하여 이러한 기본값을 가져올 수 있습니다.
가장 간단한 사용법은 기본값을 직접 가져오는 것입니다:
import myDefault from “/modules/my-module.js”;
위의 사용법(네임스페이스 가져오기 및 명명된 가져오기)과 함께 기본 구문을 동시에 사용할 수도 있습니다. 이 경우 기본 가져오기를 먼저 선언해야 합니다.
import myDefault, * as myModule from “/modules/my-module.js”;
또는
import myDefault, { foo, bar } from “/modules/my-module.js”;
은 AJAX DSON 요청 처리를 지원하기 위해 도우미 모듈에서 가져옵니다.
function getJSON(url, callback){ let xhr = new XMLHttpRequest(); xhr.onload = function () { callback(this.responseText) }; xhr.open(‘GET’, url, true); xhr.send(); } export function getUserFulContents(url, callback){ getJSON(url, data => callback(JSON.parse(data))); }
import { getUserFulContents } from “/modules/file.js”; getUserFulContents(‘http://www.example.com”, data => { doSomethingUseful(data); } )
[관련 권장사항: javascript 학습 튜토리얼]
위 내용은 JavaScript도 import를 사용하나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!