Heim > Web-Frontend > Front-End-Fragen und Antworten > Was ist die Verwendung von Import wie in es6?

Was ist die Verwendung von Import wie in es6?

WBOY
Freigeben: 2022-04-25 17:19:54
Original
4537 Leute haben es durchsucht

Import as wird verwendet, um die von mehreren Exporten exportierten Inhalte in einem Objekt zusammenzufassen und zurückzugeben. Die Modularisierung von ES6 ist in zwei Module unterteilt: Export und Import. Diese Methode kann alle Exportinhalte in das angegebene Objekt einbinden. Die Syntax für „* als Objekt aus ... importieren“.

Was ist die Verwendung von Import wie in es6?

Die Betriebsumgebung dieses Tutorials: Windows 10-System, ECMAScript Version 6.0, Dell G3-Computer.

Was ist die Verwendung von Import wie in ES6?

ES6, Javascript unterstützt zum ersten Mal das Modul. Die Modularisierung von ES6 ist in zwei Module unterteilt: Export und Import. In Projekten wird häufig die Verwendung von „obj from“ verwendet.

import * as xxx from 'xxx': Kombiniert die durch mehrere Exporte exportierten Inhalte in einem Objekt und gibt es zurück.

import xxx from 'xxx': (Export-Standard-Din) exportiert nur dieses Standardobjekt als ein Objekt

Beispiel 1

// index.js
export function fn1(data){
  console.log(1)
}
export function fn2(data){
  console.log(2)
}
import * as Fn from './index.js'
Fn.fn1()  // 1
Fn.fn2()  // 2
Nach dem Login kopieren

Beispiel 2

let myName = "Jon";
let myAge = 18;
let myfn = function(){
    return "我是"+myName+"!今年"+myAge+"岁了"
}
export {
    myName as name,
    myAge as age,
    myfn as fn
}
Nach dem Login kopieren

Der Code wurde

import {fn,age,name} from "./test.js";
console.log(fn()); //我是Jon!今年19岁了
console.log(age); //19
console.log(name); //Jon
Nach dem Login kopieren

oder als

import * as info from "./test.js"; //通过*来批量接收,as 来指定接收的名字
console.log(info.fn()); //我是Jon!今年18岁了
console.log(info.age); //18
console.log(info.name); //Jon
Nach dem Login kopieren

geschrieben Namen in mehreren importierten Dateien sind gleich, Das heißt, es wird ein Namenskonfliktproblem auftreten. Um dieses Problem zu lösen, bietet ES6 eine Methode zum Umbenennen.

/*************test1.js*****************/
export let myName = "我来自test1.js";
/*************test2.js*****************/
export let myName = "我来自test2.js";
 
/*************index.js****************/
import {myName as name1} from "./test1.js";
import {myName as name2} from "./test2.js";
console.log(name1); //我来自test1.js
console.log(name2); //我来自test2.js
Nach dem Login kopieren
【Verwandte Empfehlungen:

Javascript-Video-Tutorial

,

Web-Frontend

Das obige ist der detaillierte Inhalt vonWas ist die Verwendung von Import wie in es6?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
es6
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage