> 웹 프론트엔드 > JS 튜토리얼 > JavaScript에서 가져오기를 어떻게 사용하나요?

JavaScript에서 가져오기를 어떻게 사용하나요?

不言
풀어 주다: 2019-01-19 17:00:59
원래의
19072명이 탐색했습니다.

ES6에서는 모듈화를 통해 JavaScript에서 가져오기를 어떻게 사용하나요? 객체를 관리할 수 있습니다. 모듈화하면 기능을 재사용할 수 있을 뿐만 아니라 유지 관리성도 향상됩니다.

JavaScript에서 가져오기를 어떻게 사용하나요?

import는 한 모듈에서 내보낸 함수, 객체, 초기값을 다른 모듈로 가져오는 데 사용되는 구문입니다.

아래와 같이

import {模块名称} from "需要导入模块的路径名"
로그인 후 복사

가져오기를 어떻게 사용하나요?

이 모듈에는 기본 모듈과 명명된 모듈이 있습니다.

먼저 기본 내보내기 모듈과 이름이 지정된 내보내기 모듈을 로드합니다

import {ModuleA, ModuleB} from "modules"; 
import Default from 'modules2';
로그인 후 복사

첫 번째 줄에서는 모듈 파일에서 모듈 A와 모듈 B라는 두 개의 이름이 지정된 모듈을 가져옵니다.

두 번째 줄에서는 모듈 2 파일에서 기본 모듈을 가져옵니다.

모듈 내보내기 실행

함수, 객체, 기본 값을 모듈로 내보내려면 내보내기를 사용해야 합니다.

구체적인 예를 살펴보겠습니다

기본 모듈로 내보내기

// alert.js
export default function () {
    alert("default module called!");
};
로그인 후 복사

Named 내보내기

// utils.js
export function sum(x, y, z) {
    return x+y+z;
}
 
export function multiply(x, y) {
    return x*y;
}
로그인 후 복사

sum과 곱셈이라는 모듈을 내보낼 수 있습니다.

다음과 같이 호출하여 이 함수를 사용할 수 있습니다.

import { sum, multiply } from 'utils'; 
console.log(sum(1, 2, 3));
console.log(multiply(5, 8));
로그인 후 복사

실행 결과는 다음과 같습니다

->6
->40
로그인 후 복사

이 기사는 여기서 끝납니다. 더 흥미로운 내용을 보려면 PHP 중국어 웹사이트의 다른 관련 칼럼 튜토리얼을 주목하세요! ! !

위 내용은 JavaScript에서 가져오기를 어떻게 사용하나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿