Question

我遇到了Object.assign和... spread operator的问题。我需要处理值（名称和值为对象的对象）。

我的值对象示例：

{
  id: "12",
  name: "Hotel MESSI", 
  email: "myemail@aol.com", 
  phone: "+001060666661",
  otherfields: "{ 
     country: 'ZW',
     city: 'Zurick'
  }"
}

otherfields来自graphql，所以它是字符串，我必须转换为object。通过我的流程，我找到了这个结果：

{
  id: "12",
  name: "Hotel MESSI", 
  email: "myemail@aol.com", 
  phone: "+001060666661",
  country: 'ZW',
  city: 'Zurick'
}

代码中有更多我粘贴的代码，有很多值和转换控件，但主要是想法是重新定值，

使用这两种情况分配给同一个变量不起作用：

案例1，使用object.assign

processValues = (values)=>
  let newValues = {...values}; // 
  for (const fieldName in Tables[table].fields) {
    let value = values[fieldName];
    value = JSON.parse(value); 
    newValues = { ...newValues, ...value};                
    console.error('after mix',newValues);

案例2，使用object.assign

processValues = (values)=>
  let newValues = Object.assign({}, values}; // 
  for (const fieldName in Tables[table].fields) {
    let value = values[fieldName];
    value = JSON.parse(value); 
    newValues =  Object.assign( newValues, value};                
    console.error('after mix',newValues);

当我使用新变量时，它是如何工作的，例如：

newValues2 =  Object.assign( newValues, value};

但我的想法是不使用另一个变量因为，我需要获取值并为原始变量'newValues'设置值，如果我使用另一个变量，代码会更麻烦。

我在使用create-react-app的项目中使用。我不知道这是不是巴贝尔的问题，因为Object.assign和spread运算符不是不可改变的;还是？

信息：

Tables [table] .fields是一个定义为我的表结构的对象，有很多规则，但基本上我需要知道为什么对象和...不起作用

Answer 1

JSON.stringify的使用无济于事，因为这将产生一个JSON字符串，在传播它时会有完全不同的行为（你得到该字符串的各个字符）。

以下是如何使用“otherfields”作为特殊字段来实现结果（您可以在我使用的数组中添加其他字段）：

const processValues = values =>
    Object.assign({}, ...Object.entries(values).map( ([key, val]) => 
        ["otherfields"].includes(key) ? val : { [key]: val }
    ));

// Example:    
const values = {
    id: "12",
    name: "Hotel MESSI", 
    email: "myemail@aol.com", 
    phone: "+001060666661",
    otherfields: { 
        country: 'ZW',
        city: 'Zurick'
    }
};        

const result = processValues(values); 
console.log(result);

Answer 2

要分配的第一个参数是目标。所以它会改变。如果您不希望更改任何源，则可以为目标传递一个空对象。当您将第一个参数用作{}时，则不会更改任何值。有关更多信息，请参阅。 https://wecodetheweb.com/2016/02/12/immutable-javascript-using-es6-and-beyond/

Object.assign和... spread operator fail silent，不添加元素

2 个答案: