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 相关文章推荐
借用Google的Javascript API Loader来加速你的网站
Jan 28 Javascript
Prototype 工具函数 学习
Jul 23 Javascript
js常用代码段收集
Oct 28 Javascript
jquery通过扩展select控件实现支持enter或focus选择的方法
Nov 19 Javascript
详解Javascript中的Object对象
Feb 28 Javascript
AngularJS 作用域详解及示例代码
Aug 17 Javascript
JS 实现Base64编码与解码实例详解
Nov 07 Javascript
微信小程序 合法域名校验出错详解及解决办法
Mar 09 Javascript
Angular 4.x 路由快速入门学习
May 03 Javascript
js实现放大镜特效
May 18 Javascript
JQuery 获取多个select标签option的text内容(实例)
Sep 07 jQuery
Vue 刷新当前路由的实现代码
Sep 26 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
ThinkPHP权限认证Auth实例详解
2014/07/22 PHP
PHP调用C#开发的dll类库方法
2014/07/28 PHP
PHP内核探索之解释器的执行过程
2015/12/22 PHP
PHP常用排序算法实例小结【基本排序,冒泡排序,快速排序,插入排序】
2017/02/07 PHP
Symfony2针对输入时间进行查询的方法分析
2017/06/28 PHP
PHP性能分析工具xhprof的安装使用与注意事项
2017/12/19 PHP
PHP面向对象程序设计之接口的继承定义与用法详解
2018/12/20 PHP
JavaScript回调(callback)函数概念自我理解及示例
2013/07/04 Javascript
将两个div左右并列显示并实现点击标题切换内容
2013/10/22 Javascript
浅析JavaScript原型继承的陷阱
2013/12/03 Javascript
生成二维码方法汇总
2014/12/26 Javascript
贴近用户体验的Jquery日期、时间选择插件
2015/08/19 Javascript
全面解析标签页的切换方式
2016/08/21 Javascript
关于验证码在IE中不刷新的快速解决方法
2016/09/23 Javascript
js, jQuery实现全选、反选功能
2017/03/08 Javascript
vue-resourse将json数据输出实例
2017/03/08 Javascript
深入理解JavaScript 参数按值传递
2017/05/24 Javascript
jquery append与appendTo方法比较
2017/05/24 jQuery
Vue导出json数据到Excel电子表格的示例
2017/12/04 Javascript
js隐式转换的知识实例讲解
2018/09/28 Javascript
使用RxJS更优雅地进行定时请求详析
2019/06/02 Javascript
Electron 调用命令行(cmd)
2019/09/23 Javascript
JavaScript 正则应用详解【模式、欲查、反向引用等】
2020/05/13 Javascript
从零开始在vue-cli4配置自适应vw布局的实现
2020/06/08 Javascript
python实现zabbix发送短信脚本
2018/09/17 Python
Opencv+Python 色彩通道拆分及合并的示例
2018/12/08 Python
python框架flask表单实现详解
2019/11/04 Python
哪些是python中web开发框架
2020/06/17 Python
Sneaker Studio匈牙利:购买运动鞋
2018/03/26 全球购物
大学生党校培训心得体会
2014/09/11 职场文书
文化苦旅读书笔记
2015/06/29 职场文书
职场干货:简历中的自我评价应该这样写!
2019/05/06 职场文书
职业规划从高考志愿专业选择开始
2019/08/08 职场文书
nginx实现发布静态资源的方法
2021/03/31 Servers
如何解决.cuda()加载用时很长的问题
2021/05/24 Python
Java中API的使用方法详情
2022/04/06 Java/Android