如何正确访问嵌套的JavaScript对象?

时间:2015-10-08 18:05:37

标签: javascript ruby-on-rails

我有ruby背景,并且正在将一些ruby代码转换为JavaScript。

我正在尝试理解ruby和JavaScript中哈希之间的区别。 我在ruby中有一个哈希,如下所示:

main_hash = {"query" => { "filtered" => { "query"=> { "bool" => query_hash}}}}

我认为在JavaScript中对此进行适当的转换基本上就像下面的JSON一样:

var main_hash = {"query" : { "filtered" : { "query" : { "bool" : query_hash}}}}

但是,我有一些我想在JavaScript中复制的ruby逻辑。那段代码是:

if(query_hash.empty?)
  main_hash["query"]["filtered"].delete("query")
else
  main_hash["query"]["filtered"]["query"]["bool"] = query_hash
end

如何在JavaScript中访问嵌套属性?

我在w3school上所做的阅读表明低于是正确的转换,但我想确保在此转换中我没有遗漏任何语言语义。例如,删除只删除包含在过滤中的查询对象,该查询对象包含在main_hash中包含的查询中吗?

 if(!isEmptyObject(query_hash)){
    delete main_hash.query.filtered.query;
 } else {
    main_hash.query.filtered.query.bool = query_hash;
 }

2 个答案:

答案 0 :(得分:3)

在JavaScript中,您的Ruby哈希等价物是一个对象。可以通过两种方式访问​​对象的属性。

您可以使用点符号访问它们:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet"/>

<div class="container">
    <div class="row">
        <div class="col-sm-4 col-sm-offset-1 col-xs-6">
            <div class="well">
                <ul class="my-list my-list-left">
                    <li data-value="1">Left Item 1</li>
                    <li data-value="2">Left Item 2</li>
                    <li data-value="3">Left Item 3</li>
                    <li data-value="4">Left Item 4</li>
                    <li data-value="5">Left Item 5</li>
                </ul>
            </div>
        </div>
        <div class="col-sm-4 col-sm-offset-1 col-xs-6">
            <div class="well">
                <ul class="my-list my-list-right">
                    <li data-value="1">Right Item 1</li>
                    <li data-value="2">Right Item 2</li>
                    <li data-value="3">Right Item 3</li>
                    <li data-value="4">Right Item 4</li>
                    <li data-value="5">Right Item 5</li>
                </ul>
            </div>
        </div>
    </div>
</div>

或使用类似访问的数组:

main_hash.query.filtered.query

两者都有效。是的,删除只会删除最里面的查询属性。

答案 1 :(得分:1)

如果您使用的是JQuery,那么您的代码就可以了,但如果您没有,则需要创建此isEmptyObject函数。

您可以使用类似function

的内容
showAction

示例:

function isEmpty(obj) {

    // Speed up calls to hasOwnProperty
    var hasOwnProperty = Object.prototype.hasOwnProperty;

    // null and undefined are "empty"
    if (obj == null) return true;

    // Assume if it has a length property with a non-zero value
    // that that property is correct.
    if (obj.length > 0)    return false;
    if (obj.length === 0)  return true;

    // Otherwise, does it have any properties of its own?
    // Note that this doesn't handle
    // toString and valueOf enumeration bugs in IE < 9
    for (var key in obj) {
        if (hasOwnProperty.call(obj, key)) return false;
    }

    return true;
}