如何将带有对象作为键的 Ruby 哈希对象作为 Map 对象发送到前端 Javascript

Posted 2023-02-15

【中文标题】如何将带有对象作为键的 Ruby 哈希对象作为 Map 对象发送到前端 Javascript

【英文标题】：How to send a Ruby hash object with objects as keys to front end Javascript as a Map object

【发布时间】：2021-10-12 05:29:59

【问题描述】：

javascript 不支持将对象作为对象键，但 Map 对象支持。我的问题是，有没有办法轻松地将这样的对象从后端发送到前端？

def test_controller
  object = "a"=>1,"b"=>2
  front_end_object = object => 5
  render json: front_end_object, status: 200
end

$.ajax(
  type:"POST",
  url: "/pull_from_test_controller",
  dataType:"json",
  contentType:"application/json",
  data: ,
  success: function(response, status_string, jqxhr) 
     console.log(response)
  
)

正如预期的那样，在前端记录的response，因为它被转换为JSON，在后端内置了object作为字符串键。

// console response
response = "a"=>"1","b"=>"2": 5
// further inspection
Object.keys(response)[0] = "\"a\"=>\"1\", \"b\"=>\"2\""

有什么方法可以在前端轻松地将它转换为 Map 对象以再次将对象作为键，或者在渲染过程中表明这一点？

我目前的解决方案只是 JSON.parse，但这似乎很笨重

JSON.parse(Object.keys(response)[0])

【问题讨论】：

developer.mozilla.org/en-US/docs/Web/JavaScript/…（链接自Map） - 如果我理解正确，对象将不相等。一种可能的解决方法是使用字符串化对象作为键。

【参考方案1】：

您正确地注意到，在 JS 中，对象键应该是字符串。那么为什么不简单地使用字符串呢？

# In Ruby
def test_controller
  object = "a"=>1,"b"=>2
  front_end_object = "key"=>object, "value"=>5   # Look here
  render json: front_end_object, status: 200
end

// In JS
$.ajax(
  type:"POST",
  url: "/pull_from_test_controller",
  dataType:"json",
  contentType:"application/json",
  data: ,
  success: function(response, status_string, jqxhr) 
     console.log(response)
     // Should be: "key":"a":1,"b":2,"value":5

     // Then no need to parse or anything, just access the values directly.

     console.log(response.key)     // "a":1,"b":2
     console.log(response.key.a)   // 1
     console.log(response.key.b)   // 2
     console.log(response.value)   // 5
     
  
)

我建议你使用一些比key 和value 更有意义的名称；）