数据类型及相互规则转换,我被问麻了!!!

简介: 数据类型及相互规则转换,我被问麻了!!!

数据类型



首先我们了解一下,Js中有哪些数据类型。

基本数据类型:Undefined、Null、Boolean、Number、String、Symbol、BigInt。

引用数据类型:Arrary,普通对象,date(),正则,函数


隐式转换和显式转换



隐式转换:通常包括有数学运算(+-*/),isNaN(),==比较

显示转换:Boolean()、Number()、String()等


其他类型值转换为数字



Number([val])


  1. 字符串转化为数字,空字符串是0,如果出现任何非有效数字,结果是NaN
  2. true -> 1 false-> 0
  3. null -> 0 undefined -> NaN
  4. symbol不能转化为数字,会报错
  5. BigInt会去除n
  6. 对象转化为数字
  • 先调用Symbol.toPrimitive方法,如果不存在这个方法
  • 再调用对象的valueOf获取原始值,如果获取的值不是原始值
  • 再调用toString把其变成字符串
  • 最后再把字符串基于Number方法转化为数字


parseInt([val],[radix])


  • [ val ]必须是字符串,如果不是,要先隐式转换为字符串 String([val])
  • [ radix ]进制
  • 如果不写,或者写零:默认是10(特殊情况:如果字符串是0x开始的,默认是16进制)
  • 有效范围:2~36之间,如果不在这个区间,结果直接是NaN
  • 从[ val ]字符串左侧第一个字符开始查找,查找出符合[radix]进制的值(遇到不符合的则直接结束查找,不论后面是否还有符合的);把找到的内容,按照[radix]进制,转换为10进制!


其他类型值转换为字符串



String([val])和[val].toString()


String([val])会经历严格的三个步骤,最后不一定变成字符串

  • 先调用Symbol.toPrimitive方法,如果不存在这个方法
  • 再调用对象的valueOf获取原始值,如果获取的值不是原始值
  • 再调用toString把其变成字符串


[val].toString()


[val].toString()一定会转换成字符串。它和String()的区别是String()会调用对象中的valueOf()方法,从而返回的可能不是一个字符串。

+

+ 出现在左右两边,其中一边是字符串,或者是某些对象,会以字符串拼接开始处理,其他情况都是数学运算。


其他值到布尔类型的值的转换规则



以下这些是假值:

• undefined

• null

• false

• +0、-0 和 NaN

• ""


假值的布尔强制类型转换结果为 false。从逻辑上说,假值列表以外的都应该是真值。


小试牛刀



第一题


let res = 100 + true + 21.2 + null + undefined + "Tencent" + [] + null + 9 + false
console.log(res)


首先 100 + true没有遇到字符串或者对象,是数学运算,true会转化成1,结果是101。 101 + 21.2是122.2. 122.2 + null还是122.2。undefined转为数字,是NaN,任何数加NaN都是NaN。所以122.2 + undefined会变成NaN。从此之后,都会变成了字符串拼接了,NaNTencent + []。[]变成空字符串,null变成"null",9变成"9",false变成"false"。

所以最终输出NaNTencentnull9false

image.png


第二题


let arr = [27.2, 0, '0013', '14px', 123];
arr = arr.map(parseInt)
console.log(arr)


前置知识 map遍历会有两个参数map((item,index)=>{}),分别是当前项和索引值,这两个参数会传入paseInt里面,相当于我们要计算以下值的结果


parseInt(27.2,0)
parseInt(0,1)
parseInt('0013',2)
parseInt('14px',3)
parseInt('123',4)


第一个,我们已经说了,如果第二个参数不写或者是0,默认都是10进制。先转换为字符串,然后就输出了27。

第二个,radix的范围是2~36,1不在这个范围,直接是NaN

第三个,'0013'中二进制只有'001',转换成10进制直接输出1

第四个,'14px'变成三进制,有效的是'1',对应的10进制输出是1

第五个,'123'变成了四进制,都是有效的,所以输出对应的10进制是3 + 24 + 14^2 = 27


image.png


小知识



isNaN 和 Number.isNaN 函数的区别


NaN(not a number)意味着它不是一个数字,但是typeof NaN 是number。NaN是一个特殊值,它和自身不相等

isNaN()函数在判断是否为NaN时,需要先进行数据类型转换,只有在无法转换为数字时才会返回true

Number.isNaN()函数在判断是否为NaN时,只需要判断传入的值是否为NaN不会进行数据类型转换。


image.png


目录
相关文章
|
JSON 前端开发 JavaScript
从零打造你的前端开发脚手架
从零打造你的前端开发脚手架
384 0
|
1月前
|
文字识别 算法 数据可视化
2025 年度机器视觉公司有哪些:从技术实力到落地案例的全方位选型参考
在智能制造背景下,机器视觉成为提质增效关键。本文发布2025年度机器视觉公司评估,从技术、场景、服务三大维度解析领先企业方案,聚焦苏州德创测控等代表,涵盖核心技术、落地案例与产教融合,为制造企业选型提供权威参考,助力智能升级。
|
6月前
|
JSON 数据挖掘 API
唯品会电商 API 接口,特卖数据精准分析秘籍
在竞争激烈的电商市场中,唯品会凭借“品牌折扣”模式脱颖而出。本文详解如何利用唯品会API接口实现特卖数据精准分析,涵盖API获取与使用、关键指标、实战分析方法及案例,帮助商家提升销售业绩,优化运营决策,把握市场先机。
298 1
|
8月前
|
前端开发 Java 物联网
智慧班牌源码,采用Java + Spring Boot后端框架,搭配Vue2前端技术,支持SaaS云部署
智慧班牌系统是一款基于信息化与物联网技术的校园管理工具,集成电子屏显示、人脸识别及数据交互功能,实现班级信息展示、智能考勤与家校互通。系统采用Java + Spring Boot后端框架,搭配Vue2前端技术,支持SaaS云部署与私有化定制。核心功能涵盖信息发布、考勤管理、教务处理及数据分析,助力校园文化建设与教学优化。其综合性和可扩展性有效打破数据孤岛,提升交互体验并降低管理成本,适用于日常教学、考试管理和应急场景,为智慧校园建设提供全面解决方案。
540 70
|
11月前
|
传感器 人机交互 定位技术
XR交互技术趋势:6DoF追踪、手势识别、眼动跟踪……
XR交互技术与实时云渲染共同推动了虚拟现实和增强现实的沉浸式体验发展。XR交互技术通过6DoF追踪、手势追踪、眼动追踪等手段,提供更自然、精准的用户交互方式;而实时云渲染则利用云端计算能力,为终端设备呈现高质量、低延迟的复杂图形内容。两者结合,使用户在XR环境中获得更加真实、流畅的体验。未来,XR交互技术将向多模态、精细化方向发展,进一步提升用户的沉浸感和交互体验。
815 20
|
存储 网络协议 安全
阿里云服务器2核8G、4核16G、8核32G选型参考:经济型、通用算力型和通用型选择参考
2核8G、4核16G、8核32G配置是用户关注度比较高的热门配置,在阿里云服务器的实例规格中,这些配置一般有经济型e、通用算力型u1、通用型g7和通用型g8y等多种实例规格,虽然配置相同,但是这些实例规格之间的性能和价格差别是很大的,因此,我们有必要弄清楚他们之间的差别,这样才能根据自己的需求选择最适合自己的实例。本文将为您详细解析这些实例规格的性能、价格及应用场景,以供参考和选择。
阿里云服务器2核8G、4核16G、8核32G选型参考:经济型、通用算力型和通用型选择参考
|
机器学习/深度学习 异构计算 Python
HelloMeme:充分利用 SD1.5 基模的理解能力,实现表情与姿态的迁移
利用最新的 Diffusion 生成技术实现表情迁移
407 0
HelloMeme:充分利用 SD1.5 基模的理解能力,实现表情与姿态的迁移
|
机器学习/深度学习 传感器 人工智能
智慧无人机AI算法方案
智慧无人机AI算法方案通过集成先进的AI技术和多传感器融合,实现了无人机的自主飞行、智能避障、高效数据处理及多机协同作业,显著提升了无人机在复杂环境下的作业能力和安全性。该方案广泛应用于航拍测绘、巡检监测、应急救援和物流配送等领域,能够有效降低人工成本,提高任务执行效率和数据处理速度。
2611 2
智慧无人机AI算法方案
|
XML 数据库 Android开发
10分钟手把手教你用Android手撸一个简易的个人记账App
该文章提供了使用Android Studio从零开始创建一个简单的个人记账应用的详细步骤,包括项目搭建、界面设计、数据库处理及各功能模块的实现方法。
|
存储 前端开发 API
大型前端应用如何做系统融合?
【6月更文挑战第8天】在数字化时代,大型前端应用需与多系统融合以增强功能和体验。融合的关键步骤包括:清晰规划和设计,深入理解各系统,统一数据模型,设计稳定接口,确保安全性与稳定性,以及团队协作。通过这些方法,实现系统间的无缝衔接,提升服务质量和应用价值。示例代码展示了前端应用与外部系统数据交互。在不断变化的技术环境中,持续创新融合策略至关重要。
380 3