不使用eval，按字符串名称访问命名空间的javascript对象
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了不使用eval，按字符串名称访问命名空间的javascript对象相关的知识，希望对你有一定的参考价值。
我遇到了需要从服务器访问javascript对象的情况。服务器返回函数或对象的字符串名称，并且基于其他元数据，我将以不同方式评估对象。
最初我正在评估（eval([string])），一切都很好。最近我更新了函数，不使用eval以确保安全性，我遇到了命名空间对象/函数的问题。
具体来说，我试图用eval([name])替换window[name]，通过全局对象vs eval的方括号语法访问对象。
但是我遇到了命名空间对象的问题，例如：
var strObjName = 'namespace.serviceArea.function';
// if I do
var obj = eval(strObjName); // works
// but if I do
var obj = window[strObjName]; // doesn't work
任何人都可以提出一个很好的解决方案，以避免使用eval与命名空间字符串？
您可以拆分.并依次解决每个属性。只要字符串中的所有属性名都不包含.字符，这样就可以了：
var strObjName = 'namespace.serviceArea.function';
var parts = strObjName.split(".");
for (var i = 0, len = parts.length, obj = window; i < len; ++i) {
obj = obj[parts[i]];
}
alert(obj);
只是想我会分享这个，因为我前几天做了这个。我甚至没有意识到减少可用于JS！
function getByNameSpace(namespace, obj) {
return namespace.split('.').reduce(function(a,b) {
if(typeof a == 'object') return a[b];
else return obj[a][b];
});
}
希望有人觉得这很有用..
我想出了这个：
function reval(str){
var str=str.split("."),obj=window;
for(var z=0;z<str.length;z++){
obj=obj[str[z]];
}
return obj;
}
eval("window.this.that");
reval("this.that"); //would return the object
reval("this.that")(); //Would execute
我使用递归编写了一个不同的解决方案。我用它来命名输入元素的name属性。举个例子，如下：
<input type="number" name="testGroup.person.age" />
我们假设我们将该输入的值设置为“25”。我们的代码中还有一个对象：
var data = {
testGroup: {
person: {
name: null,
age: null,
salary: null
}
}
};
因此，此处的目标是自动将输入元素中的值放入该数据结构中的正确位置。
我写了这个小函数来创建一个嵌套对象，它基于你传递给它的任何命名空间数组：
var buildObject = function ( obj, namespaceArray, pos ) {
var output = {};
output[namespaceArray[pos]] = obj;
if ( pos > 0 ) {
output = buildObject(output, namespaceArray, pos-1);
}
return output;
};
它是如何工作的？它从namespaceArray数组的末尾开始，并创建一个具有一个属性的对象，其名称是namespaceArray中最后一个槽中的任何值，其值为obj。然后它会递归，将该对象包装在其他对象中，直到它用完namespaceArray中的名称。 pos是namespaceArray阵列的长度。你可以在第一个函数调用中解决它，比如if ( typeof(pos) === "undefined" ) pos = namespaceArray.length - 1，但是每次函数递归时你都会有一个额外的语句来评估。
首先，我们将name的input属性拆分为命名空间分隔符周围的数组，并获取输入的值：
var namespaceArray = inputElement.name.split("."),
obj = inputElement.value;
// Usually you'll want to do some undefined checks and whatnot as well
然后我们只调用我们的函数并将结果赋给一些变量：
var myObj = buildObject(obj, namespaceArray, namespaceArray.length - 1);
myObj现在看起来像这样：
{
testGroup: {
person: {
age: 25
}
}
}
此时我使用jQuery的extend函数将该结构合并回原始数据对象：
data = $.extend(true, data, myObj);
但是，在没有框架的JavaScript中合并两个对象并不是很困难，而且有很多existing code可以很好地完成工作。
我确信有更有效的方法来完成这项工作，但这种方法很好地满足了我的需求。
我知道这个问题得到了回答，但是我最近遇到了这个问题，但是写了这个问题。我想出了自己的静态类来处理基于字符串路径的读写。默认路径分隔符是.，但您可以将其修改为任何内容，例如/。代码也被评论，你想知道它是如何工作的。
(function(){
var o = {}, c = window.Configure = {}, seperator = '.';
c.write = function(p, d)
{
// Split the path to an array and assaign the object
// to a local variable
var ps = p.split(seperator), co = o;
// Iterate over the paths, skipping the last one
for(var i = 0; i < ps.length - 1; i++)
{
// Grab the next path's value, creating an empty
// object if it does not exist
co = (co[ps[i]])? co[ps[i]] : co[ps[i]] = {};
}
// Assign the value to the object's last path
co[ps[ps.length - 1]] = d;
}
c.read = function(p)
{
var ps = p.split(seperator), co = o;
for(var i = 0; i < ps.length; i++)
{
co = (co[ps[i]])? co[ps[i]] : co[ps[i]] = {};
}
return co;
}
})();
我在pastebin上的样本：http://pastebin.com/13xUnuyV
我喜欢你的代码，我使用php做了很多类似的东西。但这里虽然很难，但是......所以我使用的答案是@LordZardeck（https://stackoverflow.com/a/9338381/1181479）和@Alnitak（https://stackoverflow.com/a/6491621/1181479）。
在这里我拥有，只需使用它：
var someObject = {
'part1' : {
'name': 'Part 1',
'size': '20',
'qty' : '50'
},
'part2' : {
'name': 'Part 2',
'size': '15',
'qty' : '60'
},
'part3' : [
{
'name': 'Part 3A РУКУ!!!',
'size': '10',
'qty' : '20'
}, {
'name': 'Part 3B',
'size': '5',
'qty' : '20'
}, {
'name': 'Part 3C',
'size': '7.5',
'qty' : '20'
}
]
};
//var o = {}, c = window.Configure = {}, seperator = '.';
var c = function(){
this.o = {};
this.seperator = ".";
this.set = function(obj){
this.o = obj;
}
this.write = function(p, d) {
p = p.replace(/[(w+)]/g, '.$1'); // convert indexes to properties
p = p.replace(/^./, ''); // strip leading dot
// Split the path to an array and assaign the object
// to a local variable
var ps = p.split(this.seperator), co = this.o;
// Iterate over the paths, skipping the last one
for(var i = 0; i < ps.length - 1; i++)
{
// Grab the next path's value, creating an empty
// object if it does not exist
co = (co[ps[i]])? co[ps[i]] : co[ps[i]] = {};
}
// Assign the value to the object's last path
co[ps[ps.length - 1]] = d;
}
this.read = function(p) {
p = p.replace(/[(w+)]/g, '.$1'); // convert indexes to properties
p = p.replace(/^./, ''); // strip leading dot
var ps = p.split(this.seperator), co = this.o;
/*
for(var i = 0; i < ps.length; i++)
{
co = (co[ps[i]])? co[ps[i]] : co[ps[i]] = {};
}
*/
while (ps.length) {
var n = ps.shift();
if (n in co) {
co = co[n];
} else {
return;
}
}
return co;
}
};
var n = new c();
n.set(someObject);
console.log('whas');
console.log('n.read part.name', n.read('part1.name'));
n.write('part3[0].name', "custom var");
console.log('part1.name now changed');
n.write('part1.name', "tmp");
console.log('n.read part.name', n.read('part1.name'));
console.log('----');
console.log('before', someObject);
console.log('someObject.part1.name', someObject.part1.name);
console.log('someObject.part3[0].name', someObject.part3[0].name);
可以使用诸如的函数编程技术来完成此操作
(function (s) {return s.split('.').reduce(function(p,n) { p[n] = p[n] || {}; return p[n];},window);})("some.cool.namespace");
这可以分配给全局功能以便重复使用
window.ns = (function (s) {return s.split('.').reduce(function(p,n) { p[n] = p[n] || {}; return p[n];},window);})
然后我们可以做以下事情
ns("some.cool").namespace = 5;
if (5 != ns("some.cool.namespace")) { throw "This error can never happen" }
以下假设strObjName的各个部分由.分隔，并从窗口开始循环，直到它达到你想要的函数：
以上是关于不使用eval，按字符串名称访问命名空间的javascript对象的主要内容，如果未能解决你的问题，请参考以下文章
Python标准库 内置函数eval expression globals None locals None