require in node ist eine Funktion, die einen Parameter akzeptiert, der formale Parameter heißt id und der Typ ist String; die require-Funktion kann Module, JSON-Dateien importieren und auf das Modul kann über einen relativen Pfad zugegriffen werden „node_modules“, exportiert aus „lokalem Modul“ oder „JSON-Datei“, der Pfad gilt für die Variable „__dirname“ oder das aktuelle Arbeitsverzeichnis.
Die Betriebsumgebung dieses Tutorials: Windows 7-System, NodeJS-Version 18.4.0, Dell G3-Computer.
Was bedeutet Knoten erforderlich?
Spezifische Verwendung der Require-Funktion in Nodejs
Anleitung
Dieser Artikel bezieht sich auf die Version des offiziellen Node-Website-Dokuments, Version 11.12.0.
Dieser Artikel analysiert hauptsächlich die Ergebnisse, die beim Importieren von JSON- und JS-Dateien in Nodejs erzielt werden. Er geht auch kurz auf die Verwendung des Modulexports module.exports und -exporte in Nodejs ein.
Einführung
Beim Lesen des Webpack-Quellcodes sah ich die folgende Codezeile:
const version = require("../package.json").version
Dies führt zur Untersuchung der Anforderungen in Nodejs.
require-Einführung
In der Node.js-Dokumentation befindet sich die relevante Dokumentation für require im Modules-Verzeichnis und ist Teil des Nodejs-Modulsystems.
require ist eine Funktion. Diese Schlussfolgerung kann durch typeof oder Object.prototype.toString.call() überprüft werden:
console.log(require) // 输出:Function console.log(Object.prototype.toString.call(require) // 输出:[object Function]
Durch direktes Drucken von require können Sie feststellen, dass unter der require-Funktion mehrere statische Eigenschaften gemountet sind. Diese statischen Eigenschaften können auch in gefunden werden Offizielle Dokumentation von Nodejs. Die relevanten Anweisungen finden Sie direkt in:
{ [Function: require] resolve: { [Function: resolve] paths: [Function: paths] }, main: Module { id: '.', exports: {}, parent: null, filename: '/Users/bjhl/Documents/webpackSource/index.js', loaded: false, children: [], paths: [ '/Users/bjhl/Documents/webpackSource/node_modules', '/Users/bjhl/Documents/node_modules', '/Users/bjhl/node_modules', '/Users/node_modules', '/node_modules' ] }, extensions: [Object: null prototype] { '.js': [Function], '.json': [Function], '.node': [Function] }, cache: [Object: null prototype] { '/Users/bjhl/Documents/webpackSource/index.js': Module { id: '.', exports: {}, parent: null, filename: '/Users/bjhl/Documents/webpackSource/index.js', loaded: false, children: [], paths: [Array] } } }
statische Funktionsattribute erforderlich
Ich werde später hier Details hinzufügen.
require-Verwendung
Die folgenden Anweisungen zu require finden Sie in der offiziellen Website-Dokumentation:
require(id)# Hinzugefügt in: v0.1.13 id Modulname oder -pfad Rückgabe: exportierter Modulinhalt Verwendet Zum Importieren von Modulen, JSON und lokalen Dateien können lokale Module und JSON-Dateien über einen relativen Pfad (z. B. ./, ./foo, ./bar/baz, ../foo) importiert werden wird anhand des Verzeichnisses namens __dirname (falls definiert) oder des aktuellen Arbeitsverzeichnisses aufgelöst.
Gleichzeitig sind drei Methoden zur Verwendung von require angegeben:
// Importing a local module: const myLocalModule = require('./path/myLocalModule'); // Importing a JSON file: const jsonData = require('./path/filename.json'); // Importing a module from node_modules or Node.js built-in module: const crypto = require('crypto');
Aus den oben genannten Dokumenten können die folgenden Informationen entnommen werden :
-
require akzeptiert einen Parameter, der formale Parameter heißt id und der Typ ist String.
Die Funktion require gibt den Inhalt überall im Modul zurück und der Typ ist beliebig. Die Funktion „require“ kann Module, JSON-Dateien und lokale Dateien importieren. Module können aus node_modules, lokalen Modulen und JSON-Dateien über einen relativen Pfad gegenüber der Variablen __dirname (falls definiert) oder dem aktuellen Arbeitsverzeichnis exportiert werden.
- Praxis erforderlich
Hier besprechen wir die praktischen Schlussfolgerungen von „Require in Category“.
JSON ist eine Syntax zum Serialisieren von Objekten, Arrays, Zahlen, Zeichenfolgen, Booleschen Werten und Null.
Am Anfang des Artikels wurde erwähnt, dass das Versionsattribut in der Datei package.json über die Datei require("./package.json") gelesen wird. Hier werden wir versuchen, die Datei info.json zu importieren und zugehörige Informationen anzuzeigen.
Das Dateistrukturverzeichnis lautet wie folgt:
. ├── index.js └── info.json
Ändern Sie den Inhalt der Datei info.json wie folgt:
{ "name": "myInfo", "hasFriend": true, "salary": null, "version": "v1.0.0", "author": { "nickname": "Hello Kitty", "age": 20, "friends": [ { "nickname": "snowy", "age": 999 } ] } }
In info.json enthält es Zeichenfolgen, boolesche Werte, Nullen, Zahlen, Objekte und Arrays.
Ändern Sie den Inhalt von index.js wie folgt und führen Sie den Befehl node index.js im aktuellen Terminal aus und erhalten Sie die folgenden Ergebnisse:
const info = require("./info.json") console.log(Object.prototype.toString.call(info)) // [object Object] console.log(info.version) // v1.0.0 console.log(info.hasFriend) // true console.log(info.salary) // null console.log(info.author.nickname) // Hello Kitty console.log(info.author.friends) // [ { nickname: 'snowy', age: 999 } ]
Sie können sehen, dass beim Importieren einer JSON-Datei durch require ein Objekt zurückgegeben wird und Nodejs können direkt auf alle Eigenschaften im Objekt zugreifen, einschließlich String, Boolean, Number, Null, Object und Array. Meine persönliche Vermutung ist, dass hier eine ähnliche Methode wie JSON.parse() verwendet werden könnte.
Durch diese Schlussfolgerung sind wir auch auf die Idee gekommen, die JSON-Datei über die Anforderungsmethode zu übergeben, um bestimmte Werte zu lesen. Am Anfang des Artikels hat Webpack beispielsweise den Versionswert durch Lesen des Pakets erhalten .json-Datei.
lokale js-Dateien importieren müssenDas Dateistrukturverzeichnis ist wie folgt:
. ├── index.js ├── module_a.js └── module_b.js
In der Datei index.js werden module_a und module_b der Reihe nach importiert und ihnen Werte zugewiesen, und dann werden diese beiden Variablen gedruckt Der Inhalt lautet wie folgt:
console.log("*** index.js开始执行 ***") const module_a = require("./module_a") const module_b = require("./module_b") console.log(module_a, "*** 打印module_a ***") console.log(module_b, "*** 打印module_b ***") console.log("*** index.js结束执行 ***")
In der Datei module_a ist module.exports oder exports nicht angegeben, aber eine asynchrone Ausführungsanweisung setTimeout wurde hinzugefügt. Der Inhalt lautet wie folgt:
console.log("** module_a开始执行 **") let name = "I'm module_a" setTimeout(() => { console.log(name, "** setTimeout打印a的名字 **") }, 0) console.log("** module_a结束执行 **")
In der Datei module_b ist module.exports angegeben (Er kann auch durch „exports.name“ ersetzt werden, kann jedoch nicht direkt verwendet werden. „exports“ entspricht einem bestimmten Objekt, da „exports“ und „module.exports“ tatsächlich auf eine Adresse verweisen und auf dasselbe Objekt verweisen. Wenn „exports“ verwendet wird, um anderen zu entsprechen Referenztypen, es wird nicht mehr auf module.exports verweisen und der Inhalt in module.exports kann nicht geändert werden), der Inhalt ist wie folgt:
console.log("** module_b开始执行 **") let name = "I'm module_b" console.log(name, "** 打印b的名字 **") module.exports = { name } console.log("** module_b结束执行 **")
Führen Sie node index.js im aktuellen Verzeichnisterminal aus und erhalten Sie die folgende Ausgabe:
*** index.js开始执行 ***
** module_a开始执行 **
** module_a结束执行 **
** module_b开始执行 **
I am module_b ** 打印b的名字 **
** module_b结束执行 **
{} '*** 打印module_a ***'
{ name: 'I am module_b' } '*** 打印module_b ***'
*** index.js结束执行 ***
I am module_a ** setTimeout打印a的名字 **
通过以上执行结果可以得出结论:
require某个js文件时,如果未通过exports或者module.exports指定导出内容,则require返回的结果是一个空对象;反之可以通过module.export或者给exports属性赋值来导出指定内容。
require某个js文件时,该文件会立即sync执行。
require导入模块
我们先选择一个npm包——cors。 进入文件夹,运行一下命令:
npm init -y // 初始化 echo -e "let cors = require(\"cors\")\nconsole.log(cors)" > index.js // 生成index.js文件 npm install cors --save // 安装cors包
文件结构如下(...处省略了其他的模块):
. ├── index.js ├── node_modules │ ├── cors │ │ ├── CONTRIBUTING.md │ │ ├── HISTORY.md │ │ ├── LICENSE │ │ ├── README.md │ │ ├── lib │ │ │ └── index.js │ │ └── package.json │ │ ... ├── package-lock.json └── package.json
index.js中的内容如下:
let cors = require("cors") console.log(cors)
运行 node index.js ,得出以下结果:
[Function: middlewareWrapper]
找到node_modules下的cors模块文件夹,观察cros模块中的package.json文件,找到main字段: "main": "./lib/index.js" ,找到main字段指向的文件,发现这是一个IIFE,在IIFE中的代码中添加,console.log("hello cors"),模拟代码结构如下:
(function () { 'use strict'; console.log("hello cors"); // 这是手动添加的代码 ... function middlewareWrapper(o) { ... } module.exports = middlewareWrapper; })()
再次运行 node index.js ,得出以下结果:
hello cors
[Function: middlewareWrapper]
为什么会打印出 hello cors 呢?因为require模块的时候,引入的是该模块package.json文件中main字段指向的文件。而这个js文件会自动执行,跟require引用本地js文件是相同的。
packjson文档
在npm的官方网站中可以找到关于package.json中的main字段定义。
main The main field is a module ID that is the primary entry point to your program. That is, if your package is named foo, and a user installs it, and then does require("foo"), then your main module's exports object will be returned. This should be a module ID relative to the root of your package folder For most modules, it makes the most sense to have a main script and often not much else.
在以上说明中可以得出以下结论:
main字段是一个模块ID,是程序的主入口。
当使用require("xxx")的时候,导入的是main字段对应的js文件里的module.exports。
所以require导入模块的时候,是运行的对应模块package.json中main字段指定的文件。
推荐学习:《node视频教程》
Das obige ist der detaillierte Inhalt vonKnoten erfordern, was das bedeutet. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

UsSestate () iscrucialforoptimizingreactappperformancieDuetoitSimpactonre-rendersandupdates.tooptimize: 1) UseSecallbackTomemoizeFunctions undPrevventUnNeNne-R-Rendern.2) mopingusemoforcachtenexpensivecomputationen.3) BreakstateIntoSmallvarioRsformor

Verwenden Sie den Kontext und verwenden Sie die Teilen von Staaten, da sie das Staatsmanagement in großen React -Anwendungen vereinfachen können. 1) Reduzieren Sie die Propdrillung, 2) Clearer Code, 3) Leichter zu verwalten. Achten Sie jedoch auf die Leistungsaufwand und das Debuggen der Komplexität. Der rationale Einsatz von Kontext- und Optimierungstechnologie kann die Effizienz und Wartbarkeit der Anwendung verbessern.

Die Verwendung falscher Tasten kann Leistungsprobleme und unerwartetes Verhalten in React -Anwendungen verursachen. 1) Der Schlüssel ist ein eindeutiger Kenner des Listenelements, der dazu beiträgt, das virtuelle DOM effizient zu aktualisieren. 2) Die Verwendung desselben oder nicht eindeutigen Schlüssels führt dazu, dass die Listenelemente neu beordnet werden und die Komponentenzustände verloren gehen. 3) Die Verwendung stabiler und eindeutiger Kennungen als Schlüssel kann die Leistung optimieren und eine vollständige Wiederholung vermeiden. 4) Verwenden Sie Tools wie Eslint, um die Richtigkeit des Schlüssels zu überprüfen. Die ordnungsgemäße Verwendung von Tasten sorgt für effiziente und zuverlässige React -Anwendungen.

Inreact, KeysareessentialforoptimizingListenderingPerformanceByHelpingReactrackchangesinlistItems.1) KeysenableEffabieDdomupdatesByidentifyidaded, orremovedItems.2) mithilfe von uniquidenifierslikedatabasaskeyskeys, eher thanindices, verhindert, verhindert, verhindert

Usestate wird oft in React missbraucht. 1. Verstehen Sie den Arbeitsmechanismus des Gebrauchs falsch: Der Status wird nicht sofort nach dem SetState aktualisiert. 2. Fehleraktualisierungsstatus: SetState in Funktionsformular sollte verwendet werden. 3.. Überbeanspruchung Usestate: Verwenden Sie gegebenenfalls Requisiten. 4. Ignorieren Sie das Abhängigkeits -Array der Verwendungseffekt: Das Abhängigkeits -Array muss aktualisiert werden, wenn sich der Status ändert. 5. Leistungsüberlegungen: Batch -Updates für Staaten und vereinfachte Zustandsstrukturen können die Leistung verbessern. Das korrekte Verständnis und die Verwendung von Usestate kann die Code -Effizienz und -wartbarkeit verbessern.

Ja, ReactApplicationscanbeseo-freundlich withProperStrategies.1) uaServer-Siderendering (SSR) mit TOOLSLIKENEXT.JStogenerateFullHtmlforIndexing.2) ImplementStaticSitegeneration (SSG) forcent-heavysitestopre-renderPagesStimeTime.3)

React-Leistungs Engpässe werden hauptsächlich durch ineffizientes Rendering, unnötiges Wiederaufbau und Berechnung des internen Gewichts der Komponente verursacht. 1) Verwenden Sie ReactDevtools, um langsame Komponenten zu lokalisieren und die React.MEMO -Optimierung anzuwenden. 2) Optimieren Sie die Verwendung von Effect, um sicherzustellen, dass es nur bei Bedarf ausgeführt wird. 3) Verwenden Sie Usememo und Usecallback für die Speicherverarbeitung. 4) Teilen Sie die große Komponente in kleine Komponenten. 5) Verwenden Sie für Big Data -Listen die virtuelle Bildlauftechnologie, um das Rendering zu optimieren. Durch diese Methoden kann die Leistung von React -Anwendungen erheblich verbessert werden.

Jemand könnte aufgrund von Leistungsproblemen, Lernkurven oder der Erforschung verschiedener UI -Entwicklungsmethoden nach Alternativen zum Reagieren suchen. 1) Vue.js wird für die einfache Integration und die milde Lernkurve gelobt, die für kleine und große Anwendungen geeignet ist. 2) Angular wird von Google entwickelt und ist für große Anwendungen mit einem leistungsstarken Typsystem und Abhängigkeitsinjektion geeignet. 3) Svelte bietet eine hervorragende Leistung und Einfachheit, indem es zum Bauzeit zu effizientem JavaScript zusammengestellt wird, aber sein Ökosystem wächst immer noch. Bei der Auswahl von Alternativen sollten sie basierend auf Projektanforderungen, Teamerfahrung und Projektgröße bestimmt werden.


Heiße KI -Werkzeuge

Undresser.AI Undress
KI-gestützte App zum Erstellen realistischer Aktfotos

AI Clothes Remover
Online-KI-Tool zum Entfernen von Kleidung aus Fotos.

Undress AI Tool
Ausziehbilder kostenlos

Clothoff.io
KI-Kleiderentferner

Video Face Swap
Tauschen Sie Gesichter in jedem Video mühelos mit unserem völlig kostenlosen KI-Gesichtstausch-Tool aus!

Heißer Artikel

Heiße Werkzeuge

PHPStorm Mac-Version
Das neueste (2018.2.1) professionelle, integrierte PHP-Entwicklungstool

mPDF
mPDF ist eine PHP-Bibliothek, die PDF-Dateien aus UTF-8-codiertem HTML generieren kann. Der ursprüngliche Autor, Ian Back, hat mPDF geschrieben, um PDF-Dateien „on the fly“ von seiner Website auszugeben und verschiedene Sprachen zu verarbeiten. Es ist langsamer und erzeugt bei der Verwendung von Unicode-Schriftarten größere Dateien als Originalskripte wie HTML2FPDF, unterstützt aber CSS-Stile usw. und verfügt über viele Verbesserungen. Unterstützt fast alle Sprachen, einschließlich RTL (Arabisch und Hebräisch) und CJK (Chinesisch, Japanisch und Koreanisch). Unterstützt verschachtelte Elemente auf Blockebene (wie P, DIV),

MinGW – Minimalistisches GNU für Windows
Dieses Projekt wird derzeit auf osdn.net/projects/mingw migriert. Sie können uns dort weiterhin folgen. MinGW: Eine native Windows-Portierung der GNU Compiler Collection (GCC), frei verteilbare Importbibliotheken und Header-Dateien zum Erstellen nativer Windows-Anwendungen, einschließlich Erweiterungen der MSVC-Laufzeit zur Unterstützung der C99-Funktionalität. Die gesamte MinGW-Software kann auf 64-Bit-Windows-Plattformen ausgeführt werden.

MantisBT
Mantis ist ein einfach zu implementierendes webbasiertes Tool zur Fehlerverfolgung, das die Fehlerverfolgung von Produkten unterstützen soll. Es erfordert PHP, MySQL und einen Webserver. Schauen Sie sich unsere Demo- und Hosting-Services an.

EditPlus chinesische Crack-Version
Geringe Größe, Syntaxhervorhebung, unterstützt keine Code-Eingabeaufforderungsfunktion
