ด่วน = ต้องการ ('ด่วน')

Feb 01 2023
นี่คือวิธีการทำงานของกระบวนการในขณะที่ฉันพยายามทำความเข้าใจว่าเกิดอะไรขึ้นเบื้องหลังของข้อความนี้ ทีนี้มาดูที่กล่องกัน ;) เรามาเริ่มกันที่การรู้ว่าอะไรคือความต้องการที่แท้จริง
ภาพถ่ายโดย Kelli McClintock บน Unsplash

นี่คือวิธีการทำงานของกระบวนการในขณะที่ฉันพยายามทำความเข้าใจว่าเกิดอะไรขึ้นเบื้องหลังของข้อความนี้ ทีนี้มาดูที่กล่องกันบ้าง ;)

ก่อนอื่นเรามาเริ่มกันที่การรู้ว่าอะไรคือความต้องการที่แท้จริง

Express เป็นแพ็คเกจเฟรมเวิร์กที่คุณติดตั้งเมื่อคุณใช้:

npm istall express

ดังที่คุณเห็นที่นี่ เรามีฟังก์ชันที่กำหนดไว้และของอื่นๆ และเรากำลังส่งออกบางอย่างรวมถึงฟังก์ชันต่างๆ

คุณไม่รู้ว่าการส่งออกหมายถึงอะไร?

การส่งออกที่นี่ก็เหมือนกับการส่งออกสินค้าในชีวิตจริง คุณแค่ย้ายของไปที่อื่นเพื่อให้สามารถใช้ที่นั่นได้ ;

ตกลง?

ใน JS คุณสามารถส่งออกฟังก์ชัน คุณสมบัติ และสิ่งอื่นๆ ไปยังไฟล์อื่นโดยใช้:

module.exports = (stuff you want to export)

ในไฟล์ a.js เรามีฟังก์ชัน sayHi นี้:

// a.js

const sayHi = () => { return 'Hi' }

โดยเพิ่มบรรทัดที่เราระบุไว้ข้างต้นซึ่งเป็น:

// a.js

module.exports = sayHi

// a.js

const sayHi = () => { return 'Hi' }
module.exports = sayHi

ไม่ เราต้องนำเข้ามันถึงจะใช้งานได้! มันเป็นตรรกะ

แต่แล้วอย่างไร?

โดยใช้บรรทัดด้านล่าง มันเป็นการแสดงออก: เราต้องการโมดูลนั้นดังนั้นเราจึงต้องการมัน

require(module location);

// b.js

const sayHi = require('./a.js');

ตอนนี้เรามีการอ้างอิงถึงฟังก์ชันและสามารถเรียกใช้ได้โดยเพิ่ม () ในการอ้างอิง

// b.js
const sayHi = require('./a.js');
console.log( sayHi() ) //output: Hi

เราสามารถเห็นสิ่งนี้:

//express.js module

exports = module.exports = createApplication;

//express.js module 

exports.static = require('serve-static');
exports.json = bodyParser.json
exports.query = require('./middleware/query');
exports.raw = bodyParser.raw

การส่งออกที่นี่เป็นเพียงการอ้างอิงถึง module.exports ดังนั้นแทนที่จะพูดว่า module.exports.json คุณสามารถใช้ทางลัดนี้โดยตรง exports.json

ใช้ได้?

ไปที่ ไฟล์ app.jsที่เราสร้างเซิร์ฟเวอร์และเพิ่มการกำหนดเส้นทาง ตอนนี้เราต้องการดูเฉพาะบรรทัดแรก:

// app.js

const express = require('express')

มาลองโดยบันทึก:

// app.js

const express = require('express')

console.log(express)


[Function: createApplication] {
 application: {
 init: [Function: init],
 defaultConfiguration: [Function: defaultConfiguration],
 lazyrouter: [Function: lazyrouter],
 handle: [Function: handle],
 use: [Function: use],
 route: [Function: route],
 engine: [Function: engine],
 param: [Function: param],
 set: [Function: set],
 path: [Function: path],
 enabled: [Function: enabled],
 disabled: [Function: disabled],
 enable: [Function: enable],
 disable: [Function: disable],
 acl: [Function (anonymous)],
 bind: [Function (anonymous)],
 checkout: [Function (anonymous)],
 connect: [Function (anonymous)],
 copy: [Function (anonymous)],
 delete: [Function (anonymous)],
 get: [Function (anonymous)],
 head: [Function (anonymous)],
 link: [Function (anonymous)],
 lock: [Function (anonymous)],
 'm-search': [Function (anonymous)],
 merge: [Function (anonymous)],
 mkactivity: [Function (anonymous)],
 mkcalendar: [Function (anonymous)],
 mkcol: [Function (anonymous)],
 move: [Function (anonymous)],
 notify: [Function (anonymous)],
 options: [Function (anonymous)],
 patch: [Function (anonymous)],
 post: [Function (anonymous)],
 propfind: [Function (anonymous)],
 proppatch: [Function (anonymous)],
 purge: [Function (anonymous)],
 put: [Function (anonymous)],
 rebind: [Function (anonymous)],
 report: [Function (anonymous)],
 search: [Function (anonymous)],
 source: [Function (anonymous)],
 subscribe: [Function (anonymous)],
 trace: [Function (anonymous)],
 unbind: [Function (anonymous)],
 unlink: [Function (anonymous)],
 unlock: [Function (anonymous)],
 unsubscribe: [Function (anonymous)],
 all: [Function: all],
 del: [Function (anonymous)],
 render: [Function: render],
 listen: [Function: listen]
 },
 request: IncomingMessage {
 header: [Function: header],
 get: [Function: header],
 accepts: [Function (anonymous)],
 acceptsEncodings: [Function (anonymous)],
 acceptsEncoding: [Function (anonymous)],
 acceptsCharsets: [Function (anonymous)],
 acceptsCharset: [Function (anonymous)],
 acceptsLanguages: [Function (anonymous)],
 acceptsLanguage: [Function (anonymous)],
 range: [Function: range],
 param: [Function: param],
 is: [Function: is],
 protocol: [Getter],
 secure: [Getter],
 ip: [Getter],
 ips: [Getter],
 subdomains: [Getter],
 path: [Getter],
 hostname: [Getter],
 host: [Getter],
 fresh: [Getter],
 stale: [Getter],
 xhr: [Getter]
 },
 response: ServerResponse {
 status: [Function: status],
 links: [Function (anonymous)],
 send: [Function: send],
 json: [Function: json],
 jsonp: [Function: jsonp],
 sendStatus: [Function: sendStatus],
 sendFile: [Function: sendFile],
 sendfile: [Function (anonymous)],
 download: [Function: download],
 type: [Function: contentType],
 contentType: [Function: contentType],
 format: [Function (anonymous)],
 attachment: [Function: attachment],
 append: [Function: append],
 header: [Function: header],
 set: [Function: header],
 get: [Function (anonymous)],
 clearCookie: [Function: clearCookie],
 cookie: [Function (anonymous)],
 location: [Function: location],
 redirect: [Function: redirect],
 vary: [Function (anonymous)],
 render: [Function: render]
 },
 Route: [Function: Route],
 Router: [Function (anonymous)] {
 param: [Function: param],
 handle: [Function: handle],
 process_params: [Function: process_params],
 use: [Function: use],
 route: [Function: route],
 acl: [Function (anonymous)],
 bind: [Function (anonymous)],
 checkout: [Function (anonymous)],
 connect: [Function (anonymous)],
 copy: [Function (anonymous)],
 delete: [Function (anonymous)],
 get: [Function (anonymous)],
 head: [Function (anonymous)],
 link: [Function (anonymous)],
 lock: [Function (anonymous)],
 'm-search': [Function (anonymous)],
 merge: [Function (anonymous)],
 mkactivity: [Function (anonymous)],
 mkcalendar: [Function (anonymous)],
 mkcol: [Function (anonymous)],
 move: [Function (anonymous)],
 notify: [Function (anonymous)],
 options: [Function (anonymous)],
 patch: [Function (anonymous)],
 post: [Function (anonymous)],
 propfind: [Function (anonymous)],
 proppatch: [Function (anonymous)],
 purge: [Function (anonymous)],
 put: [Function (anonymous)],
 rebind: [Function (anonymous)],
 report: [Function (anonymous)],
 search: [Function (anonymous)],
 source: [Function (anonymous)],
 subscribe: [Function (anonymous)],
 trace: [Function (anonymous)],
 unbind: [Function (anonymous)],
 unlink: [Function (anonymous)],
 unlock: [Function (anonymous)],
 unsubscribe: [Function (anonymous)],
 all: [Function (anonymous)]
 },
 json: [Function: json],
 query: [Function: query],
 raw: [Function: raw],
 static: [Function: serveStatic] {
 mime: Mime {
 types: [Object: null prototype],
 extensions: [Object: null prototype],
 default_type: 'application/octet-stream',
 Mime: [Function: Mime],
 charsets: [Object]
 }
 },
 text: [Function: text],
 urlencoded: [Function: urlencoded]
}

มันคือ createApplication ดังนั้นสิ่งที่ส่งคืนคือการอ้างอิงถึง createApplication();

คุณอาจจะถามเหมือนฉัน ก่อนที่ฉันจะเข้าใจ!

การส่งออกอื่น ๆ ที่เราเห็นข้างต้นแบบนี้อยู่ที่ไหน! :

// express.js module

exports.static = require('serve-static');
exports.json = bodyParser.json
exports.query = require('./middleware/query');
exports.raw = bodyParser.raw

แล้วเกิดอะไรขึ้นที่นี่?

มันคือทั้งหมดที่เกี่ยวกับฟังก์ชั่นที่ทำงานใน JS มันทำงานเหมือนวัตถุ ;)

เมื่อคุณใช้สิ่งนี้:

exports = module.exports = createApplication;

exports.static = require('serve-static');
exports.json = bodyParser.json
exports.query = require('./middleware/query');
exports.raw = bodyParser.raw

exports = module.exports = createApplication;

createApplication.static = require(‘serve-static’);

__

ดูตัวอย่างนี้และทดสอบตัวเองโดยถามว่าอะไรเทียบเท่ากับ Express ในแต่ละบรรทัดด้านล่าง:

// app.js

const express = require('express')
const app = express();
app.use(express.static('public'))

ที่เสร็จเรียบร้อย? ไปกันเลย:

ที่บรรทัดแรก: เราต้องการโมดูลที่ส่งคืนการอ้างอิง createApplication ซึ่งรวมถึงคุณสมบัติอื่นๆ และจัดเก็บการอ้างอิงนั้นไว้ที่ค่าคงที่ด่วน

ในบรรทัดที่สอง: เราเรียกฟังก์ชัน Express นี้โดยเพิ่ม () ใน Reference Express และฟังก์ชันนั้น (createApplication) จะส่งคืนวัตถุแอปที่เราเก็บไว้ในค่าคงที่ของแอป

ที่บรรทัดที่สาม: เราใช้ค่าคงที่ด่วนซึ่งอ้างถึงฟังก์ชัน createApplication ที่มีคุณสมบัติบางอย่างเช่นฟังก์ชันคงที่ที่เราเรียกที่นี่

ตอนนี้ฉันเสร็จแล้ว ...