如何遍历 JavaScript 对象并检查 null 值?
-
12-12-2019 - |
题
假设我有一个 JavaScript 对象,如下所示:
var obj = {};
obj.computers = {};
obj.computers.favorite = "Commodore 64";
obj.computers.popular = "Apple";
现在,我可以轻松检查 null,例如:
if(obj != 'undefined' && obj != null) {
if(obj.computers != 'undefined' && obj.computers != null)) {
.....
正如你所看到的,如果我需要看看 obj.computers.favorite
已经设置了,我必须在那里真正嵌套一些条件逻辑。我们的一些对象有 3、4、5 层深。
这就是我希望能够做到的:
var fav = obj.computers.favorite || 'Unknown';
但我意识到我需要用某种方法来包装它。就像是:
var fav = getValueOrDefault(obj.computers.favorite, 'Unknown');
建议表示赞赏。
谢谢
编辑
我对“未定义”的检查实际上并不是我所使用的。当我问这个问题的时候,它就从我的脑海里冒出来了。哈哈
但我想知道,我可以只包装一个 try/catch 并在异常时抛出默认值吗?
function(obj, default) {
try {
if(obj != null) {
return obj;
} else {
return default;
}
} catch(ex) {
return default;
}
}
另外,感谢 Shusi 指出了多余的变量。
解决方案
你可以用 帮手 功能。如果我正确理解你的问题,你的对象 可能有 任意深度对象,并且您希望访问这些任意嵌套属性而不会使代码混乱。我建了一个 Nested
功能可以让你 get()
任意属性(如果已设置)或默认值(如果未设置)。
var Nested = function() {};
// prop is a dot-separated path like "foo.bar.baz"
Nested.prototype.get = function(prop, _default) {
var current = this;
$.each(prop.split("."), function(i, e) {
current = current[e] || undefined;
if (current == undefined)
return false;
});
return current || _default;
}
然后你可以编写这样的代码
var fav = obj.get("computers.favourite", "Linux");
// this emulates
var fav = obj.computers.favourite || "Linux"; // throws error
正如您所看到的,输入的内容并不多。当然,感觉不像 常规 JavaScript... 这是小提琴.
其他提示
你真的可以写:
(obj && obj.computers && obj.computers.favorite) || 'Unknown'
我写这篇文章是为了帮助您解决您的问题之一:”我需要查看 obj.computers.favorite 是否已设置".
Object.prototype.isset = function (/* string */ full_path)
{
var props = full_path.split('.');
var self = this; /* note that self is usually the window object */
for (var ii = 0; ii < props.length; ++ii)
{
var prop = props[ii];
var hasMoreComing = ii < props.length - 1 ? true : false;
if (self[prop] !== null && typeof self[prop] === 'object' && hasMoreComing)
{
self = self[prop];
continue; // Move up one level.
}
else if (hasMoreComing)
return false; // ..because user queries a subproperty of a value type
return self.hasOwnProperty(prop);
}
};
测试代码:
var test = {};
test.kuk = {};
console.log( test.isset('kuk') ); // Prints true.
test.kuk.fitta = {};
console.log( test.isset('kuk.fitta') ); // Prints true.
test.kuk.fitta = null;
console.log( test.isset('kuk.fitta') ); // Prints true.
test.kuk.fitta = undefined;
console.log( test.isset('kuk.fitta') ); // Prints true
delete test.kuk.fitta;
console.log( test.isset('kuk.fitta') ); // Prints false
test.kuk.fitta = 123;
console.log( test.isset('kuk.fitta.doesnt.exist') ); // Prints false
不幸的是,没有一种超级简单的方法可以解决这个问题,但您不需要同时检查 null 和 undefined。因为 null 和 undefined 都是 false,所以你可以这样做:
if (obj && obj.computers) {
var fav = obj.computers.favorite || 'unknown';
}
它实际上并没有回避你的抱怨,但它没有你想象的那么痛苦。
以下函数将以字符串作为参数并返回对象(如果存在)
function getValueOrDefault(str , obj, deflt){
var a = str.split("."); o = obj;
for(var i =0; i < a.length; i++){
o = obj[a[i]];
if(!o){
return deflt;
}
}
return o;
}
var obj = {};
obj.computers = {};
obj.computers.favorite = "Commodore 64";
obj.computers.popular = "Apple";
getValueOrDefault('computers.favorite', obj, 'Unknown');
笔记:在为对象分配属性时不得使用 var,例如。 var obj.computers.favorite
是语法错误。
你也可以这样做 JavaScript ES5 reduce
功能 :
function get(root, member) {
return member.split('.').reduce((acc, value) => {
return (acc && typeof acc[value] !== 'undefined') ? acc[value] : undefined
}, root);
}
它用成员字符串创建一个数组,然后随着成员的减少,累加器逐渐在对象内遍历。
即使使用数组,您也可以像这样使用它:
let obj = {
computers : {
favorite : "Commodore 64",
popular : "Apple",
list: [
{
sn : "TDGE52343FD76",
price: "9867.99",
options: {
fanless: true
}
}
]
}
}
get(obj, 'computers.popular');
// => "Apple"
get(obj, 'computers.list.0.sn');
// => "TDGE52343FD76"
get(obj, 'computers.list.0.options.fanless');
// => true
get(obj, 'computers.list.0.options.runsWithoutEletricity');
// => undefined
get(obj, 'computers.list.0.options.runsWithoutEletricity') || "too bad..." ;
// => "too bad..."
有一个代码笔 安全地遍历js对象