深层递归给formData循环添加参数

深层递归给formData循环添加参数,处理基本类型、数组、对象、数组套对象、对象套数组、对象数组多层嵌套

let obj = {
    name: '张飞',
    age: 100,
    info: {
        address: '杭州',
        tel: 15888888888,
        infoObj: {
            a: 111,
            b: 222,
            c: [3, 4, 5]
        }
    },
    info2: [
        { obj: 1, obj2: 2, obj3: [5, 6, 7] },
        'bb',
        'cc'
    ],
    desc: '用户'
}

const appendFormData = (obj) => {
    let formData = new FormData();
    function deepAppendFormData(formData, data, parentKey = "") {
        if (Array.isArray(data)) {
            // 如果数据是数组,处理每个元素
            data.forEach((item, index) => {
                if (typeof item === "object" && item !== null) {
                    deepAppendFormData(formData, item, `${parentKey}[${index}]`);
                } else {
                    formData.append(`${parentKey}[${index}]`, item.toString());
                }
            });
        } else if (typeof data === "object" && data !== null) {
            // 如果数据是对象,递归处理
            for (let key in data) {
                if (data.hasOwnProperty(key)) {
                    let newKey = parentKey ? `${parentKey}.${key}` : key;
                    deepAppendFormData(formData, data[key], newKey);
                }
            }
        } else {
            // 如果数据是基本类型,直接添加到 FormData
            formData.append(parentKey, data.toString());
        }
    }
    deepAppendFormData(formData, obj);
    return formData;
}

// 返回结果,输出
const data = appendFormData(obj)
for (let [a, b] of data) {
    console.log(a, b);
}

image.png

JSON.stringify序列化

更简单的方法,直接使用JSON.stringify序列化,让后端反序列化,不用深层递归

let obj = {
    name: '张飞',
    age: 100,
    info: {
        address: '杭州',
        tel: 15888888888,
        infoObj: {
            a: 111,
            b: 222,
            c: [3, 4, 5]
        }
    },
    info2: [
        { obj: 1, obj2: 2, obj3: [5, 6, 7] },
        'bb',
        'cc'
    ],
    desc: '用户'
}


const appendFormData = (obj) => {
    let formData = new FormData();
    function deepAppendFormData(formData, data, parentKey = "") {
        if (Array.isArray(data) || (typeof data === "object" && data !== null)) {
            // 如果数据是数组或对象,序列化为 JSON 字符串
            formData.append(parentKey, JSON.stringify(data));
        } else {
            // 如果数据是基本类型,直接添加
            formData.append(parentKey, data.toString());
        }
    }
    for (let key in obj) {
        if (obj.hasOwnProperty(key)) {
            deepAppendFormData(formData, obj[key], key);
        }
    }
    deepAppendFormData(formData, obj);
    return formData;
}

// 返回结果,输出
const data = appendFormData(obj)
for (let [a, b] of data) {
    console.log(a, b);
}

image.png


兔子先森
420 声望18 粉丝

致力于新技术的推广与优秀技术的普及。