關(guān)于NodeJS中的循環(huán)引用詳解
最近在用node的時(shí)候排查一個(gè)問題排查了半天，最終發(fā)現(xiàn)是循環(huán)引用導(dǎo)致的問題，故在此記錄一下。
場景復(fù)現(xiàn)
出現(xiàn)問題場景比較簡單，一共四個(gè)類：
- parent.ts
- child.ts
- child_2.ts
- util.ts
export abstract class Parent {
abstract hello(): string;
}
import {Parent} from "./parent";
export class Child extends Parent {
hello(): string {
return "child";
}
}
import {Child} from "./child";
export class Util {
static useChildInSameCase(): string {
let child: Child;
return child.hello();
}
}
import {Parent} from "./parent";
export class Child_2 extends Parent {
hello(): string {
return "child_2";
}
}
這個(gè)時(shí)候我們?nèi)?gòu)造一個(gè)Child類：
import {Child} from "./child";
console.log(new Child().func());
就會(huì)直接報(bào)錯(cuò)了：
class Child_2 extends parent_1.Parent {
^TypeError: Class extends value undefined is not a function or null
#尋找原因
說的是這個(gè)父類是一個(gè)undefined，很明顯就是沒有初始化。
一開始我覺得很奇怪，明明在child_2這個(gè)文件里已經(jīng)import了parent，為什么會(huì)是undefined呢？后來debug查了一下代碼的堆棧，恍然大悟：
入口文件->child.ts->parent.ts->util.ts->child_2.ts->parent.ts
很明顯這里存在著一個(gè)循環(huán)引用，當(dāng)我們在加載child_2.ts這個(gè)文件的時(shí)候，parent.ts還處在未加載完的狀態(tài)。
我們可以去 官網(wǎng)看一下node中是如何處理循環(huán)引用的 。
通過官網(wǎng)我們可以知道，對于這樣的循環(huán)引用，在child_2.ts加載parent.ts的時(shí)候，會(huì)去緩存中尋找，而由于parent.ts還未加載完成，所以緩存中會(huì)是一個(gè)空對象了，官網(wǎng)中用的語句是 an unfinished copy of the a.js 。
解決方案
知道原因之后，解決方案也就變得清晰了起來，一句話搞定，將parent.ts中的import語句放在后面：
export abstract class Parent {
abstract hello(): string;
func(): string {
return Util.useChildInSameCase();
}
}
import {Util} from "./util";
這樣在加載parent.ts的時(shí)候，就會(huì)先export對象，然后再import所需要的util.ts了。
總結(jié)
以上就是這篇文章的全部內(nèi)容了，希望本文的內(nèi)容對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，謝謝大家對腳本之家的支持。
相關(guān)文章
node.js實(shí)現(xiàn)博客小爬蟲的實(shí)例代碼
這篇文章通過實(shí)例代碼來給大家介紹如何利用node.js實(shí)現(xiàn)博客小爬蟲，有需要的朋友們可以直接運(yùn)用文中給出的實(shí)例代碼來進(jìn)行實(shí)踐學(xué)習(xí)，感興趣的朋友們下面來一起看看吧。2016-10-10
Node.js實(shí)現(xiàn)兼容IE789的文件上傳進(jìn)度條
這篇文章給大家介紹了如何實(shí)現(xiàn)兼容IE789的文件上傳進(jìn)度條，如果你的工作用過上傳圖片或上傳大文件啥的，一般在IE低版本瀏覽器里，會(huì)切換到用flash解決,可是有些人肯定不會(huì)為了老舊IE的進(jìn)度條而去學(xué)flash，那么下面來一起看看吧。2016-09-09
很多人都在問到底該用Koa還是express，所以下面這篇文章就來給大家再次的對比了關(guān)于express與koa的相關(guān)資料，通過對比大家可以更好的進(jìn)行選擇，文中通過示例代碼介紹的非常詳細(xì)，需要的朋友可以參考借鑒，下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧。2018-01-01
Node.js node-schedule定時(shí)任務(wù)隔多少分鐘執(zhí)行一次的方法
這篇文章主要介紹了Node.js node-schedule定時(shí)任務(wù)隔多少分鐘執(zhí)行一次的方法,本文給出了每隔 15 分鐘、 30 分鐘執(zhí)行一次任務(wù)的編碼實(shí)例,需要的朋友可以參考下2015-02-02
async是一個(gè)流程控制工具包，提供了直接而強(qiáng)大的異步功能?；贘avascript為Node.js設(shè)計(jì)，同時(shí)也可以直接在瀏覽器中使用。2017-11-11
這篇文章主要介紹了Node.js的概念和基本原理，對Node.js感興趣的同學(xué)，一定要看一下2021-04-04
支持cjs及esm的npm包實(shí)現(xiàn)示例詳解
這篇文章主要為大家介紹了支持cjs及esm的npm包的示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2022-08-08
這篇文章主要介紹了adm-zip-0.4.13-中文文檔,本文給大家介紹的非常詳細(xì)，對大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2023-05-05
這篇文章主要為大家介紹了前端需知nodejs?express中間件使用及定義詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2022-10-10
Node中的util.promisify()方法的基本使用和實(shí)現(xiàn)
眾所周知，在JS中實(shí)現(xiàn)異步編程主要是通過以下幾種方案，回調(diào)函數(shù)，觀察者模式，Generator，Promise，async / await ，今天就和大家一起聊一下在node中的一個(gè)util.promisify()這個(gè)API的基本使用和基本實(shí)現(xiàn)2023-07-07