立即执行函数报错Uncaught TypeError: (intermediate value) is not a function.
前言
立即执行函数报错Uncaught TypeError: (intermediate value) is not a function.
一、现象
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
// 如果应用 加载 刚开始加载A应用 window.a,然后加载B应用（window.a）;
// 单应用切换时, 沙箱：创造一个干净的环境给子应用使用，当切换时可以选择丢弃和回复属性
// 快照沙箱: 一年前拍一张照片 一年后再拍一张 （将前后对比的区别保存起来） 应用: 将区别应用回到一年前 或者是回复到一年前后再此恢复到当前
// 快照沙箱代码实现
class SnapshotSandbox {
constructor() {
this.proxy = window // window属性
this.modifyPropsMap = {} // 记录在window上的修改
this.active() // 恢复沙箱（恢复到当前状态）
}
active() {
this.windowSnapshot = {} // 拍照
for(let prop in window) {
if(window.hasOwnProperty(prop)) {
this.windowSnapshot[prop] = window[prop]
}
}
Object.keys(this.modifyPropsMap).forEach(p=>{
window[p] = this.modifyPropsMap[p]
})
}
inactive() {
for(let prop in window){
if(window.hasOwnProperty(prop)) {
if(window[prop] !== this.windowSnapshot[prop]) {
this.modifyPropsMap[prop] = window[prop];
window[prop] = this.windowSnapshot[prop]
}
}
}
}
}
let sandbox = new SnapshotSandbox()
// 应用的运行， 从开始到结束，切换后不会影响全局
((window)=>{
window.a = 1
window.b = 2
console.log(window.a, window.b)
sandbox.inactive()
console.log('失活（回到一年前）',window.a, window.b)
sandbox.active()
console.log('激活（恢复沙箱）',window.a, window.b)
})(sandbox.proxy)
// 如果是多个子应用不能使用这种方式
// 代理沙箱可以实现多应用沙箱，把不同应用用不同的代理处理
</script>
</body>
</html>
二、解决
三、原因分析
出现这种bug的原因：在你的代码中，同时定义了变量、匿名函数或者闭包函数，并且该变量定义在了这两类函数之前，如果变量后面省略了分号，js就会自动解析为匿名函数进行自调，会被认为是变量名而不是方法，从而会导致报错；所以变量后面以及闭包函数后面都需要加上分号。
如下图示例：加上分号后bug得以解决
总结
看到问题不要怕，锤它
1007
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
