使用JavaScript的一些小技巧--数据类型转换（转载）

最新推荐文章于 2024-07-16 11:30:38 发布

yoinyao

最新推荐文章于 2024-07-16 11:30:38 发布

阅读量130

点赞数

分类专栏：日常记录

日常记录专栏收录该内容

9 篇文章 0 订阅

订阅专栏

转换为布尔值

布尔值除了true和false之外，JavaScript还可以将所有其他值视为“真实的”或“虚假的”。除非另有定义，JavaScript中除了0、''、null、undefined、NaN和false之外的值都是真实的。

我们可以很容易地在真和假之间使用!运算符进行切换，它也会将类型转换为Boolean。比如：

const isTrue = !0; 
const isFasle = !1; 
const isFasle = !!0 // !0 => true，true的反即是false 

console.log(isTrue) 
> Result: true 

console.log(typeof isTrue) 
> Result: 'boolean'

这种类型的转换在条件语句中非常方便，比如将!1当作false。

转换为字符串

我们可以使用运算符+后紧跟一组空的引号''快速地将数字或布尔值转为字符串：

const val = 1 + '' 
const val2 = false + '' 

console.log(val) 
> Result: "1" 

console.log(typeof val) 
> Result: "string" 

console.log(val2) 
> Result: "false" 

console.log(typeof val2) 
> Result: "string"

转换为数值

上面我们看到了，使用+紧跟一个空的字符串''就可以将数值转换为字符串。相反的，使用加法运算符+可以快速实现相反的效果。

let int = '12' 
int = +int 

console.log(int) 
> Result: 12 

console.log(typeof int) 
> Result: 'number'

用同样的方法可以将布尔值转换为数值：

console.log(+true) 
> Return: 1 

console.log(+false) 
> Return: 0

在某些上下文中，+会被解释为连接操作符，而不是加法运算符。当这种情况发生时，希望返回一个整数，而不是浮点数，那么可以使用两个波浪号~~。双波浪号~~被称为按位不运算符，它和-n - 1等价。例如， ~15 = -16。这是因为- (-n - 1) - 1 = n + 1 - 1 = n。换句话说，~ - 16 = 15。

我们也可以使用~~将数字字符串转换成整数型：

const int = ~~'15' 

console.log(int) 
> Result: 15 

console.log(typeof int) 
> Result: 'number'

同样的，NOT操作符也可以用于布尔值： ~true = -2，~false = -1。

浮点数转换为整数

平常都会使用Math.floor()、Math.ceil()或Math.round()将浮点数转换为整数。在JavaScript中还有一种更快的方法，即使用|（位或运算符）将浮点数截断为整数。

console.log(23.9 | 0); 
> Result: 23 

console.log(-23.9 | 0); 
> Result: -23

|的行为取决于处理的是正数还是负数，所以最好只在确定的情况下使用这个快捷方式。

如果n是正数，则n | 0有效地向下舍入。如果n是负数，它有效地四舍五入。更准确的说，该操作删除小数点后的内容，将浮点数截断为整数。还可以使用~~来获得相同的舍入效果，如上所述，实际上任何位操作符都会强制浮点数为整数。这些特殊操作之所以有效，是因为一旦强制为整数，值就保持不变。

|还可以用于从整数的末尾删除任意数量的数字。这意味着我们不需要像下面这样来转换类型：

let str = "1553";
Number(str.substring(0, str.length - 1)); 
> Result: 155

我们可以像下面这样使用|运算符来替代：

console.log(1553 / 10 | 0) 
> Result: 155 

console.log(1553 / 100 | 0)
> Result: 15

使用!!操作符转换布尔值

有时候我们需要对一个变量查检其是否存在或者检查值是否有一个有效值，如果存在就返回true值。为了做这样的验证，我们可以使用!!操作符来实现是非常的方便与简单。对于变量可以使用!!variable做检测，只要变量的值为:0、null、" "、undefined或者NaN都将返回的是false，反之返回的是true。比如下面的示例：

function Account(cash) { 
    this.cash = cash; 
    this.hasMoney = !!cash; 
} 

var account = new Account(100.50); 
console.log(account.cash); 
> Result: 100.50 

console.log(account.hasMoney); 
> Result: true var emptyAccount = new Account(0); 

console.log(emptyAccount.cash); 
> Result: 0 

console.log(emptyAccount.hasMoney); 
> Result: false

在这个示例中，只要account.cash的值大于0，那么account.hasMoney返回的值就是true。

还可以使用!!操作符将truthy或falsy值转换为布尔值：

!!""        // > false 
!!0         // > false 
!!null      // > false 
!!undefined // > false 
!!NaN       // > false 
!!"hello"   // > true 
!!1         // > true 
!!{}        // > true 
!![]        // > true