如何避免JavaScript类型转换

凯特林
• 阅读 1283

你是否经历过JavaScript中的某些值比较没有得到预期结果的情况?

看下面的情况:

如何避免JavaScript类型转换

即使[]==0结果为真,if[]条件也没有根据结果执行。有没有想过为什么会这样?

本文主要说明这些值比较的工作原理以及影响它们的因素。在深入解释之前,大家要熟悉一个概念:类型转换

什么是 JavaScript 类型转换?

这也称为类型强制。对于不熟悉此概念的人来说,它只是将值从一种数据类型自动转换为另一种数据类型。

看个例子,大家会更清楚明白。

如何避免JavaScript类型转换

在此示例中,定义的两个变量具有两种类型;字符串和数字。但是,当我们使用 ==(非严格比较)进行比较时,结果为true。原因是当我们使用==比较这两个时,JavaScript 会自动尝试将String类型转换为Number类型以产生结果。这是一种强制转换。

JavaScript中有多种强制类型。

  • Number conversions

  • String conversions

  • Boolean conversions

  • 对象的类型转换

如何避免JavaScript类型转换

类型强制转换都是好的吗?

在上述情况下,类型转换没有害处。但是,在许多情况下,类型强制会导致问题。

如何避免JavaScript类型转换

我们看下面例子。

如何避免JavaScript类型转换

在这里,JavaScript已将Number类型转换为String。这与相等比较中发生的情况相反。我们预期的结果是450。但是,我们得到了String输出。

现在,我们对类型转换以及为什么要避免使用类型转换有了清晰的了解,让我们看看如何避免类型转换。这是本文最重要的部分。因此,请坐下来,喝咖啡并集中精力😃

如何避免 JavaScript 类型转换

1. 对数学运算使用显式转换

如果你需要对用户输入或任何其他值使用数学运算,则在执行该运算之前,自己进行一次显式转换会更安全。这样,可以避免任何意外行为。

如何避免JavaScript类型转换

2. 使用模板字面值连接字符串,而不是+

如果需要连接两个数字,则使用模板文字会更安全。特别是不确定值的类型。

如何避免JavaScript类型转换

也可以使用显式转换来导出相同的结果。

如何避免JavaScript类型转换

3.当比较值时,使用严格的比较(===)

前面我们看到,当使用==时,JavaScript 会执行隐式类型转换,这会导致不一致的结果。因此,在我们的生产代码中使用它是不安全的。

为了得出预期的结果,应该始终使用===进行比较。三等号隐含地表示:

我可以同时了解变量的值和类型

因此,如果将数字和字符串与值进行比较,结果将是false,因为它也会考虑变量的类型。

如何避免JavaScript类型转换

这是获得预期一致结果的更安全的方法。

在JavaScript中,数据类型有两种变体。

  • 原始值(字符串、数字等)

  • 非原始值(数组、对象)

到目前为止,我们已经讨论了原始数据类型的类型转换。我提供的第一个示例涉及非原始数据类型,例如数组。

所有非原始数据类型都有一个名为.toPrimitive()的内置函数。比较非原始值和原始值时,此函数会自动将非原始类型转换为原始类型。在我们看过的第一个示例中,当使用此函数进行非严格比较时,空数组将转换为空字符串。确切地说,用于执行此转换的确切函数是toString()。因此,空数组(将转换为空字符串)等于0

如何避免JavaScript类型转换

正如我们前面所看到的,当在if条件中检查空数组时,将执行条件中的行。但是,如果空数组隐式转换为0怎么办?

这是在单独的JavaScript条件下进行的: 真值和虚值 。除了true以外,JavaScript 将大部分有值的视为真值,除了少数值。例如,0-0""被视为虚值。由于空数组不被认为是虚值,当在条件中检查它时,它将作为真值执行。(这里不会发生类型转换,空数组保留为数组,这是类型转换不一致的另一个例子。)

如何避免JavaScript类型转换

总结

JavaScript作为一种松散类型语言,执行隐式类型转换。这会导致不一致和意想不到的结果。因此,我们应该在任何时候都避免这种类型转换。如果不确定值的类型,可以使用typeof检查。检查类型可以让我们更好地理解应该如何进行转换。

点赞
收藏
评论区
推荐文章
blmius blmius
2年前
MySQL:[Err] 1292 - Incorrect datetime value: ‘0000-00-00 00:00:00‘ for column ‘CREATE_TIME‘ at row 1
文章目录问题用navicat导入数据时,报错:原因这是因为当前的MySQL不支持datetime为0的情况。解决修改sql\mode:sql\mode:SQLMode定义了MySQL应支持的SQL语法、数据校验等,这样可以更容易地在不同的环境中使用MySQL。全局s
Karen110 Karen110
2年前
一篇文章带你了解JavaScript日期
日期对象允许您使用日期(年、月、日、小时、分钟、秒和毫秒)。一、JavaScript的日期格式一个JavaScript日期可以写为一个字符串:ThuFeb02201909:59:51GMT0800(中国标准时间)或者是一个数字:1486000791164写数字的日期,指定的毫秒数自1970年1月1日00:00:00到现在。1\.显示日期使用
皕杰报表之UUID
​在我们用皕杰报表工具设计填报报表时,如何在新增行里自动增加id呢?能新增整数排序id吗?目前可以在新增行里自动增加id,但只能用uuid函数增加UUID编码,不能新增整数排序id。uuid函数说明:获取一个UUID,可以在填报表中用来创建数据ID语法:uuid()或uuid(sep)参数说明:sep布尔值,生成的uuid中是否包含分隔符'',缺省为
Jacquelyn38 Jacquelyn38
2年前
面试官:JavaScript的数据类型你了解多少?
前言作为JavaScript的入门知识点,Js数据类型在整个JavaScript的学习过程中其实尤为重要。最常见的是边界数据类型条件判断问题。我们将通过这几个方面来了解数据类型:概念检测方法转换方法概念undefined、Null、Boolean、String、Number、Symbol、BigInt为基础类型;Ob
爱丽丝13 爱丽丝13
2年前
TypeScript 4.2 有哪些新特性
TypeScript4.2发布了!对于不熟悉TypeScript的人来说,TypeScript就是增加了静态类型和类型检查的JavaScript。有了类型限制,你就可以精确的表达你的函数需要什么类型的参数以及返回什么类型的结果。同时,利用TypeScript的类型检查,你可以很容易避免一些常见错误,例如拼写错误或者忘记处理null和un
Wesley13 Wesley13
2年前
mysql中时间比较的实现
MySql中时间比较的实现unix\_timestamp()unix\_timestamp函数可以接受一个参数,也可以不使用参数。它的返回值是一个无符号的整数。不使用参数,它返回自1970年1月1日0时0分0秒到现在所经过的秒数,如果使用参数,参数的类型为时间类型或者时间类型的字符串表示,则是从1970010100:00:0
Stella981 Stella981
2年前
Android So动态加载 优雅实现与原理分析
背景:漫品Android客户端集成适配转换功能(基于目标识别(So库35M)和人脸识别库(5M)),导致apk体积50M左右,为优化客户端体验,决定实现So文件动态加载.!(https://oscimg.oschina.net/oscnet/00d1ff90e4b34869664fef59e3ec3fdd20b.png)点击上方“蓝字”关注我
Stella981 Stella981
2年前
JavaScript里面三个等号和两个等号的区别
\equality等同,identity恒等。\,两边值类型不同的时候,要先进行类型转换,再比较。\,不做类型转换,类型不同的一定不等。下面分别说明:先说,这个比较简单。下面的规则用来判断两个值是否相等:1、如果类型不同,就\不相等\2、如果两个都是数值,并且是同
Stella981 Stella981
2年前
Js——第一课
数据类型:要特别注意相等运算符。JavaScript在设计时,有两种比较运算符:第一种是比较,它会自动转换数据类型再比较,很多时候,会得到非常诡异的结果;第二种是比较,它不会自动转换数据类型,如果数据类型不一致,返回false,如果一致,再比较。由于JavaScript这个设计缺陷,_不要_使用比较,始终
Wesley13 Wesley13
2年前
oracle小数点前零丢失的问题
1.问题起源 oracle数据库字段值为小于1的小数时,使用char类型处理,会丢失小数点前面的0 例如0.35就变成了.35 2.解决办法:(1)用to\_char函数格式化数字显示 select    to\_char(0.338,'fm9999999990.00')fromdual; 结果:0.34