在浏览器中编写javascript时限制副作用

Question

使用javascript在浏览器中编程时限制副作用非常棘手.

我可以做一些事情,比如不要访问成员变量,就像这个愚蠢的例子:

let number = 0;

const inc = (n) => {
  number = number + n;

  return number;
};

console.log(inc(1));  //=> 1
console.log(inc(1));  //=> 2

但是我可以做些什么来减少我的javascript中的副作用？

Answer 1

当然,您可以通过仔细编程来避免副作用.我假设你的问题是关于如何预防它们.你这样做的能力受到语言本质的严重限制.以下是一些方法:

1. 使用网络工作者.见MDN.Web worker在另一个与当前窗口不同的全局上下文中运行:

2. 在iframe中隔离某些逻辑.使用跨窗口消息传递与iframe通信.

3. 不变性库.请参阅https://github.com/facebook/immutable-js.还有http://bahmutov.calepin.co/avoid-side-effects-with-immutable-data-structures.html.

4. 锁定你的目标与Object.freeze,Object.seal或Object.preventExtensions.同样,在使用Object.definePropertygetter但没有setter的对象上创建只读属性,或者将writeable属性设置为false.

5. 使用Object.observe获取对象及其属性的各种类型更改的异步报告,您可以在其上抛出错误或采取其他操作.

6. 如果可用,请使用Proxy完全控制对对象的访问.

有关阻止访问的注意事项window,请参阅javascript沙箱模块以防止引用Window.还有http://dean.edwards.name/weblog/2006/11/sandbox/.最后,半沙盒Javascript评估.

区分内向副作用和外向副作用是有用的.向内的副作用是其他一些代码侵入我的组件状态的地方.向外的副作用是我的代码侵入其他组件的状态.通过其他答案中提到的IIFE或ES6模块可以防止内向副作用.但更严重的问题是外部副作用,这需要采用上述方法之一.