Rumah >hujung hadapan web >Soal Jawab bahagian hadapan >Apakah penggunaan import seperti dalam es6

Apakah penggunaan import seperti dalam es6

WBOY
WBOYasal
2022-04-25 17:19:544556semak imbas

Dalam es6, import seperti yang digunakan untuk menggabungkan kandungan yang dieksport oleh beberapa eksport ke dalam satu objek dan mengembalikannya ke dalam dua modul: eksport dan import Kaedah ini boleh membungkus semua kandungan eksport objek Dalam yang ditentukan, sintaksnya ialah "import * sebagai objek daripada...".

Apakah penggunaan import seperti dalam es6

Persekitaran pengendalian tutorial ini: sistem Windows 10, ECMAScript versi 6.0, komputer Dell G3.

Apakah penggunaan import seperti dalam es6?

ES6, javascript menyokong modul buat kali pertama. Modularisasi ES6 terbahagi kepada dua modul: eksport dan import Dalam projek, kita sering melihat penggunaan import * sebagai obj dari.

import * sebagai xxx daripada 'xxx': akan menggabungkan kandungan yang dieksport oleh beberapa eksport ke dalam satu objek dan mengembalikannya

import xxx daripada 'xxx': (eksport lalai Din) akan sahaja eksport ini Objek lalai digunakan sebagai objek

Contoh satu

// 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

Contoh dua

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

Menerima kod

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

atau ditulis sebagai

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

Contoh 3

Namakan semula eksport dan import, jika nama pembolehubah dalam berbilang fail yang diimport adalah sama , yang akan menyebabkan konflik penamaan Untuk menyelesaikan masalah ini, ES6 menyediakan kaedah penamaan semula Anda boleh melakukan ini apabila mengimport nama.

/*************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

[Cadangan berkaitan: tutorial video javascript, bahagian hadapan web]

Atas ialah kandungan terperinci Apakah penggunaan import seperti dalam es6. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn