前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >【译】JavaScript和TypeScript中的Boolean

【译】JavaScript和TypeScript中的Boolean

作者头像
腾讯IVWEB团队
发布2020-06-28 10:41:17
2.3K0
发布2020-06-28 10:41:17
举报

原文地址:Boolean in JavaScript and TypeScript 作者:ddprrt

在JavaScript中,布尔值是一种有趣的原始数据类型。在TypeScript中,其能校验通过的总共有四个值。

JavaScript中的Boolean

布尔值可以取 true 或 false,其它类型的值也可能转换成 true 或 false,例如 undefined 和 null。

代码语言:javascript
复制
let b = true
if(b) console.log('logged')

b = false
if(b) console.log('not logged')

b = undefined
if(b) console.log('not logged')

b = null
if(b) console.log('not logged')

除了 undefined、null 和 false,还有空字符串("")、-0、0以及NaN可以转换成 false。

若想获取任意类型值的布尔值,可以通过使用 Boolean 函数:

代码语言:javascript
复制
Boolean(false) // false
Boolean(true) // true
Boolean("false") // true ❗️
Boolean("Hey folks") // true
Boolean({}) // true
Boolean([]) // true
Boolean(123.4) // true
Boolean(Symbol()) // true
Boolean(function() {}) // true
Boolean(undefined) // false
Boolean(null) // false
Boolean(NaN) // false
Boolean(0) // false
Boolean("") // false

按照经验来说,所有的空值都能转换为 false,而空对象和空数组(本质就是个对象)是有值的,因为它们是其它值的容器。

通过 Boolean 函数来过滤集合中的空值是一个很好的方式。

代码语言:javascript
复制
const collection = [
  { name: 'Stefan Baumgartner', age: 37 },
  undefined,
  { name: 'D.', age: 36 },
  false
  { name: 'C.', age: 2},
  false
]

collection.filter(Boolean) // handy!

配合使用 Number 函数——一个可以将所有类型值转换为对应数值或 NaN,来快速获取集合中的数值是非常棒的方法。

代码语言:javascript
复制
const x = ["1.23", 2137123, "wut", false, "lol", undefined, null]
  .map(Number)
  .filter(Boolean) // [1.23, 2137123] ?

Boolean 同样作为构造函数,其具有和 Boolean 函数相同的转换规则。然而,通过 new Boolean(...) 创建包装对象后,拿这个对象去进行等值的相等匹配(即==)是能返回 true,而进行严格相等(即===)匹配就会返回 false 了。

代码语言:javascript
复制
const value = Boolean("Stefan") // true
const reference = new Boolean("Stefan") // [Boolean: true]

value == reference // true
value === reference // false

可以通过 .valueOf() 来获取其值,然后进行严格相等匹配。

代码语言:javascript
复制
value === reference.valueOf() // true

我有一个 REPL 可供参考。Boolean 作为函数还是大有作用的,而作为构造函数其使用价值就很有限了。

TavaScript中的Boolean

在 TypeScript 中,boolean 才是原始类型,请确保使用小写版本,而不是引用 Boolean 对象。

代码语言:javascript
复制
const boolLiteral: boolean = false // ?
const boolObject: Boolean = false // ?

虽然,通过引用 Boolean 对象作为类型也可以正常运行,但这是错误的使用方式,我们几乎很少需要使用到通过 new Boolean 方式创建的对象。

在非严格校验模式下,我们可以分配值为 true、false、undefined 和 null 给 boolean 类型的变量。

代码语言:javascript
复制
const boolTrue: boolean = true // ?
const boolFalse: boolean = false // ?
const boolUndefined: boolean = undefined // ?
const boolNull: boolean = null // ?

这样,我们也可用联合类型来自定义 TypeScript 中的 boolean 类型。

代码语言:javascript
复制
type MyBoolean = true | false | null | undefined // 和 boolean 类型一样

const mybool: MyBoolean = true
const yourbool: boolean = false

当启用 strictNullChecks 编译选项后,boolean 类型所允许的值就只有 true 和 false 了。

代码语言:javascript
复制
const boolTrue: boolean = true // ?
const boolFalse: boolean = false // ?
const boolUndefined: boolean = undefined // ?
const boolNull: boolean = null // ?

因此,我们自定义的 boolean 类型集合也减少为两个值。

代码语言:javascript
复制
type MyStrictBoolean = true | false

我们也可以通过自定义的 NonNullable 类型来禁用 null 值。

代码语言:javascript
复制
type NonNullable<T> = T extends null | undefined
  ? never
  : T;

type MyStrictBoolean = NonNullable<MyBoolean> // true | false

事实上,上述的 NonNullable 类型由一组仅在条件中使用的有限值组成,这能生成一些有趣的条件类型。

思考一下,如何在函数中处理一个可能存在差异的数据。譬如,我们可以在以下校验用户ID的函数中,给用户ID设置一个标记,然后,在调用时就必须提供对应标志。

代码语言:javascript
复制
type CheckUserId<Properties, AddUserId> = 
    AddUserId extends true 
    ? Properties & { userId: string }
    : Properties & { userId?: string }

我们可以根据通用的 AddUserId 来达到属性 userId 是否可选,通过从我们期望的类型扩展为泛型,使得这种类型更加明确。

在使用中,可能有如下函数声明:

代码语言:javascript
复制
declare function mutate<P, A extends boolean = false>
  (props: CheckUserId<P, A>, addUserId?: A): void

请注意,我甚至给 A 设置了默认值,以确保 CheckUserId 能根据传入的 addUserId 参数提供正确的信息。

该函数功能如下:

代码语言:javascript
复制
mutate({}) // ?
mutate({ data: 'Hello folks' }) // ?
mutate({ name: 'Stefan' }, false) // ?
mutate({ name: 'Stefan' }, true) // ? userId is missing
mutate({ name: 'Stefan', userId: 'asdf' }, true) // ? userId is here

如果我们的代码很大程度依赖 boolean 值的话,那么这种方式就能起到很大的作用。

本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • JavaScript中的Boolean
  • TavaScript中的Boolean
相关产品与服务
容器服务
腾讯云容器服务(Tencent Kubernetes Engine, TKE)基于原生 kubernetes 提供以容器为核心的、高度可扩展的高性能容器管理服务,覆盖 Serverless、边缘计算、分布式云等多种业务部署场景,业内首创单个集群兼容多种计算节点的容器资源管理模式。同时产品作为云原生 Finops 领先布道者,主导开源项目Crane,全面助力客户实现资源优化、成本控制。
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档