博客

最近接到一个需求，前端和后端对接接口数据时，双方的字段名不同，但由于过往数据太多，无法逐个进行修改，就通过封装一个方法统一进行转换适配。

<button id="btn">发起请求</button>
    <div></div>
    <script src="../js/jquery.v.3.6.js"></script>
    <script>
        let obj = [{
            id: 1,
            name: "万达MAll",
            type: "商超",
            contactperson: "科比",
            phone: 111,
            address: "成都市1街",
            creatyperson: "LQ",
            leaderperson: "LJX",
            createtime: "2011-11-11",
        }]
        let data;//设置接收后端数据的全局变量
        btnClick()
        function btnClick() {
            $('#btn').click(() => {
                $.ajax({
                    method: 'post',
                    url: 'http://localhost:1234/getList',
                    data: '',
                    success: function (res) {
                        // console.log(res);
                        data = res
                        adaptation()
                    }
                })
            })
        }
        function adaptation() {//数据转换适配器
            console.log(data);
            let resKey = Object.keys(data[0])//获取后端数据的键名
            let objKey = Object.keys(obj[0])//获取前端的键名
            console.log(resKey);
            console.log(objKey);
            let newList = [];//声明新的数组承接新数据
            for (let i = 0; i < data.length; i++) {
                let itemData = data[i]//获取每一个单独的对象
                let newObj = {}//新对象承接属性名
                let j = 0
                for (let key in itemData) {
                    newObj[objKey[j]] = itemData[resKey[j]]
                    j++
                }
                newList.push(newObj)
            }
            console.log(newList);

            return newList
        }
    </script>

前端新手，各位大佬多多指点