使用spring boot，我从后端获得一个列表，因此在html中：

<script th:inline="javascript">
   var test = [[${productRecords}]];
</script>

通过查看页面源代码，我发现它提供了：

<script th:inline="javascript">
       var test [{"productid":1,"productname":"nail","productcosttime":null,"img":null,"counts":8,"bookings":[]},{"productid":2,"productname":"hairWash","productcosttime":null,"img":null,"counts":40,"bookings":[]},{"productid":7,"productname":"jiemao","productcosttime":null,"img":null,"counts":1,"bookings":[]},{"productid":6,"productname":"makeUp","productcosttime":null,"img":null,"counts":1,"bookings":[]}];
</script>

现在我想提取所有的'productid'和'counts'，并相应地将它们赋给新变量，如

var productid = [1,2,7,6]
var counts = [8,4-,1,1]

我怎样才能做到这一点？
我试过：

var temp = test[0].productid;