JavaScript:void(null) 运算符

简介: JavaScript:void(null) 运算符

根据字典,void 是指空的空间。该术语是指在编程中使用时不返回任何内容或空值。

阅读本文后,你将了解 JavaScript:void(0)运算符。你还将了解 void 运算符,包括它是如何工作的,以及如何与 JavaScript: 链接 href 属性的伪 URL 一起使用。

[JavaScript 中的 Void 关键字]

术语 void 是指不返回任何内容的函数。这类似于显式返回 undefined 的 JavaScript 函数,如下面的代码所示。

function und() {
  return undefined
}
und()

或者隐含地,就像下面的代码一样。

function und() {
}
und()

无论上述例程中使用的表达式和语句如何,都不会返回任何结果。

你现在应该了解 void 一词的含义。另一方面,JavaScript:void(0) 更复杂。

[JavaScript 中的 JavaScript:void(0)]

如果 JavaScript:void(0) 被拆分,你将拥有 JavaScript:void(0)。让我们仔细看看每个组件。

[JavaScript:]

Pseudo URL 就是所谓的。当浏览器将此值作为锚标记 href 值接收时,它会解释冒号 : 后的 JavaScript 代码,而不是将值视为引用路径。

例如,使用下面的代码。

<a href="javascript:console.log('javascript');alert('javascript')">Link</a>

当你运行上面的代码时,你会看到一个链接按钮出现;单击此按钮时会显示一个弹出窗口。结果如下面的屏幕截图所示。

如上所示,浏览器不会将 href 视为引用路径。相反,它被视为以分号分隔的 javascript: 之后开始的 JavaScript 代码。

[void(0) 运算符]

void 运算符分析表达式并在计算时返回 undefined。例如,看下面的代码。

const result = void(1 + 1);
console.log(result);
// undefined should be returned

表达式 1 + 1 被计算,但结果是 undefined。这是另一个支持这一点的例子。

<body>
  <h1>Heading</h1>
  <script>
        void(document.body.style.backgroundColor = 'black',
             document.body.style.color = 'white'
        )
  </script>
</body>

上面代码的结果是:

下面给出了如何编写此代码的另一个示例。

console.log(void(0) === undefined)
// true

[结合 JavaScript:void(0)]

JavaScript 的 void 运算符计算一个表达式并返回一个 undefined 值。你可能会遇到使用 href="JavaScript:Void(0); 的 HTML 文档有时在 <a> 元素中。

将表达式插入网页时经常使用 JavaScript void,这可能会产生不必要的副作用。

使用 JavaScript:Void(0) 可以消除不需要的副作用,因为它将返回 undefined 原始值。超链接是 JavaScript:Void(0) 的典型用法。

你可能需要从链接中调用一些 JavaScript。当你单击链接时,你的浏览器通常会打开一个新页面或刷新现有页面(取决于指定的 URL)。

如果你已将 JavaScript 附加到该链接,你可能不希望这种情况发生。你可能想使用 JavaScript:void(0) 来防止页面重新加载。

[JavaScript:void(0) 的示例]

想象一下,你有一个链接,只有在单击两次(双击)后才能工作并显示一条消息。如果你只单击一次,则不会发生任何事情。

ondblclick 事件处理程序可以提供双击代码。你可以使用 JavaScript:void(0); 在锚链接中,以避免网站通过单击刷新。

为此,请使用下面的代码。

<a href="JavaScript:void(0);" ondblclick="alert('Good Job!')">Double Click!</a>

运行上面的代码时会出现一个 Double Click 按钮。单击此按钮时,会出现一个弹出窗口,上面写着 Good Job!你可以在下面的屏幕截图中看到结果。

它在 void 的帮助下通知浏览器不要返回任何内容或 undefinedjavascript:void(0) 引用的链接的另一个用例是链接可以在后台执行 JavaScript 代码,从而无需导航。

在这种情况下,表达式将作为参数提供给 void。单击页面时,它不会导航另一个页面或重新加载当前页面。

相关文章
|
4月前
|
JavaScript
js运算符
js运算符
34 5
|
5月前
|
JavaScript 前端开发
javascript:void(0) 含义
javascript:void(0) 含义
110 2
|
4月前
|
JavaScript 前端开发
JavaScript 运算符全知道
JavaScript 运算符全知道
74 0
|
5月前
|
机器学习/深度学习 JavaScript 前端开发
JavaScript typeof, null, 和 undefined
JavaScript typeof, null, 和 undefined
69 4
|
5月前
|
JavaScript 前端开发
JavaScript 运算符
JavaScript 运算符
28 3
|
6月前
|
JavaScript 前端开发
JavaScript 中的 typeof 运算符
【8月更文挑战第29天】
38 1
|
6月前
|
JavaScript 前端开发 安全
深入理解JavaScript中的比较运算符
深入理解JavaScript中的比较运算符
|
6月前
|
前端开发 JavaScript 程序员
聊聊前端 JavaScript 的扩展运算符 “...“ 的使用场景
聊聊前端 JavaScript 的扩展运算符 “...“ 的使用场景
|
6月前
|
JavaScript 前端开发
JS常见的运算符有哪些?
JS常见的运算符有哪些?
|
5月前
|
存储 JavaScript 前端开发

热门文章

最新文章

  • 1
    【02】仿站技术之python技术,看完学会再也不用去购买收费工具了-本次找了小影-感觉页面很好看-本次是爬取vue需要用到Puppeteer库用node.js扒一个app下载落地页-包括安卓android下载(简单)-ios苹果plist下载(稍微麻烦一丢丢)-优雅草卓伊凡
    23
  • 2
    Node.js 中实现多任务下载的并发控制策略
    32
  • 3
    【2025优雅草开源计划进行中01】-针对web前端开发初学者使用-优雅草科技官网-纯静态页面html+css+JavaScript可直接下载使用-开源-首页为优雅草吴银满工程师原创-优雅草卓伊凡发布
    25
  • 4
    【JavaScript】深入理解 let、var 和 const
    48
  • 5
    【04】Java+若依+vue.js技术栈实现钱包积分管理系统项目-若依框架二次开发准备工作-以及建立初步后端目录菜单列-优雅草卓伊凡商业项目实战
    44
  • 6
    【03】Java+若依+vue.js技术栈实现钱包积分管理系统项目-若依框架搭建-服务端-后台管理-整体搭建-优雅草卓伊凡商业项目实战
    52
  • 7
    【02】Java+若依+vue.js技术栈实现钱包积分管理系统项目-商业级电玩城积分系统商业项目实战-ui设计图figmaUI设计准备-figma汉化插件-mysql数据库设计-优雅草卓伊凡商业项目实战
    55
  • 8
    如何通过pm2以cluster模式多进程部署next.js(包括docker下的部署)
    71
  • 9
    【01】Java+若依+vue.js技术栈实现钱包积分管理系统项目-商业级电玩城积分系统商业项目实战-需求改为思维导图-设计数据库-确定基础架构和设计-优雅草卓伊凡商业项目实战
    55
  • 10
    JavaWeb JavaScript ③ JS的流程控制和函数
    62