JavaScript Module ในที่ 3 นาที

ธรรมดาๆแล้วกาลเวลาเราเขียนโค้ด JavaScript ก็จะรวมวางที่ไฟล์โดดเดี่ยว กับนำไปใช้การงาน เสียแต่ว่าแจ้งหรือเปล่าตวาดอิฉันสมรรถทำสับเปลี่ยนปันออกไฟล์ JS สิ่งของอิฉันกลายร่างเป็น module ไม่ก็ก็ถือเอาว่าชิ้นส่วนที่จะนำไปใช้ให้แฟ้มข้อมูล JS ไฟล์อื่นเรียก หรือจักนำจรแชร์แยกออกคนอื่นนำไปใช้ก็ยังได้มา หลังจากนั้นแน่นอน JavaScript module เลี่ยนถือเอาว่าอย่างไร และลงมือยังไง ลองไปดูกักคุมJavaScript module ที่ใช้คืนกักคุมส่วนใหญ่ตรงนั้นถือเอาว่า ES module ซึ่งออกมาแยกออกได้ใช้กันตั้งแต่ปี 2015 เพราะว่ามีการเรียกหาใช้งานเช่นนี้import myModule from ‘มันสมอง/modules/myModuleมันสมองjs’;ซึ่งการใช้งาน module นี้ก็สามารถชดใช้ใน Nodeมันสมองjs ได้มาอีกด้วยทว่าจะเรียกหาใช้คืนผ่านคำสั่ง require รับช่วงconst myModule = require(‘myModule’);แบบอย่างโค้ดที่จะใช้ในตอนนี้มีแบบสร้างโปรเจ็คตามข้างล่างนี้ รวมความว่าแฟ้มข้อมูลหลักเขตชื่อ mainมันสมองjs และมี module ที่จะประยุกต์ใช้ชื่อ plant.js อยู่ในโฟลเดอร์ modules การใช้งาน export และ import การใช้งาน module ตรงนั้น จักจำเป็นจะต้องใช้การ ‘export ’ หญิบกับ ‘import’ เพราะว่าที่แฟ้มข้อมูลแห่งดิฉันปรารถนาจักทำให้ครอบครอง module เพื่อให้ไฟล์อื่นเรียกหาชดใช้ดิฉันจะต้องกระทำการ export const name = ‘cactus’; function doSomething() consoleมันสมองlog(“photosynthesis”); export name, doSomething;หลังจากนั้นอีกแฟ้มข้อมูลนึงดิฉันก็ทำ import อย่างนี้import name, doSomething from ‘./modules/plant’;จะเห็นดุอีฉันสมรรถ export ได้มาหลายร่างกายด้วยกัน เพราะคุณประโยชน์ที่ทำการ export ตรงนั้นสามารถสามารถทั้งตัวเปลี่ยนแบบและฟังก์ชันงานผลัดกันชื่อตัวเปลี่ยนที่จะ export หรือ importอีฉันสามารถสับเปลี่ยนชื่อตัวปรับเปลี่ยนขณะที่จัก export หรือไม่ก็ import ได้ เสี่ยงโค้ดข้างล่างตรงนี้รวมตัวกันชนิดconst name = ‘cactus’; const doSomething = function() console.log(“photosynthesis”); export name as myFabulousName, doSomething;จากโค้ดตรงนี้จักมองเห็นดุอีฉันสับเปลี่ยนชื่อจริงเปลี่ยนแบบ ‘name’ แบ่งออกเป็นชื่อ ‘myFabulousName’ ขณะที่จักกระทำการ exportimport myFabulousName, doSomething as doAnything from ‘./modules/plant’;ด้านอันนี้ได้ผล import จะเห็นดุดิฉันจำเป็นจะต้อง import ชื่อเนื่องจากคว้าริเริ่มตั้งขึ้นวางระยะ export รวมความว่าตัวแปร ‘myFabulousName’ เฉพาะบุคคลเปลี่ยนแบบ ‘doSomething’ นั้น ฉันกระทำเปลี่ยนชื่อเสียงเรียงนามที่จะไว้เรียกชดใช้ถัดไปในที่แฟ้มข้อมูลให้เป็น ‘doAnything’ แทนที่คว้าประกาศตัวเปลี่ยนแบบ/ฟังก์ชันระยะ exportหากตัวแปรหรือไม่ก็ฟังก์ชันใดที่อีฉันหมายมั่นจะ export โดยเฉพาะอย่างยิ่ง ดิฉันก็สามารถข่าวสารตอนที่ export เกินตกลงเช่นนี้export const color = “green”; export function saySomething() console.log(“I love waterมันสมอง”); ขนมจากโค้ดด้านบนนี้จะมองเห็นตวาดดิฉันสมรรถแยก export หลายคราคว้าพร้อมด้วย เพราะตอนเรียกหาใช้คืนก็ทำกันได้เหมือนปกติimport color, saySomething from ‘มันสมอง/modules/plant’;ด้วยกันแน่นอนดุช่วง import อีฉันก็สมรรถแบ่ง import หลายหนคว้าพร้อมด้วย อย่างนี้import color from ‘มันสมอง/modules/plant’; import saySomething from ‘มันสมอง/modules/plant’; การชดใช้ default export/importจากแบบที่ผ่านมาตั้งแต่ต้นไม้ เมื่อใดก็ตามฉันจะกระทำการ import อีฉันจะจำต้องระบุชื่อตัวแปรไม่ก็ฟังก์ชันเทียมเท่า แสดงข้อความดุแม้ฉันเขลาชื่อเสียงเรียงนามอีฉันก็จักเรียกหาใช้งานไม่ได้ แต่ว่ายังมีสิ่งแห่งเรียกตวาด ‘default’ ที่จะสนับสนุนดิฉันคว้า เพราะแม้ดิฉันปรารถนา export คุณประโยชน์บางอย่างขนมจากไฟล์ JS สรรพสิ่งดิฉันแบ่งออกแฟ้มข้อมูลอื่นเรียกใช้ได้สะดวกๆ ดิฉันแค่เพียงเขียนโค้ด export เช่นนี้export default someFantasticName;หรือเช่นนี้ตกลงผลเหมือนกันexport someFantasticName as default;ครั้น export default แล้วดิฉันก็ import มาใช้งานคว้าคล่องๆแบบนี้เกินimport anyName from ‘./modules/plant’;ไม่ก็เช่นนี้ก็ได้import default as anyName from ‘มันสมอง/modules/plant’;ตอน import default นั้น ฉันสมรรถขนานนามดำรงฐานะอะไรก็ได้ขนมจากแบบอย่างถือเอาว่าดิฉันใช้คืนชื่อ ‘anyName’ เพราะคุณค่าสถานที่ได้มาจะดำรงฐานะคุณประโยชน์จากตัวแปร ‘someFantasticName’ สถานที่ export default วางนั่นเองงาน import ทั้งปวงในที่สุดสมมติว่าดิฉันเรียกร้อง import ตัวแปรไม่ก็ฟังก์ชันทั้งหมดร่างกายแห่งอีกแฟ้มข้อมูลได้มา export ไว้ แม้มันประกอบด้วยจำนวนเดยิ่งนัก กับฉันอีกทั้งไม่ฉลาดดุจะชดใช้ชิ้นไรบ้าง แต่ว่าก็ไม่โหยหวนกลับ import มากขึ้นทีละตัวในระหว่างที่จักชดใช้ แล้วจึงมีทางให้กำเนิดให้ดิฉันฉบับร่างโค้ดข้างล่างตรงนี้import * as plant from ‘./modules/plant’;ต้นแบบยุคใช้ประโยชน์กิจธุระ เรียกชดใช้เช่นนี้console.log(plantมันสมองname); consoleมันสมองlog(plant.color); คว้าเห็นขั้นตอนชดใช้ JavaScript module ภาพร่างกระยาเลยกักคุมไปหลังจากนั้น ก็พิสูจน์ใช้ประโยชน์กับรหัสของตนเองห้ามคว้าหนอครับ น่าจะเอาใจช่วยให้รหัสแห่งเขียนเรียบร้อยกับสั่งการได้มาคล่องขึ้นไปมั่นเหมาะแม้คุณแยแสเจริญ สตาร์ถักัพ แอปพลิเคชัน ด้วยกัน เทคโนโลยีของตนเอง ?อย่ารอคอยช้า ! เรียนรู้ความชำนาญข้างดิจิทัลเพื่อที่จะอัพเกรดความเก่งกาจสรรพสิ่งเจ้าเอ็ง ริเริ่มตั้งแต่พื้นฐาน พร้อมกระทำแน่นอนในที่รูปแบบคอร์สออนไลน์วันนี้ Advance Problem Solving ฿2,590.00 ฿2,090.00฿2,590.00 ฿2,090.00Add to cart Complete UX / UI Design ฿3,290.00 ฿2,590.00฿3,290.00 ฿2,590.00Add to cart Complete Arduino For Beginner ฿3,290.00 ฿1,990.00฿3,290.00 ฿1,990.00Add to cart Data Structure & Algorithm X ฿3,990.00 ฿1,990.00฿3,990.00 ฿1,990.00Add to cart