深入理解 JavaScript 中的 void`运算符和 yield*表达式

深入理解 JavaScript 中的 void 运算符和 yield* 表达式

在 JavaScript 中,void 运算符和 yield* 表达式是两个功能独特但常被忽视的运算符。本文将详细介绍它们的用法和应用场景,帮助您更好地理解和运用这两个运算符。

目录

  1. void 运算符概述
  2. void 运算符的用法
  3. void 运算符的应用场景
  4. yield* 表达式概述
  5. yield* 表达式的用法
  6. yield* 表达式的应用场景

void 运算符概述

void 是一个一元运算符,用于计算一个表达式但不返回结果,总是返回 undefined。其语法为:

void expression;
void (expression);

总是返回undefined

// 总是返回undefined
const res = void(0)
console.log(res) // undefined

需要注意考虑void运算符的优先级,以下加括号的表达式的例子可以帮助你清楚地理解 void 操作符的优先级:

void 2 === "2"; // (void 2) === '2',返回 false
void (2 === "2"); // void (2 === '2'),返回 undefined

void 运算符的用法

1. 阻止默认行为

在 HTML 中,可以使用 void 运算符防止链接跳转,当用户点击一个以 javascript: 开头的 URI 时,它会执行 URI 中的代码,然后用返回的值替换页面内容,除非返回的值是 undefined。void 运算符可用于返回 undefined。例如:

<a href="javascript:void(0)">Click me</a>

当用户点击链接时,由于 void(0) 返回 undefined,页面不会发生跳转。

2. 执行表达式但不返回值(箭头函数中的使用)

可以用 void 运算符执行一个表达式,但忽略其返回值,尤其当函数返回值不会被使用的到时候,使用void来保证API改变的时候不会改变箭头函数的行为:

button.onClick = () => void someFunction();

3. 立即执行函数表达式(IIFE)

在某些情况下,可以使用 void 运算符包装一个函数,使其立即执行:

void function() {console.log("This is an IIFE");
}();

void 运算符的应用场景

  • 防止页面跳转:在 <a> 标签的 href 属性中使用,避免链接导致页面刷新或跳转。
  • 书签脚本(Bookmarklets):在书签中执行 JavaScript 代码,使用 void 确保不会导航到其他页面。
  • 消除返回值:执行一个表达式,但不关心其返回值。

yield* 表达式概述

yield* 是 ES6 引入的生成器(Generator)表达式,用于委托另一个可迭代对象或生成器函数。其语法为:

yield* iterable;

yield* 表达式的用法

1. 委托可迭代对象

function* generator() {yield* [1, 2, 3];
}for (let value of generator()) {console.log(value); // 输出 1, 2, 3
}

2. 委托另一个生成器

function* innerGenerator() {yield 'a';yield 'b';
}function* outerGenerator() {yield 'start';yield* innerGenerator();yield 'end';
}for (let value of outerGenerator()) {console.log(value); // 输出 'start', 'a', 'b', 'end'
}

3. 处理双向通信

yield* 不仅委托迭代,也委托双向通信(nextthrowreturn 方法):

function* delegatingGenerator() {console.log('Delegating to another generator');const result = yield* anotherGenerator();console.log('Delegation complete');return result;
}function* anotherGenerator() {const value = yield 'yielded from anotherGenerator';return value;
}const gen = delegatingGenerator();
console.log(gen.next());        // { value: 'yielded from anotherGenerator', done: false }
console.log(gen.next('result')); // { value: undefined, done: true }

yield* 表达式的应用场景

  • 组合生成器:将多个生成器组合在一起,形成复杂的数据生成逻辑。
  • 处理嵌套迭代:简化对嵌套可迭代对象的遍历。
  • 委托双向通信:在生成器之间传递 nextthrowreturn

总结

void 运算符和 yield* 表达式在 JavaScript 中提供了独特的功能。void 运算符用于执行表达式但忽略返回值,常用于防止默认行为或消除返回值。yield* 表达式用于在生成器函数中委托迭代,方便地组合和处理复杂的迭代逻辑。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/881143.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Django学习笔记四:urls配置详解

Django是一个高级的Python Web框架&#xff0c;它鼓励快速开发和干净、实用的设计。URL配置是Django框架中非常重要的一部分&#xff0c;它定义了URL模式与视图函数之间的映射关系。以下是Django URL配置的详解&#xff1a; URL配置文件 通常&#xff0c;URL配置位于Django项…

Spring Boot 配置全流程 总结

1. 简介 Springboot可以简化SSM的配置,提高开发效率。 2. 代码 在pom.xml中添加: <parent><!-- 包含SSM常用依赖项 --><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-parent</artifactId><versi…

【达梦数据库】尽可能 disql 的使用效果与异构数据库一致

文章目录 前言disql 效果优化参数设置参数说明 mysql参数设置参数说明 db2参数设置参数说明 待补充 前言 让达梦的disql 使用起来更跟手&#xff0c;与其他优质数据库的命令行工具通过配置参数的方式尽可能一致&#xff0c;提高使用体验&#xff0c;长期整理中~~~ 测试版本&…

使用WPF实现一个快速切换JDK版本的客户端工具

发现网上一键切换JDK环境的方法都是在mac或Linux下的&#xff0c;本人主力电脑是Windows&#xff0c;于是看了一下WPF的文档&#xff0c;自己开发了一个客户端。 直接上代码吧&#xff1a; using JavaSwitch.Properties; using Newtonsoft.Json; using System; using System.…

【C++11】新特性

前言&#xff1a; C11 是C编程语言的一个重要版本&#xff0c;于2011年发布。它带来了数量可观的变化&#xff0c;包含约 140 个新特性&#xff0c;以及对 C03 标准中约600个缺陷的修正&#xff0c;更像是从 C98/03 中孕育出的新语言 列表初始化 C11 中的列表初始化&#xff0…

做副业赚钱时如何保持良好的心态?

在当今这个多元化的时代&#xff0c;越来越多的人选择开展副业来增加收入、拓展技能和实现自我价值。然而&#xff0c;副业之路并非总是一帆风顺&#xff0c;其间可能会遇到各种挑战和困难。在这个过程中&#xff0c;保持良好的心态至关重要&#xff0c;它不仅能帮助我们坚持下…

P05_盛最多水的容器

一、题目 给定一个长度为 n 的整数数组 height 。有 n 条垂线&#xff0c; 第 i 条线的两个端点是 (i, 0) 和 (i, height[i]) 。 找出其中的两条线&#xff0c;使得它们与 x 轴共同构成的容器可以容纳最多的水。 返回容器可以储存的最大水量。 说明&#xff1a;你不能倾斜…

爬虫案例——爬取情话网数据

需求&#xff1a; 1.爬取情话网站中表白里面的所有句子&#xff08;表白词_表白的话_表白句子情话大全_情话网&#xff09; 2.利用XPath来进行解析 3.使用面向对象形发请求——创建一个类 4.将爬取下来的数据保存在数据库中 写出对应解析语法 //div[class"box labelbo…

vite学习教程03、vite+vue2打包配置

文章目录 前言一、修改vite.config.js二、配置文件资源/路径提示三、测试打包参考文章资料获取 前言 博主介绍&#xff1a;✌目前全网粉丝3W&#xff0c;csdn博客专家、Java领域优质创作者&#xff0c;博客之星、阿里云平台优质作者、专注于Java后端技术领域。 涵盖技术内容&…

云手机可以解决TikTok运营的哪些问题?

随着社交媒体的飞速发展&#xff0c;TikTok迅速崛起&#xff0c;成为个人和企业进行品牌宣传和内容创作的首选平台。然而&#xff0c;在运营TikTok账号的过程中&#xff0c;不少用户会遇到各种问题。本文将详细阐述云手机如何帮助解决这些问题。 1. 多账号管理的高效便捷 通过云…

外包功能测试干了4年,技术退步太明显了。。。。。​

先说一下自己的情况&#xff0c;本科生&#xff0c;18年通过校招进入武汉某软件公司&#xff0c;干了差不多4年的功能测试&#xff0c;今年中秋&#xff0c;感觉自己不能够在这样下去了&#xff0c;长时间呆在一个舒适的环境会让一个人堕落!而我已经在一个企业干了四年的功能测…

精准选择大模型:消费品行业的营销与体验创新之路

在消费品行业&#xff0c;大模型技术的引入正逐渐从一个新兴趋势转变为行业标配。随着人工智能的快速发展&#xff0c;特别是OpenAI等领军企业推出的创新技术&#xff0c;如Sora&#xff0c;大模型在市场营销、消费者行为分析、个性化推荐等方面展现出巨大潜力。然而&#xff0…

详解Java中的BIO、NIO、AIO

1、 详解Java中的BIO、AIO、NIO 1.1、引言 IO流是Java中比较难理解的一个知识点&#xff0c;但是IO流在实际的开发场景中经常会使用到&#xff0c;比如Dubbo底层就是NIO进行通讯。本文将介绍Java发展过程中出现的三种IO&#xff1a;BIO、NIO以及AIO&#xff0c;重点介绍NIO。…

动态桌面时钟 让时间在桌面舞动 发现生活中的美好瞬间!

在快节奏的现代生活中&#xff0c;时间是最宝贵的资源之一。无论是在工作还是生活中&#xff0c;我们都需要时刻关注时间&#xff0c;在桌面显示一个时钟&#xff0c;可以让你更方便的掌握时间。今天小编给大家推荐一个软件《芝麻时钟》&#xff08;下载地址&#xff1a;https:…

深入浅出(五)nlohmann/json库

nlohmann/json安装与应用 1. nlohmann/json简介1.1 nlohmann/json下载 2. C示例2.1 应用示例2.2 封装应用2.2.1 NLOHMANN_DEFINE_TYPE_INTRUSIVE 1. nlohmann/json简介 优点&#xff1a; 易用性&#xff1a;该库的接口设计非常直观&#xff0c;与 C STL 风格非常接近。单头文…

Linux高级编程_29_信号

文章目录 进程间通讯 - 信号信号完整的信号周期信号的编号信号的产生发送信号1 kill 函数(他杀)作用&#xff1a;语法&#xff1a;示例&#xff1a; 2 raise函数(自杀)作用&#xff1a;示例&#xff1a; 3 abort函数(自杀)作用&#xff1a;语法&#xff1a;示例&#xff1a; 4 …

汇编DEBUG程序调用

工具 系统&#xff1a;Windows 11 应用&#xff1a;DOSBox 0.74-3 下载安装教程&#xff1a;本人写的《DOSBox下载安装&#xff08;Windows系统 DOSBox 0.74-3&#xff09;》 https://blog.csdn.net/just_do_it_sq/article/details/142715182?spm1001.2014.3001.5501 相关文…

ARM 架构、cpu

一、ARM的架构 ARM是一种基于精简指令集&#xff08;RISC&#xff09;的处理器架构. 1、ARM芯片特点 ARM芯片的主要特点有以下几点&#xff1a; 精简指令集&#xff1a;ARM芯片使用精简指令集&#xff0c;即每条指令只完成一项简单的操作&#xff0c;从而提高指令的执行效率…

沂机管理系统/data/Ajax.aspx接口存在SQL注入漏洞

漏洞描述 沂机管理系统/data/Ajax.aspx接口存在SQL注入漏洞&#xff0c;攻击者可以获取服务器权限 漏洞复现 body"后台管理系统演示版" POC GET /data/Ajax.aspx?methodlog_list&page1&limit20&fkey1&fdate12024-10-0100%3A00%3A00&fdate2…

文章资讯职场话题网站源码整站资源自带2000+数据

介绍&#xff1a; 数据有点多&#xff0c;数据资源包比较大&#xff0c;压缩后还有250m左右。值钱的是数据&#xff0c;网站上传后直接可用&#xff0c;爽飞了 环境&#xff1a;NGINX1.18 mysql5.6 php7.2 代码下载