Question

我全都使用Javascript进行功能编程-特别是在使用React和Redux的情况下。

一次又一次地遇到的事情是，意外地突变对象并创建奇怪的bug是多么容易。

也就是说，在const关键字阻止重新分配变量的情况下，它并没有阻止对象本身对其变量进行重新分配。

例如：

my-module.js

export const DEFAULT_HEADERS = {  //We are going to be using this const in other modules too. 
   foo: "foo"
}; 

export function someFunction(someCond) {
   const headers = DEFAULT_HEADERS; 
   if (someCond) {
       headers.foo = "bar"; //Don't do this!
   }
};

在此示例中-如果我们将DEFAULT_HEADERS导入到另一个模块，则我们将foo的值进行了突变，并将其拧紧。

现在当然了-答案是不像我在这里那样重新分配对象属性。

但是我没有办法阻止人们改变这样的物体。

当我有一个具有嵌套结构的不可变对象时，这一点变得更加重要。

要正确执行此操作，我们需要在每个级别上分解对象，因为...{}传播语法仅是表面上的克隆。

例如：

const props = {
  alpha: {
    innerAlpha: {
      a: "aaa",
      b: "bbb",
    },

    innerAlphete: {
      b: "bbb",
      c: "ccc",
    }
  },

  beta: {
    foo: "foo",
    bar: "bar",
  }
}

//Now we want to change the value of props.innerAlpha.b to "BBB", but without mutating the original object. 

const props2 = { ...props,
  ...{
    alpha: {
      ...props.alpha,
      ...{
        innerAlpha: {
          ...props.alpha.innerAlpha,
          ...{
            b: "BBB"
          }
        }
      }
    }
  }
};


console.log(props);
console.log(props2);

用这种方式编写代码是很痛苦的，因此很容易看到有人会做类似的事情：

   const props2 = {...props}; 
   props.alpha.innerAlpha.b = "BBB";

所以我的主要问题是-是否有任何建议在Javascript中创建真正的不可变对象？

而且-是否有更方便的方法来用Javascript进行不可变编程？

2019年javascript中不可变的状态是什么？

0 个答案: