Question

我正在研究一个demo react项目，被卡住以选择js对象的名称和值并推送到数组。我想将其用于queryparams。 js对象如下所示

const ingredient = [
    { salad: 0,  bacon: 0 },
    { cheese: 0, meat: 0  }
]

在这里，我想将键和值推到数组。例如。

const arrays = []

我尝试这种方式，但没有正确。

=> for (let name of ingredient){
arrays.push(name + ingredient[name])
 }
=> arrays
 (2) ["[object Object]undefined", "[object Object]undefined"]

如何正确地仅推送名称和值，以便能够在url中使用它们？

在此先感谢您的帮助。

Answer 1

尝试一下：

ingredient.forEach((elem) => 
{
    for(key in elem)
    {
        arrays.push(`${key}, ${elem[key]}`);
    }
});

Answer 2

首先，您遇到结构问题：代替

const ingredient = [
    { salad: 0,  bacon: 0 },
    { cheese: 0, meat: 0  }
]

您应该拥有

const ingredient = { salad: 0,  bacon: 0, cheese: 0, meat: 0  }

或

const ingredient = [{salade:0}, {bacon:0}, {cheese:0}, {meat:0}]

假设您只保留一个对象：

const ingredient = { salad: 2,  bacon: 3, cheese: 4, meat: 0  }

let toQuery = function(obj, is_str) {
  let arr = Object.keys(obj).reduce((acc, key) => { 
    acc.push(key+"="+obj[key]); 
    return acc 
  }, [])
  return is_str ? "?" + arr.join('&') : arr
}

console.log(toQuery(ingredient, false))
console.log(toQuery(ingredient, true))

现在使其与您的对象一起使用（例如，多配方）

const ingredient = [{ salad: 2,  bacon: 3}, {cheese: 4, meat: 0  }]


    let toQuery = function(obj, to_str) {
      let arr = []
      obj.forEach(o => {
        Object.keys(o).forEach(k => {
          arr.push(k+"="+o[k]) 
        })
      })
      return to_str ? "?" + arr.join('&') : arr
    }

    console.log(toQuery(ingredient, false))
    console.log(toQuery(ingredient, true))

Answer 3

如果您提到的name是对象项的key。你可以试试看。

const ingredient = [
    { salad: 0,  bacon: 0 },
    { cheese: 0, meat: 0  }
]

const rs = ingredient.reduce((acc, e) =>{
  for(let key in e) {
    acc.push(`${key}: ${e[key]}`)
  }
  return acc
}, [])

console.log(rs)

将js对象推送到数组

3 个答案: