共计 1387 个字符，预计需要花费 4 分钟才能阅读完成。
前言
次要报错信息：
ERROR RangeError: Maximum call stack size exceeded这周次要钻研了栈溢出问题的起因及如何解决。
探索起因
通过控制台的报错信息得悉，因为是反复申请了一个后盾地址导致。然而，这是如何引起的呢。
咱们找到前台申请的相干代码。发现是一个拦截器。拦截器的次要作用是对申请的地址退出 /api/ 前缀。而后在其构造函数下进行打印，发现反复进行了构造函数办法。
猜测可能是哪个局部进行了反复申请造成了反复调用拦截器。
咱们再看看咱们的初始化办法
constructor(private router: Router,
private commonService: CommonService,
private settingService: SettingService) {this.ngOnInit();
}
ngOnInit() {this.settingService.findByKey(SettingConst.customerServicePhoneNumber)
.subscribe(setting => this.customerServicePhoneNumber = setting.value);
}在构造函数里写 ngOnInit 办法是因为这和咱们不同的组件 c 层不同，c 层会初始化时被动调用 ngOnInit 办法。而这里并不会被动调用。
咱们看到 ngOnInit 办法进行了 url 申请，而咱们的拦截器就是在 url 申请的时候拦截器进行了构造函数。
这就在构造函数的 url 申请与申请时进行构造函数之间进行了死循环。当循环的次数越多，就造成了栈溢出。
然而却不是每次 url 申请都会进行构造函数。如果是这样，那就代表着拦截器会每触发一次进行一次死循环。也就是多例模式。
然而通过测试发现，在进入零碎后进行删除老师或者减少老师的申请后盾地址的操作时，并没有进行拦截器的构造函数。
这也就阐明拦截器是单例模式。
了解单例模式与多例模式。
举个例子：咱们在点外卖时会有外卖小哥给咱们配送。单例模式就是我点十次外卖都是一个外卖小哥配送，其他人点外卖也会由他来送。而多例模式就是每点一次外卖就会有一个不同的人来配送，并且每次送外卖的人都不雷同。
在之后的申请时，并没有执行初始化函数，也阐明了没有实例化拦截器这个类，所以这是一个单例模式。然而为什么单例模式下在构造函数中申请时会再次执行构造函数。
解决
在老师的领导下，晓得了其中的起因，在执行拦截器构造函数时，此时是没有拦截器的。零碎在断定没有拦截器后持续进行一个新的实例化。持续进行构造函数，进而造成了死循环。
解决办法就是异步解决
ngOnInit() {setTimeout(() => {this.settingService.findByKey(SettingConst.customerServicePhoneNumber)
.subscribe(setting => this.customerServicePhoneNumber = setting.value);}, 0)
}setTimeout 办法就是对某段代码进行开启一个新的线程并执行。尽管是 0 秒后执行，然而是一个异步执行。
咱们在进行 setTimeout 办法的同时。接着往下执行。执行结束后，也就代表着结构器对象曾经结构好了。当前再次进行申请时，就应用第一次结构好的拦截器。就不会产生死循环问题了。
