JavaScript和TypeScript中的void的具体使用


Posted in Javascript onSeptember 12, 2019

如果你来自传统的强类型语言,可能会很熟悉 void 的概念:一种类型,告诉你函数和方法在调用时不返回任何内容。

void 作为运算符存在于 JavaScript 中,而作为基本类型存在于 TypeScript 中。在这两个世界中,void 的工作机制与大多数人习惯的有点不同。

JavaScript 中的 void

JavaScript 中的 void 是一个运算符,用于计算它旁边的表达式。无论评估哪个表达式,void总是返回undefined。

let i = void 2; // i === undefined

我们为什么需要这样的东西?首先在早期,人们能够覆盖 undefined 并给它一个实际值。 void 总是返回 real undefined。

其次,这是一种调用立即调用函数的好方法:

void function() {
 console.log('What')
}()

所有这些都没有污染全局命名空间:

void function aRecursion(i) {
 if(i > 0) {
  console.log(i--)
  aRecursion(i)
 }
}(3)

console.log(typeof aRecursion) // undefined

由于 void 总是返回 undefined,而 void 总是计算它旁边的表达式,你有一个非常简洁的方法从函数返回而不返回一个值,但仍然调用一个回调例如:

// returning something else than undefined would crash the app
function middleware(nextCallback) {
 if(conditionApplies()) {
  return void nextCallback();
 }
}

这让我想到了 void 最重要的通途:它是你程序的安全门。当你的函数总是应该返回 undefined 时,你可以确保始终如此。

button.onclick = () => void doSomething();

TypeScript 中的 void

TypeScript 中的 void 是 undefined 的子类型。 JavaScript 中的函数总是返回一些东西。要么它是一个值,要么是 undefined:

function iHaveNoReturnValue(i) {
 console.log(i)
} // returns undefined

因为没有返回值的函数总是返回 undefined,而 void 总是在 JavaScript 中返回 undefined,TypeScript 中的void 是一个正确的类型,告诉开发人员这个函数返回 undefined:

declare function iHaveNoReturnValue(i: number): void

void 作为类型也可以用于参数和所有其他声明。唯一可以传递的值是 undefined:

declare function iTakeNoParameters(x: void): void

iTakeNoParameters() // ?
iTakeNoParameters(undefined) // ?
iTakeNoParameters(void 2) // ?

所以 void 和 undefined 几乎是一样的。虽然有一点点不同,但这种差别很大:作为返回类型的 void 可以用不同的类型替换,以允许高级回调模式:

function doSomething(callback: () => void) {
 let c = callback() // at this position, callback always returns undefined
 //c is also of type undefiend
}

// this function returns a number
function aNumberCallback(): number {
 return 2;
}

// works ? type safety is ensured in doSometing
doSomething(aNumberCallback)

这是期望的行为,通常用于 JavaScript 程序。你可以在我的其他文章中阅读更多关于这种被称为 substitutability 的模式。

如果你想确保传递只返回 undefined 的函数(如“nothing”),请确保调整你的回调方法签名:

- function doSomething(callback: () => void) {
+ function doSomething(callback: () => undefined) { /* ... */ }

function aNumberCallback(): number { return 2; }

// ? types don't match
doSomething(aNumberCallback)

大概大部分时间你都能和 void 很好的相处。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript下利用arguments实现string.format函数
Aug 24 Javascript
jquery的Theme和Theme Switcher使用小结
Sep 08 Javascript
鼠标选择动态改变网页背景颜色的JS代码
Dec 10 Javascript
jsPDF导出pdf示例
May 02 Javascript
BootStrap初学者对弹出框和进度条的使用感觉
Jun 27 Javascript
微信小程序 loading(加载中提示框)实例
Oct 28 Javascript
微信小程序入门教程
Nov 18 Javascript
详解如何较好的使用js
Dec 16 Javascript
jQuery实现的上传图片本地预览效果简单示例
Mar 29 jQuery
JS中移除非数字最多保留一位小数
May 09 Javascript
js中时间格式化的几种方法
Jul 22 Javascript
vue-cli项目中使用echarts图表实例
Oct 22 Javascript
微信小程序页面调用自定义组件内的事件详解
Sep 12 #Javascript
基于JavaScript 实现拖放功能
Sep 12 #Javascript
Node.JS用纯JavaScript生成图片或滑块式验证码功能
Sep 12 #Javascript
layui 对table中的数据进行转义的实例
Sep 12 #Javascript
layui点击数据表格添加或删除一行的例子
Sep 12 #Javascript
小程序如何支持使用 async/await详解
Sep 12 #Javascript
layui清空,重置表单数据的实例
Sep 12 #Javascript
You might like
php禁止浏览器使用缓存页面的方法
2014/11/07 PHP
php实现的一段简单概率相关代码
2016/05/30 PHP
PHP开发之归档格式phar文件概念与用法详解【创建,使用,解包还原提取】
2017/11/17 PHP
javascript修改表格背景色实例代码分享
2013/12/10 Javascript
使用insertAfter()方法在现有元素后添加一个新元素
2014/05/28 Javascript
nodejs 实现模拟form表单上传文件
2014/07/14 NodeJs
jquery实现像栅栏一样左右滑出式二级菜单效果代码
2015/08/24 Javascript
Javascript基于AJAX回调函数传递参数实例分析
2015/12/15 Javascript
jQuery与Ajax以及序列化
2016/02/01 Javascript
基于jquery实现图片放大功能
2016/05/07 Javascript
jquery实现input框获取焦点的方法
2017/02/06 Javascript
vue中路由验证和相应拦截的使用详解
2017/12/13 Javascript
Vue 实现展开折叠效果的示例代码
2018/08/27 Javascript
深入Node TCP模块的理解
2019/03/13 Javascript
Elasticsearch实现复合查询高亮结果功能
2019/09/10 Javascript
JS+html5实现异步上传图片显示上传文件进度条功能示例
2019/11/09 Javascript
关于IDEA中的.VUE文件报错 Export declarations are not supported by current JavaScript version
2020/10/17 Javascript
[10:14]2018DOTA2国际邀请赛寻真——paiN Gaming不仅为自己而战
2018/08/14 DOTA
解密Python中的描述符(descriptor)
2015/06/03 Python
Python利用带权重随机数解决抽奖和游戏爆装备问题
2016/06/16 Python
Django日志模块logging的配置详解
2017/02/14 Python
pycharm 取消默认的右击运行unittest的方法
2018/11/29 Python
pytorch GAN生成对抗网络实例
2020/01/10 Python
Python3自定义json逐层解析器代码
2020/05/11 Python
python 密码学示例——凯撒密码的实现
2020/09/21 Python
python两种获取剪贴板内容的方法
2020/11/06 Python
德国机场停车位比较和预订网站:Ich-parke-billiger
2018/01/08 全球购物
长曲棍球装备:Lacrosse Monkey
2020/12/02 全球购物
一家外企的面试题目(C/C++面试题,C语言面试题)
2014/03/24 面试题
介绍JAVA 中的Collection FrameWork(及如何写自己的数据结构)
2014/10/31 面试题
体育教师求职信
2014/05/24 职场文书
简单租房协议书范本
2014/08/20 职场文书
党委书记个人对照检查材料
2014/09/15 职场文书
酒店辞职书范文
2015/02/26 职场文书
工厂仓管员岗位职责
2015/04/01 职场文书
Python-OpenCV教程之图像的位运算详解
2021/06/21 Python