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

最新推荐文章于 2024-11-29 11:40:48 发布

转载最新推荐文章于 2024-11-29 11:40:48 发布 · 1.5k 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/blank-longchuan/p/objectTile.html

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

一、常规的平铺需求。

　　给出一个多维对象

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