Javascript ES6 ส่งออก const เทียบกับการส่งออกให้


149

สมมติว่าฉันมีตัวแปรที่ฉันต้องการส่งออก ความแตกต่างระหว่างอะไร

export const a = 1;

VS

export let a = 1;

ฉันเข้าใจความแตกต่างระหว่างconstและletแต่เมื่อคุณส่งออกสิ่งที่แตกต่างกันคืออะไร


exportรายละเอียดคำหลักที่นี่ ขณะนี้ไม่ได้รับการสนับสนุนจากเว็บเบราว์เซอร์ใด ๆ
RBT

คำตอบ:


247

ใน ES6 imports คือมุมมองแบบอ่านอย่างเดียวที่ใช้งานได้จริงบนค่าที่ส่งออก ดังนั้นเมื่อคุณทำเช่นimport a from "somemodule";นั้นคุณจะไม่สามารถกำหนดได้aไม่ว่าคุณจะประกาศอย่างไรaในโมดูลอย่างไร

อย่างไรก็ตามเนื่องจากตัวแปรที่นำเข้ามาเป็นมุมมองสดพวกเขาจึงเปลี่ยนไปตามตัวแปรที่ส่งออก "ดิบ" ในการส่งออก พิจารณารหัสต่อไปนี้ (ยืมมาจากบทความอ้างอิงด้านล่าง):

//------ lib.js ------
export let counter = 3;
export function incCounter() {
    counter++;
}

//------ main1.js ------
import { counter, incCounter } from './lib';

// The imported value `counter` is live
console.log(counter); // 3
incCounter();
console.log(counter); // 4

// The imported value can’t be changed
counter++; // TypeError

ในขณะที่คุณสามารถมองเห็นความแตกต่างมันอยู่ในความไม่lib.jsmain1.js


เพื่อสรุป:

  • คุณไม่สามารถกำหนดimportตัวแปรให้กับคุณได้ไม่ว่าคุณจะประกาศตัวแปรที่เกี่ยวข้องในโมดูลอย่างไร
  • ดั้งเดิมlet-vs- constความหมายนำไปใช้กับตัวแปรที่ประกาศในโมดูล
    • หากประกาศตัวแปรแล้ว constไม่สามารถกำหนดหรือย้อนกลับได้ทุกที่
    • หากมีการประกาศตัวแปรตัวแปรletนั้นสามารถกำหนดใหม่ได้ในโมดูลเท่านั้น (แต่ไม่ใช่ผู้ใช้) หากมีการเปลี่ยนแปลงimportตัวแปร -ed จะเปลี่ยนไปตามนั้น

การอ้างอิง: http://exploringjs.com/es6/ch_modules.html#leanpub-auto-in-es6-imports-are-live-read-only-views-on-exported-values


2

ฉันคิดว่าเมื่อคุณนำเข้าแล้วพฤติกรรมจะเหมือนกัน (ในที่ที่ตัวแปรของคุณจะถูกใช้นอกไฟล์ต้นฉบับ)

ความแตกต่างเพียงอย่างเดียวคือถ้าคุณพยายามกำหนดใหม่ก่อนที่ไฟล์จะจบ

โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.