首页 > 编程语言 >你不知道的JavaScript---强制类型转换

你不知道的JavaScript---强制类型转换

时间:2024-07-16 15:58:01浏览次数:24  
标签:类型转换 运算符 console log JavaScript --- 转换

你好,我是小白Coding日志,一个热爱技术的程序员。在这里,我分享自己在编程和技术世界中的学习心得和体会。希望我的文章能够给你带来一些灵感和帮助。欢迎来到我的博客,一起在技术的世界里探索前行吧!

JavaScript是一种动态类型语言,这意味着变量可以在不同类型之间自由转换。在开发过程中,理解和正确使用强制类型转换是至关重要的。本文将探讨JavaScript中的强制类型转换的各个方面,参考《你不知道的JavaScript(中卷)》中的相关内容。

什么是强制类型转换?

强制类型转换(Coercion)是指将一种数据类型转换为另一种数据类型的过程。在JavaScript中,这种转换可以是显式的(通过开发者明确调用转换函数)或隐式的(由JavaScript引擎自动进行)。

三种基本类型转换

JavaScript中的强制类型转换主要涉及三种基本类型:字符串、数字和布尔值。

转换为字符串

将值转换为字符串有多种方式,其中最常见的是通过调用String()函数或使用加号运算符(+)与空字符串相加。

let num = 123;
let str = String(num); // 显式转换
let str2 = num + '';   // 隐式转换
console.log(str);  // "123"
console.log(str2); // "123"

转换为数字

将值转换为数字也有多种方式,可以使用Number()函数、加号运算符(+)、parseInt()或parseFloat()等。

let str = "456";
let num = Number(str); // 显式转换
let num2 = +str;       // 隐式转换
console.log(num);  // 456
console.log(num2); // 456

需要注意的是,parseInt()和parseFloat()用于解析字符串中的数字,但它们与Number()有所不同,因为它们不会处理非数值字符并且可以解析带有小数点的字符串。

let str = "3.14";
console.log(parseInt(str));  // 3
console.log(parseFloat(str)); // 3.14

转换为布尔值

所有值在JavaScript中都可以转换为布尔值。JavaScript中有一些被认为是“假值”的值,它们转换为布尔值时会得到false,包括:0、-0、null、undefined、NaN和空字符串("")。其他所有值都被认为是真值,转换为布尔值时会得到true。

console.log(Boolean(0));        // false
console.log(Boolean(""));       // false
console.log(Boolean(null));     // false
console.log(Boolean(undefined));// false
console.log(Boolean(NaN));      // false

console.log(Boolean(123));      // true
console.log(Boolean("hello"));  // true
console.log(Boolean({}));       // true

 

常见的强制类型转换场景

相等运算符(==)与严格相等运算符(===)

在使用相等运算符(==)时,JavaScript会进行强制类型转换以比较不同类型的值。相反,严格相等运算符(===)不会进行类型转换,只在两个值类型相同且值相等时返回true。

console.log(123 == "123"); // true,字符串"123"被转换为数字123
console.log(123 === "123"); // false,类型不同

算术运算符

当不同类型的值参与算术运算时,JavaScript会尝试将它们转换为数字。

let result = "5" - 3; // "5" 被转换为 5,结果为 2
console.log(result); // 2

result = "5" + 3; // 由于 + 运算符优先进行字符串连接,结果为 "53"
console.log(result); // "53"

 

逻辑运算符

逻辑运算符(&&、||、!)也会触发类型转换。它们通常会将操作数转换为布尔值,以决定运算结果。

console.log(!!"hello"); // true,非空字符串被转换为 true
console.log(!!0);       // false,0 被转换为 false
console.log(null || "default"); // "default",null 被转换为 false

避免强制类型转换的陷阱

尽管强制类型转换在JavaScript中是常见且有用的,但它也可能导致意外行为。因此,了解和避免这些陷阱是关键。

NaN陷阱

当尝试将非数值字符串转换为数字时,会得到NaN(Not-a-Number)。

let result = Number("hello");
console.log(result); // NaN

null和undefined的特殊情况

null和undefined在进行类型转换时有一些特殊的行为,需要特别注意。

console.log(Number(null));      // 0
console.log(Number(undefined)); // NaN

字符串连接与算术运算

由于+运算符既用于字符串连接又用于加法运算,容易引起混淆。.

console.log("5" + 3); // "53",字符串连接
console.log("5" - 3); // 2,算术运算

 

理解和正确使用JavaScript中的强制类型转换是编写健壮代码的基础。通过掌握不同类型转换的规则和常见陷阱,我们可以更好地控制代码的行为,避免意外错误。 希望本文对您理解JavaScript中的强制类型转换有所帮助。如果想深入了解更多内容,建议阅读《你不知道的JavaScript(中卷)》这本书。

最后还是那句话:即使代码逻辑很简单,也值得记录下来。我的编程目标是避免重复造轮子!

标签:类型转换,运算符,console,log,JavaScript,---,转换
From: https://blog.csdn.net/gaotlantis/article/details/140467696

相关文章

  • Midjourney提示词-动物系列-1
    Kirin,isamythicalcreatureinancientChina,fromshanhaiclassic,theyarepaintedwiththelion'shead,deerhorn,bigofeyes,lovelysitting,tangsancaifour-leggedcreaturethatcolorofskin,Chinesemythology,Chinesegodbeast,andthecl......
  • SpringMVC-拦截器
    文章目录1、拦截器的配置2、拦截器的三个抽象方法3、多个拦截器的执行顺序SpringMVC中的拦截器(Interceptor)是一种强大的机制,用于拦截请求和响应。它允许开发者在请求处理的不同阶段执行预处理和后处理操作,比如日志记录、权限检查、国际化等。以下是关于Sprin......
  • JavaScript字符串对象查找字符出现次数
      查找字符串中某个字符出现的次数思路:1.根据indexOf()方法的特性只会返回要查找的字符出现再字符串中的第一次的位置     2.而且想要继续往后查找则需要跳过前一个已经查询了的字符的位置,则可以在原先位置加       1后再查找     3.将......
  • MBR30200PT-ASEMI智能AI应用MBR30200PT
    编辑:llMBR30200PT-ASEMI智能AI应用MBR30200PT型号:MBR30200PT品牌:ASEMI封装:TO-247批号:最新恢复时间:35ns最大平均正向电流(IF):30A最大循环峰值反向电压(VRRM):200V最大正向电压(VF):0.70V~0.90V工作温度:-65°C~175°C芯片个数:2芯片尺寸:mil正向浪涌电流(IFMS):275AMBR30200PT特性:......
  • 咬文嚼图式的介绍二叉树、B树/B-树
    前言因为本人天资愚钝,所以总喜欢将抽象化的事务具象化表达。对于各类眼花缭乱的树,只需要认知到它们只是一种数据结构,类似数组,切片,列表,映射等这些耳熟能详的词汇。对于一个数据结构而言,无非就是增删改查而已,既然各类树也是数据结构,它们就不能逃离增删改查的桎梏。那么,为什么我们......
  • Linux-awk
    awk3.4.2功能过滤 取行取列统计计算数组函数3.4.3格式awk条件动作(找谁干啥)awk[options]'commands'filenamesawk[options]-fawk-script-filefilenames3.4.4awk处理数据的方式:1、进行逐行扫描文件,从第一行到最后一行2、寻找匹配的特定模式的行,......
  • 2024-07-16 代码高亮插件highlight.js安装使用以及排错日志
    highlight.js—— 一个开源语法高亮库,用于在网页上对源代码进行语法高亮显示。安装npmihighlight.jsyarnaddhighlight.js引入//main.jsimport{createApp}from'vue';importAppfrom"./App.vue";importhljsfrom"highlight.js";//代码高亮插件import......
  • 8-基于双TMS320C6678 + XC7K420T的6U CPCI Express高速数据处理平台 双DSP 6U CPCI架
    基于双TMS320C6678+XC7K420T的6UCPCIExpress高速数据处理平台 1、板卡概述板卡由北京太速科技自主研发,基于6UCPCI架构,处理板包含双片TIDSPTMS320C6678芯片;一片Xilinx公司FPGAXC7K420T-1FFG1156芯片;六个千兆网口(FPGA两个,DSP四个);DSP与FPGA之间Rap......
  • TaD+RAG-缓解大模型“幻觉”的组合新疗法
    TaD:任务感知解码技术(Task-awareDecoding,简称TaD),京东联合清华大学针对大语言模型幻觉问题提出的一项技术,成果收录于IJCAI2024。RAG:检索增强生成技术(Retrieval-augmentedGeneration,简称RAG),是业内解决LLM幻觉问题最有效的系统性方案。1.背景介绍近来,以ChatGPT为代表的生成式大......
  • vue3+element-plus+typescript
    1.vue3+ts+elementui-plushttps://blog.csdn.net/qq_41737571/article/details/1390730852.自动调整font-size大小https://blog.csdn.net/qq_41737571/article/details/1401586143.简单小众电商购物项目模板:基于Vue3和Vant4的纯前端开发方案https://web-hls.blog.csdn.......