获取JavaScript对象的字符串表示形式

时间:2014-06-23 18:59:21

标签: javascript

我有一个像这样的对象:

$scope.query = {
    filter: {
        column: {
            productName: 'Some Product',
            price: 29.95,
            ...
        },
        table: {
            productType: 'GM',
            categoryId: 1,
            ...
        }
    }
};

如何以点表示法获取表示整个对象的字符串? e.g。

query.filter.table.productType

为了澄清,我使用此字符串值作为在localStorage中存储键/值对的键。

我正在使用angular来$ wacth对象上的每个属性进行更改。由于您无法观看对象并知道通过观看所有内容而更改了哪些属性,因此我需要创建并将每个属性存储在键/值对中。

3 个答案:

答案 0 :(得分:1)

您可以递归地执行此操作,并在数组中生成“key”。

var obj = {
    query: {
        filter: {
            table: {
                productType: 'GM'
            }
        }
    }
};

var stringify = function (e) {
    var rs = [];
    for (var k in e) {
        if (e.hasOwnProperty(k)) {
            if (typeof e[k] == 'object') {
                var l = stringify(e[k]);
                for (var i = 0; i < l.length; i++) {
                    rs.push(k + '.' + l[i]);
                }
            } else {
                rs.push(k);
            }
        }
    }
    return rs;
}

console.log(stringify(obj));

输出:

["query.filter.table.productType"] 

fiddle

答案 1 :(得分:1)

Demo

在编辑之前

var $scope = {
    query: {
        filter: {
            table: {
                productType: 'GM'
            }
        }
    }
};

var k = JSON.stringify($scope)
//output "{"query":{"filter":{"table":{"productType":"GM"}}}}"

k.match(/\w+(?=\"\:)/g).join('.')
//output"query.filter.table.productType"

修改

Updated Demo

如果OP对子元素的位置没有问题

var $scope = {}
$scope.query = {
    filter: {
        column: {
            productName: 'Some Product',
            price: 29.95
        },
        table: {
            productType: 'GM',
            categoryId: 1,
        }
    }
};

k=JSON.stringify($scope)
{"query":{"filter":{"column":{"productName":"Some Product","price":29.95},"table":{"productType":"GM","categoryId":1}}}}

k.match(/\w+(?=\"\:)/g).join('.')
"query.filter.column.productName.price.table.productType.categoryId"

答案 2 :(得分:0)

通过递归地将属性迭代到数组中,您可以创建一个表示对象中数据的层次结构。从这里你可以根据需要解析结果。

var scope = {
    query: {
        filter: {
            column: {
                productName: 'Some Product',
                price: 29.95
            },
            table: {
                productType: 'GM',
                categoryId: 1
            }
        }
    }
};    
function buildProps(subject) {
    var result = [];
    for (var key in subject) {
        if (subject.hasOwnProperty(key)) {
            if (typeof subject[key] == "object") {
                result.push(key, buildProps(subject[key]));
            } else {
                result.push(key);
            }
        }
    }
    return result;
}    
function stringify(input) {
    var result = [];
    for (var i = 0; i < input.length; i++) {
        if (typeof input[i] == "string") {
            result.push(input[i]);
        } else {
            result = result.concat(stringify(input[i]));
        }
    }
    return result.join('.');
}

console.log(buildProps(scope));
console.log(stringify(buildProps(scope)));

解析生成的数组/子数组中的字符串,以您喜欢的任何方式格式化。

在我的简单示例中,我只是按顺序列出它们: query.filter.column.productName.price.table.productType.categoryId