JavaScript中Undefined类型的使用

 更新时间:2026年02月24日 09:33:52   作者:橘朵  
JavaScript中,Undefined类型是一个特殊且基础的数据类型, 本文就来详细的介绍一下JavaScript中Undefined类型的使用,感兴趣的可以了解一下

在 JavaScript 中,Undefined类型是一个特殊且基础的数据类型,它表示一个变量最原始的自然状态——"未定义"。

Undefined类型只有一个值,就是 undefined。

当使用var或let声明了变量但没有初始化时,就相当于给变量赋予了undefined值。

let message;  
console.log(message == undefined); // true 
//等于
let message = undefined ; //默认情况下,任何未经初始化的变量都会取得undefined值,因此,不必显式的初始化为undefined。
console.log(message == undefined); // true 

可以通过 typeof操作符来确认一个变量是否为 Undefined类型。无论是声明还是未声明,typeof返回的都是字符串"undefined"。

// 变量被声明了,但未初始化,值为 undefined 
let message; 

console.log(message); // "undefined"  
console.log(age); // 没有声明变量,报错

console.log(typeof message); // "undefined" 
console.log(typeof age); // "undefined"

//访问对象不存在的属性
let obj = {};
console.log(obj.name); // undefined

//函数没有返回值
function foo() {} 
console.log(foo()); // undefined

//函数参数未传递
function bar(param) { 
console.log(param); 
} 
bar(); // undefined

//使用 void 操作符
console.log(void(0)); // undefined

使用严格相等进行检查:使用 ===来严格判断一个值是否为 undefined,避免使用 ==(因为 undefined == nulltrue)。

if (myVar === undefined) { /* 处理 undefined */ }

安全地访问对象属性(可选链操作符 ?.):当访问一个可能不存在的深层嵌套属性时,可选链操作符可以避免抛出错误。

let city = user?.address?.city; // 如果 address 不存在,则 city 为 undefined,而非报错。

提供默认值(空值合并运算符 ??):当变量为 undefinednull时,空值合并运算符可以提供一个默认值。它与 ||不同,不会过滤掉其他假值(如 0, "")。

let displayName = username ?? "匿名用户"; // 仅在 username 是 null 或 undefined 时使用默认值。

安全的类型检查:如果要检查一个可能未声明的变量(直接使用会报引用错误),使用 typeof是最安全的方式。

if (typeof someUndeclaredVar === 'undefined') {
  // 不会报错,即使 someUndeclaredVar 从未被声明。
}

到此这篇关于JavaScript中Undefined类型的使用的文章就介绍到这了,更多相关JavaScript Undefined类型内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • 解决layer.msg 不居中 ifram中的问题

    解决layer.msg 不居中 ifram中的问题

    今天小编就为大家分享一篇解决layer.msg 不居中 ifram中的问题,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2019-09-09
  • 微信小程序实现下拉刷新和轮播图效果

    微信小程序实现下拉刷新和轮播图效果

    这篇文章主要为大家详细介绍了微信小程序实现下拉刷新和轮播图效果,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-11-11
  • javascript history对象详解

    javascript history对象详解

    本文主要介绍了javascript history对象的相关知识。具有很好的参考价值,下面跟着小编一起来看下吧
    2017-02-02
  • Javascript的promise,async和await的区别详解

    Javascript的promise,async和await的区别详解

    这篇文章主要为大家详细介绍了Javascript的promise,async和await的区别,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下,希望能够给你带来帮助
    2022-03-03
  • js实现拖动模态框

    js实现拖动模态框

    这篇文章主要为大家详细介绍了js实现拖动模态框,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2022-07-07
  • Webpack中无法解析别名路径的原因及解决方案

    Webpack中无法解析别名路径的原因及解决方案

    在现代前端开发中,Webpack 是一个强大的模块打包工具,广泛应用于各种项目中,为了简化模块导入路径,开发者常常会在Webpack中配置别名路径(alias),然而,在实际使用过程中,配置别名路径可能会遇到“无法解析别名路径”的问题,所以本文给大家介绍了详细的解决方案
    2025-02-02
  • JavaScript 事件冒泡应用实例分析

    JavaScript 事件冒泡应用实例分析

    在一些传统的小型WEB应用开发过程中,JavaScript通常只是拿来做表单验证而以,所以你很少会遇到因为JavaScript事件冒泡而影响功能的实现情况,又或者事件冒泡对最终实现效果影响不大,可忽略。
    2010-01-01
  • JavaScript实现H5接金币功能(实例代码)

    JavaScript实现H5接金币功能(实例代码)

    这篇文章主要介绍了JavaScript实现H5接金币功能,本文分步骤通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2021-02-02
  • 比较精简的Javascript拖动效果函数代码

    比较精简的Javascript拖动效果函数代码

    比较精简的Javascript拖动效果函数代码...
    2007-07-07
  • 用innerhtml提高页面打开速度的方法

    用innerhtml提高页面打开速度的方法

    这篇文章介绍了用innerhtml提高页面打开速度的方法,有需要的朋友可以参考一下
    2013-08-08

最新评论