基於變量訪問Json中的第二級孩子

Question

我目前正在使用Angular 2應用程序中的配置服務，我當前的擔心是關於在我的代碼中使用eval來檢索配置中的值。

這裏是我的配置文件的樣本：

{ 
    "application": { 
    "environment": "dev", 
    "displayMenu": false 
    }, 

    "error": { 
    "title": "Title Error", 
    "message": "Error message" 
    } 
} 

我檢索這個JSON用一個簡單的HTTP請求，但現在我想用這樣的定義我的GET方法來訪問一個元素：

get(key: any) { 
    return (eval("this._config." + key)); 
} 

正如你所看到的，我的代碼中有一個eval，我想避免。我不得不使用eval來讓開發人員執行.get（'application.environment'），實際上我沒有發現任何其他人很容易的可能性。

我能看到的唯一方法就是將鍵分割爲「。」。並在我的JSON中檢索正確的元素，就像它是一個簡單的數組。但有了這個解決方案，我只能堅持一個深度。

Answer 1

您可以使用您希望查看的對象鍵的數組，然後減少返回該對象的鍵的數組。如果你希望有一個字符串作爲對象訪問器，你可以使用string.split('.')來創建你可以減少的數組。

const data = { 
 
    "application": { 
 
    "environment": "dev", 
 
    "displayMenu": false 
 
    }, 
 
    "error": { 
 
    "title": "Title Error", 
 
    "message": "Error message", 
 
    "deeper": { 
 
     "evenDeeper": "You can get to any level" 
 
    } 
 
    } 
 
} 
 

 
const path = (keys, obj) => { 
 
    return keys.reduce((obj, key) => { 
 
    return typeof obj !== 'undefined' 
 
     ? obj[key] 
 
     : void 0 
 
    }, obj) 
 
} 
 

 
console.log(
 
    path(['application', 'environment'], data) 
 
) 
 
console.log(
 
    path('error.message'.split('.'), data) // move the split inside the path function 
 
) 
 
console.log(
 
    path(['error', 'deeper', 'evenDeeper'], data) 
 
) 
 
console.log(
 
    path(['error', 'fail', 'damn'], data) // fail safe 
 
)

<script src="http://codepen.io/synthet1c/pen/WrQapG.js"></script>