如何检查JavaScript中的对象属性是否未定义?
当前回答
简单地说,JavaScript中没有定义的任何东西都是未定义的,无论它是Object/Array中的属性还是只是一个简单的变量。。。
JavaScript具有类型of,因此很容易检测未定义的变量。
只需检查typeof whatever==“undefined”,就会返回布尔值。
这就是AngularJs v.1x中著名的函数isUndefined()的编写方式:
function isUndefined(value) {return typeof value === 'undefined';}
因此,当您看到函数接收到一个值时,如果定义了该值,它将返回false,否则对于未定义的值,返回true。
让我们看看传递值时会得到什么结果,包括如下所示的对象财产,这是我们拥有的变量列表:
var stackoverflow = {};
stackoverflow.javascipt = 'javascript';
var today;
var self = this;
var num = 8;
var list = [1, 2, 3, 4, 5];
var y = null;
我们如下所示进行检查,您可以在他们面前看到结果作为评论:
isUndefined(stackoverflow); //false
isUndefined(stackoverflow.javascipt); //false
isUndefined(today); //true
isUndefined(self); //false
isUndefined(num); //false
isUndefined(list); //false
isUndefined(y); //false
isUndefined(stackoverflow.java); //true
isUndefined(stackoverflow.php); //true
isUndefined(stackoverflow && stackoverflow.css); //true
正如您所看到的,我们可以在代码中使用类似的东西来检查任何情况,正如前面所提到的,您可以在您的代码中简单地使用typeof,但是如果您反复使用它,请创建一个像我共享的angular sample这样的函数,并将其作为以下DRY代码模式继续重用。
还有一件事,要检查真实应用程序中对象的属性,即使您不确定该对象是否存在,也要先检查对象是否存在。
如果您检查对象的属性而该对象不存在,将抛出错误并停止整个应用程序的运行。
isUndefined(x.css);
VM808:2 Uncaught ReferenceError: x is not defined(…)
如此简单,您可以像下面这样包装在if语句中:
if(typeof x !== 'undefined') {
//do something
}
也等于在Angular 1.x中定义的。。。
function isDefined(value) {return typeof value !== 'undefined';}
其他javascript框架(如下划线)也有类似的定义检查,但如果您尚未使用任何框架,我建议您使用typeof。
我还从MDN中添加了这一部分,它提供了关于typeof、undefined和void(0)的有用信息。
严格相等和未定义您可以使用undefined和严格相等和不相等运算符来确定变量是否具有一个值。在以下代码中,未定义变量xif语句的计算结果为true。
var x;
if (x === undefined) {
// these statements execute
}
else {
// these statements do not execute
}
注意:严格等式运算符而不是标准等式这里必须使用运算符,因为x==undefined还检查x为空,而严格相等不为空。null不等于未定义。有关详细信息,请参见比较运算符。
运算符类型和未定义或者,可以使用typeof:
var x;
if (typeof x === 'undefined') {
// these statements execute
}
使用typeof的一个原因是,如果尚未声明变量。
// x has not been declared before
if (typeof x === 'undefined') { // evaluates to true without errors
// these statements execute
}
if (x === undefined) { // throws a ReferenceError
}
然而,这种技术应该避免。JavaScript是静态作用域语言,因此知道是否声明了变量可以通过查看它是否在封闭上下文中声明来读取。这个唯一的例外是全局范围,但全局范围与全局对象,因此检查全局上下文可以通过检查全局对象(例如,使用in运算符)。
无效运算符和未定义void运算符是第三种选择。
var x;
if (x === void 0) {
// these statements execute
}
// y has not been declared before
if (y === void 0) {
// throws a ReferenceError (in contrast to `typeof`)
}
更多>此处
其他回答
也可以使用代理。它可以处理嵌套调用,但需要额外检查一次:
function resolveUnknownProps(obj, resolveKey) {
const handler = {
get(target, key) {
if (
target[key] !== null &&
typeof target[key] === 'object'
) {
return resolveUnknownProps(target[key], resolveKey);
} else if (!target[key]) {
return resolveUnknownProps({ [resolveKey]: true }, resolveKey);
}
return target[key];
},
};
return new Proxy(obj, handler);
}
const user = {}
console.log(resolveUnknownProps(user, 'isUndefined').personalInfo.name.something.else); // { isUndefined: true }
因此,您将像这样使用它:
const { isUndefined } = resolveUnknownProps(user, 'isUndefined').personalInfo.name.something.else;
if (!isUndefined) {
// Do something
}
解决方案不正确。在JavaScript中,
null == undefined
将返回true,因为它们都“强制”为布尔值,并且都为false。正确的方法是检查
if (something === undefined)
这是身份运算符。。。
您可以使用以下代码获取一个未定义路径的数组。
function getAllUndefined(object) {
function convertPath(arr, key) {
var path = "";
for (var i = 1; i < arr.length; i++) {
path += arr[i] + "->";
}
path += key;
return path;
}
var stack = [];
var saveUndefined= [];
function getUndefiend(obj, key) {
var t = typeof obj;
switch (t) {
case "object":
if (t === null) {
return false;
}
break;
case "string":
case "number":
case "boolean":
case "null":
return false;
default:
return true;
}
stack.push(key);
for (k in obj) {
if (obj.hasOwnProperty(k)) {
v = getUndefiend(obj[k], k);
if (v) {
saveUndefined.push(convertPath(stack, k));
}
}
}
stack.pop();
}
getUndefiend({
"": object
}, "");
return saveUndefined;
}
jsFiddle链接
与void 0进行比较,以获得简洁性。
if (foo !== void 0)
它不像(typeoffoo!=='undefined')那样冗长
如果定义了一个新变量,可以用一种优雅的方式将已定义的属性分配给它;如果未定义,则可以将默认值分配给它作为回退。
var a = obj.prop || defaultValue;
如果您有一个函数,它会接收一个额外的配置属性,那么这是合适的:
var yourFunction = function(config){
this.config = config || {};
this.yourConfigValue = config.yourConfigValue || 1;
console.log(this.yourConfigValue);
}
正在执行
yourFunction({yourConfigValue:2});
//=> 2
yourFunction();
//=> 1
yourFunction({otherProperty:5});
//=> 1