作为一个前端从事者，对数据的处理也是一种必备技能。所谓的重组数据是什么呢？拿个例子来说：比如在获取某些数据的时候，获取到了一个对象数组的格式数据，在这组数据里面，有些字段不能够直接展示给用户，而需要进行一下转换，时间戳我们需要转为正常日期时间、某些数据的状态值，可能是用数字代表，我们需要转为相对应的文字说明，再例如一个字段里存了多张图片链接，但是此字段是一个字符串，我们又如何把这些值转换为正常的能够显示在界面的数据。
接下来，我就讲一下当我们获取到一个对象数组之后，如何对需要处理的字段进行格式化处理。
先拿小程序来做个示例：
当我们获取到某组数据之后将其赋值给data里面的自定义数组，接着在赋值之后去调用封装好的处理数据的函数。
this.setData({
OrderList:res.data.data
},()=>{
this.dealTime();
})
在上面这段示例中，我们将获取到的数组赋值给OrderList数组，接着去调用封装好的dealTime函数去处理数组里的时间戳字段，将时间戳改为日期。
const utils = require('../../utils/util')
dealTime(){
var timelist = this.data.OrderList
for (let index = 0; index < this.data.OrderList.length; index++) {
var time = this.data.OrderList[index]["add_time"]
const ti = utils.formatTime(new Date(time*1000))
timelist[index]['add_time'] = ti
this.setData({
OrderList:timelist
})
}
},
我来解释一下这个函数代码：首先我们将OrderList赋值给一个中间变量，我们来改变这个中间变量，接着再将此中间变量赋值给OrderList。
首先获取OrderList数组中的某个字段，上述代码中，add_time为时间戳字段。接着通过工具包中的代码将此时间戳进行处理，返回一个日期。再将此日期变量赋值给原来的时间戳字段，接着调用一下this.setData函数，这就完成了数据格式的转变。
接着我再使用vue中的代码实现一下此过程。网页中一般在后台会比较多使用数据转换。直接来上代码，我的需求是将一个字符串字段转为一个数组从而达到可用的数据格式。
fetchData(query).then((res) => {
if (res.msg == "操作成功") {
var list = _this.dealImg(res.data)
_this.orderList = list;
}else{
_this.$message.warning(res.data)
}
_this.loading = false;
});
fetchData是我封装的一个网络请求的方法，回传res。我们现在需要对res里面的数据进行格式化处理。dealImg是我封装的一个方法，进行对res.data里面的数据进行处理。
dealImg(res){
var list = res
for (let index = 0; index < list.length; index++) {
var img = list[index]["img"]
if(img){
var imglist = img.toString().split('|')
list[index]["img"] = imglist
}else{
list[index]["img"] = []
}
}
return list;
},
在这里我也有必要解释以下上面的代码，img是一个字符串字段，此字段可能包含着多个图片链接，每个链接之间以 | 分隔，所以想要使用这样的数据，我们必须将此字符串分开每个链接放进一个数组里面，然后可以循环使用此数组进行图片展示。
给两个典型的示例你们应该就可以理解此类数据转换的核心了。有问题可以下方留言~