js对象平铺的两种表现方式

本文探讨了JavaScript中处理多维对象平铺的两种常见方式。第一种是将多维对象转换为扁平结构,第二种则涉及特定的平铺形式。通过示例代码展示了如何实现这两种方法。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

一、常规的平铺需求。

  给出一个多维对象

  

var obj = {
                eureka1: {
                    clinet: {
                        clinetclient: 70,
                        healthcheck1: {
                            enabled: true
                        },
                        serviceUrl: "http://dsfasdf"
                    },
                    instance: {
                        health: "/health",
                        hostname: "${hostname}",
                        prefer: true,
                        statuspath: "/info"
                    },
                    server: {
                        enabledvation: false,
                        peer: 6000
                    }
                },
                eureka2: {
                    health: {
                        status: {
                            order: "DOWN,UP"
                        }
                    }
                }
            }

  需要转换的形式为:

      

 

  js方法:

        

<script>
            var obj = {
                eureka1: {
                    clinet: {
                        clinetclient: 70,
                        healthcheck1: {
                            enabled: true
                        },
                        serviceUrl: "http://dsfasdf"
                    },
                    instance: {
                        health: "/health",
                        hostname: "${hostname}",
                        prefer: true,
                        statuspath: "/info"
                    },
                    server: {
                        enabledvation: false,
                        peer: 6000
                    }
                },
                eureka2: {
                    health: {
                        status: {
                            order: "DOWN,UP"
                        }
                    }
                }
            }

            function haveChildren(data, list) {
                for (let key in data) {
                    if (typeof data[key] === 'object' && isNaN(data[key].length)) {
                        this.haveChildren(data[key], list)
                    } else {
                        list.push({
                            name: key,
                            value: data[key]
                        })
                    }
                }
                return list
            }
            var mydata = haveChildren(obj, []);
            console.log(mydata1);
        </script>

 

二、在开发的过程中,有接到第二种需求

  表现形式为:

  

 

  代码:

  

<script>
			var obj = {
				eureka1: {
					clinet: {
						clinetclient: 70,
						healthcheck1: {
							enabled: true
						},
						serviceUrl: "http://dsfasdf"
					},
					instance: {
						health: "/health",
						hostname: "${hostname}",
						prefer: true,
						statuspath: "/info"
					},
					server: {
						enabledvation: false,
						peer: 6000
					}
				},
				eureka2: {
					health: {
						status: {
							order: "DOWN,UP"
						}
					}
				}
			}

			function getObjectData(data, list, keyName) {
				for (let key in data) {
					if (keyName) {
						var str = keyName + '.' + key
					} else {
						var str = key;
					}
					if (typeof data[key] === 'object' && isNaN(data[key].length)) {
						this.getObjectData(data[key], list, str)
					} else {
						list.push({
							name: str,
							value: data[key]
						})
					}
				}
				return list
			}

			var mydata1 = getObjectData(obj, []);
			console.log(mydata1);
		</script>

  

 

转载于:https://www.cnblogs.com/blank-longchuan/p/objectTile.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值