javascript - 动态将字符串转换为对象

Question

我有一个 API 返回以下字符串

styles: "background #2b2b2b; color: #FFFFFF"

我需要将其即时转换为这样的对象

styles: { background: '#2b2b2b', color: '#FFFFFF' }

如何最好地实现这一目标

Answer 1

提问前请先搜索一下。人们现在会降低你的问题的评分。但无论如何，这里有一个答案......

const str = "background #2b2b2b; color: #FFFFFF"
const obj = str.split('; ').reduce((acc, keyVal) => {
  const [key, val] = keyVal.split(' ')
  acc[key] = val
  return acc
}, {})

console.log(obj) // {background: "#2b2b2b", color:: "#FFFFFF"}

// if str was just 'background #2b2b2b;' it would include the ;
// {background: "#2b2b2b;"}

正如有人提到的，您的字符串不一致，因此您需要修复字符串格式或添加处理边缘情况的方法。

更新:也许更灵活的方法是使用 RegExp。我不是最擅长编写正则表达式，因此它可能需要改进。

// add acceptable characters in the brackets [ ]
const re = /([a-z-]+):\s?([()'"#a-z0-9]+);/gi

const str = 'background: #2b2b2b; color: #FFFFFF;background-url: url("test");'
const styles = {}

let next

while ((next = re.exec(str)) !== null) {
  const key = next[1]
  const value = next[2]
  // or const [ _, key, value ] = next

  styles[key] = value
}

console.log(styles)

/*
{
  background: '#2b2b2b',
  color: '#FFFFFF',
  'background-url': 'url("test")'
}
*/

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp/exec