es6에서는 내보내기를 사용하여 JavaScript 모듈의 함수, 기본 값 및 개체를 내보내고 다른 프로그램에서 import 문을 통해 사용할 수 있도록 내보낸 내용이 파일 개체에 추가된다는 점을 간단히 이해할 수 있습니다. 딥 카피로. 기본값 내보내기 기능은 파일 객체의 기본 속성에 값을 추가하는 것입니다.
이 튜토리얼의 운영 환경: Windows 7 시스템, ECMAScript 버전 6, Dell G3 컴퓨터.
export는 JavaScript 모듈, 즉 모듈을 내보내는 데 사용됩니다.
내보내기 명령은 모듈의 외부 인터페이스를 지정하는 데 사용됩니다.
독립적인 JS 파일은 모듈입니다.
js 파일은 모듈로 이해될 수 있습니다. 이 모듈은 다른 모듈에서 가져올 수 있습니다. 소개의 결과는 이 모듈을 실행한 후 유지됩니다. 그러면 문제가 발생합니다. 파일 모듈이 도입된 후에는 모든 것이 자체 범위에 있습니다. 도입 동작을 적극적으로 시작하는 파일은 도입된 개체를 얻었지만 도메인의 기능에 액세스할 수 없으므로 내보내기가 제공됩니다. 모듈이 외부 세계에 무엇을 노출하는지 결정합니다.
모듈 내부의 변수/함수/클래스를 외부에서 읽을 수 있도록 하려면 내보내기 키워드를 사용하여 변수/함수/클래스를 출력해야 합니다.
내보내기 기능은 다른 프로그램이 import 문을 통해 사용할 수 있도록 모듈에서 함수, 개체 또는 기본 값을 내보내는 것입니다.
파일을 가져올 때 파일 개체는 기본값입니다. 빈 개체. 파일에 액세스할 수 없음을 의미합니다. 내보내기를 사용하여 이 객체에 콘텐츠를 추가하세요
사용법:
module1.js :
function f1 (){ console.log("module - 1 : functino 1") } let b = { name:"test_obj" } let str = "hell绿绿绿" export { f1,b,str }
main.js에 도입됨
// 先忽略 import 的写法,后面再说明 import * as m1 from "./m1.js" console.log(m1)
이 파일에서는 함수, 변수 및 객체를 노출합니다. 따라서 import를 사용하여 가져온 파일 객체는 더 이상 빈 객체가 아니라 내보내기 내용을 포함하는 객체입니다. 따라서 m1인 m1.js 파일 객체를 인쇄합니다.
그래서 우리는 내보내기로 내보낸 콘텐츠는 파일 개체에 추가되며, 이는 간단히 전체 복사본으로 이해될 수 있습니다.
export default
많은 초보자들이 내보내기가 있는데 왜 내보내기 기본값이 필요한가요? 인터넷에서 제공되는 대답은 종종 파일의 기본 내보내기 인터페이스라는 것입니다. 그렇다면 파일의 기본 내보내기 인터페이스는 무엇입니까?
사실 이 문제는 매우 간단합니다. 가져오기를 먼저 제쳐두고 가져오기 구문을 고려하지 않고 내보내기 기본값이 수행하는 작업만 고려하겠습니다.
modify module1.js:
function f1 (){ console.log("module - 1 : functino 1") } let b = { name:"test_obj" } let str = "hell绿绿绿" export { f1,b,str } export default{ name:"default" }
main.js는 변경되지 않은 상태로 유지됩니다. 다시 실행하고 인쇄된 파일 개체를 계속 확인하세요.
이를 발견하셨나요? 내보내기 기본값의 기능은 기본 속성을 파일 객체. , 기본 속성의 값도 객체이며 내보내기 기본값으로 내보낸 내용과 정확히 동일합니다.
파일 내보내기 개요
여기서는 js 파일을 모듈로 가져와서 객체로 노출한다는 것(즉, 가져온 후에는 객체로 동작할 수 있음)으로 이해합니다.
내보내기 기능은 이 파일 개체에 속성을 추가하는 것입니다. 내보낸 모든 항목은 파일 개체에 추가됩니다.
기본값 내보내기 기능은 파일 개체의 기본 속성에 값을 추가하는 것입니다.
3가지 노출 노출
1. 별도 노출
//这是我个人的export.js 文件 export let obj={ name:"导出" } export const fuc=()=>{ console.log('导出') }
2. 통합 노출
//将需要暴露方法写在export对象内 let obj={ name:"导出" } const fuc=()=>{ console.log('导出') } export{ obj, fuc, }
참고: 일반 가져오기 메소드 호출 시 기본 속성을 추가해야 합니다.
【 관련 추천:javascript 비디오 튜토리얼
,프로그래밍 비디오】
위 내용은 es6 내보내기를 사용하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!