【JavaScript 漫游】【007】数据类型转换

山峰_晚霞
文章简介

本文为【JavaScript 漫游】专栏的第 007 篇文章,对 JS 数据类型转化语法进行了简记。

数据类型的转换指的是将 JS 的某一数据类型的值转换为 JS 的某一原始数据类型的值,也就是 numberstringboolean

  1. Number 方法强制转换为 number 类型
  2. String 方法强制转换为 string 类型
  3. Boolean 方法强制转换为 boolean 类型
  4. 自动转换为数值的场景
  5. 自动转换为字符串的场景
  6. 自动转换为布尔值的场景

Number 方法

Number(123);  // 123, 数值转换后还是原来的值
Number('123');  // 123,字符串如果可以解析为数值,转换为相应的数值
Number('123a');  // NaN,如果不可以解析为数值,就返回 NaN
Number('');  // 0,空字符串转为 0
Number(true);  // 1,布尔值 true 转为 1
Number(false);  // 0,布尔值 false 转为 0
Number(undefined);  // NaN
Number(null);  // 0
Number([5]);  // 5
Number({a: 1});  // NaN,对象除了包含单个数值的数组会转为数值,其他都是 NaN

Number 方法将字符串转为数值,要比 parseInt 方法要严格得多。基本上,只要有一个字符无法转为数值,整个字符串就会被转为 NaN

parseInt('123a');  // 123
Number('123a');  // NaN

parseInt 是逐个字符解析,Number 是整体解析。

此外,它们的一个共同点就是都会自动过滤字符串前导或后缀的空格。

parseInt('\t\v\r12.34\n') // 12
Number('\t\v\r12.34\n') // 12.34

值得注意的是,Number 方法的参数是对象时,将返回 NaN,除非是包含单个数值的数组。背后的原因是,Number 背后的转换规则比较复杂。

第一步,调用对象自身的 valueOf 方法。如果返回的是原始类型的值,就对该值使用 Number 方法,不再进行后续步骤。

第二步,改为调用对象自身的 toString 方法。如果返回的是原始类型的值,就对该值使用 Number 方法,不再进行后续步骤。

第三步,如果toString 方法返回的是对象,就报错。

对象的 valueOf 方法和 toString 方法,笔者会在后续总结 Object 对象的静态方法和实例方法时进行说明。这里先暂时记录着其中的原理。

String 方法

String(123);  // '123'
String('123');  // '123'
String('true');  // 'true'
String(undefined);  // 'undefined'
String(null);  // 'null'
String([1, 2, 3]);  // '[1, 2, 3]'
String({a: 1});  // '[object Object]'

String 方法的参数如果是对象,返回一个类型字符串;如果是数组,就返回该数组的字符串形式。

背后的转换原理,与 Number 方法基本相同,只是调换了顺序。

第一步,调用对象自身的 toString 方法。如果返回的是原始类型的值,就对该值使用 String 方法,不再进行后续步骤。

第二步,改为调用对象自身的 valueOf 方法。如果返回的是原始类型的值,就对该值使用 String 方法,不再进行后续步骤。

第三步,如果valueOf 方法返回的是对象,就报错。

Boolean 方法

Boolean(1);  // true
Boolean(0);  // false
Boolean('hello, world');  // true
Boolean('');  // false
Boolean(undefined);  // false
Boolean(null);  // false
Boolean(true);  // true
Boolean(NaN);  // false
Boolean({});  // true
Boolean([]);  // true
Boolean(new Boolean(false));  // true

要注意的是,所有对象(包括空对象)的转换结果都是 true,甚至连 false 对应的布尔对象 new Boolean(false) 也是 true

自动转换为数值的场景

JS 遇到预期为数值的地方,就会将参数值自动转换为数值。系统内部会自动调用 Number 方法。

除了 + 有可能把运算子转为字符串,其他运算符都会把运算子自动转为数值。

'5' - '2' // 3
'5' * '2' // 10
true - 1  // 0
false - 1 // -1
'1' - 1   // 0
'5' * []    // 0
false / '5' // 0
'abc' - 1   // NaN
null + 1 // 1
undefined + 1 // NaN

自动转换为字符串的场景

JS 遇到预期为字符串的地方,就会将参数值自动转换为字符串。具体规则是,先将复合类型的值转为原始类型的值,再将原始类型的值转为字符串。

自动转换为字符串的场景,主要发生在字符串的加法运算符的时候。

'5' + 1 // '51'
'5' + true // "5true"
'5' + false // "5false"
'5' + {} // "5[object Object]"
'5' + [] // "5"
'5' + function (){} // "5function (){}"
'5' + undefined // "5undefined"
'5' + null // "5null"

自动转换为布尔值的场景

JS 遇到预期为布尔值的地方(比如 if 语句的条件部分),就会将非布尔值的参数自动转换为布尔值。系统内部会自动调用 Boolean 方法。

自动转换为布尔值的场景主要是 if 语句、逻辑运算符和三元运算符。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/666043.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

信创系统软件开发环境搭建(QT篇)

信创系统软件开发环境搭建(QT篇) 前言Ubuntu 版本选择QT 版本选择Ubuntu 开发相关软件安装问题 前言 信创系统,包括统信 UOS 和麒麟系统都是基于 Linux 系统开发,所以要开发信创系统软件,优选 Linux 系统。而 Linux 系…

鲜花销售|鲜花销售小程序|基于微信小程序的鲜花销售系统设计与实现(源码+数据库+文档)

鲜花销售小程序目录 目录 基于微信小程序的鲜花销售系统设计与实现 一、前言 二、系统功能设计 三、系统实现 1、前台功能模块 2、后台功能模块 (1) 后台登录 (2) 管理员功能模块 用户管理 商家管理 鲜花信息管理 鲜花分类管理 管理员管理 系统管理 (3) 商家功…

2017年苏州大学837复试机试C/C++

2017年苏州大学复试机试 要求 要求用C/C编程;对程序中必要的地方进行注释。上机规则 请在电脑桌面上新建一个文件夹文件夹名为考试姓名(中文);考试完毕后,将所编写的文件放在上述文件中。 第一题(20分&…

CSS的元素显示模式

一&#xff0c;什么是元素显示模式 元素显示模式是指元素以什么方式显示&#xff0c; 作用&#xff1a;了解不同类型的标签可以更好的布局网页。 HTML元素一般分为块元素和行内元素。 1.1块元素 常见的块元素有&#xff1a;<p><ul><ol><li>,<di…

window 搭建 Flutter for Android的环境(二)

最近又重置了笔记本系统&#xff0c;因此又得重新部署Flutter环境&#xff0c;所以就再重新整理了一下&#xff1a; 下载安装好Android、git下载安装好对应版本的Flutter 下载地址:部署环境变量&#xff1a; ANDROID_HOME C:\Users\Administrator\AppData\Local\Android\SdkC:…

winserver2012远程黑屏且无法操作

当我们遇到远程windows服务器发现GUI图形加载异常&#xff0c;黑屏显示&#xff0c;且无法进行任何操作&#xff0c;我们可以尝试以下方法。 1.尝试远程命令重启 #11.11.11.11 远程服务器ip #Administrator 远程桌面用户名 #12345678 密码 #shutdown.exe -r -f 在一分钟…

【计算机网络】HTTPS协议原理

文章目录 一、相关基础概念1.HTTPS 是什么2.什么是"加密"3.为什么要加密4.常见的加密方式5.数据摘要 && 数据指纹 二、HTTPS 的工作过程 -- 加密方式1.只使用对称加密2.只使用非对称加密3.双方都使用非对称加密4.非对称加密 对称加密5.中间人攻击6.证书7.非…

力扣144 二叉树的前序遍历 Java版本

文章目录 题目描述递归方法代码 非递归方法代码 题目描述 给你二叉树的根节点 root &#xff0c;返回它节点值的 前序 遍历。 示例 1&#xff1a; 输入&#xff1a;root [1,null,2,3] 输出&#xff1a;[1,2,3] 示例 2&#xff1a; 输入&#xff1a;root [] 输出&#xf…

ElementUI Data:Table 表格

ElementUI安装与使用指南 Table 表格 点击下载learnelementuispringboot项目源码 效果图 el-table.vue&#xff08;Table表格&#xff09;页面效果图 项目里el-table.vue代码 <script> export default {name: el_table,data() {return {tableData: …

蓝桥杯省赛无忧 数位DP 课件78 数位DP

01 算法概述 02 问题引入 03 算法分析 04 例题

《QDebug 2024年1月》

一、Qt Widgets 问题交流 1. 二、Qt Quick 问题交流 1.Repeator 的 delegate 在 remove 移除时的注意事项 Qt Bug Tracker&#xff1a;https://bugreports.qt.io/browse/QTBUG-47500 Repeator 在调用 remove 函数之后&#xff0c;对应的 Item 会立即释放&#xff0c;后续就…

如何基于文档的内容实现 AI 对话功能,以 Documate 为例

前言 在 ChatGPT 出现之时&#xff0c;社区内也出现过 把 React 官方文档投喂给它 &#xff0c;然后对它进行提问的实践。但是&#xff0c;由于每次 ChatGPT 对话能接受的文本内容对应的 Token 是有上限的&#xff0c;所以这种使用方式存在一定的手动操作成本和不能复用的问题…

Linux eject命令教程:如何安全地弹出你的设备(附实例详解和注意事项)

Linux eject命令介绍 eject命令在Linux中用于弹出可移动设备。这通常是光盘&#xff0c;但也可以是软盘&#xff0c;磁带&#xff0c;或JAZ或ZIP磁盘。此命令还可以控制一些多碟CD-ROM切换器&#xff0c;一些设备支持的自动弹出功能&#xff0c;以及关闭一些CD-ROM驱动器的光盘…

使用Ettus USRP X440对雷达和EW系统进行原型验证

概览 无论是保障己方平台的生存能力&#xff0c;还是扰乱敌方频谱使用&#xff0c;以电磁(EM)频谱为主导都是任务成功的主要因素。电磁频谱操作(Electromagnetic Spectrum Operation, EMSO)需要使用战术系统来监测敌方的频谱活动、定位其发射器并帮助己方制定行动计划。软件无…

新 Ubuntu 14.04 服务器的基本配置

简介 在为新服务器设置最低配置之后&#xff0c;大多数情况下都建议进行一些额外的步骤。在本指南中&#xff0c;我们将继续配置我们的服务器&#xff0c;处理一些推荐但可选的程序。 先决条件和目标 在开始本指南之前&#xff0c;您应该先运行 Ubuntu 14.04 初始服务器设置…

离散数学——特殊关系(笔记及思维导图)

离散数学——特殊关系&#xff08;笔记及思维导图&#xff09; 笔记来自【电子科大】离散数学 王丽杰

DIY制作硬模空心耳机壳使用的是什么原材料?

制作硬模空心耳机壳的原材料可以根据不同的制作要求和材料特性进行选择。以下是一些常见的原材料&#xff1a; 塑料&#xff1a;塑料是一种常用的耳机壳制作材料&#xff0c;具有轻便、耐用、防水等特点。常见的塑料材料包括ABS、PC、PA等&#xff0c;可以根据具体要求进行选择…

vue+springboot项目开发,使用MySQL示例数据库sakila

vuespring boot项目开发&#xff0c;使用MySQL示例数据库sakila 从零开始开发一个简单的前后端分离项目&#xff0c;实现对MySQL示例数据库sakila中film表的数据展示。 环境配置 使用IDEA进行后端开发&#xff08;Spring Boot&#xff09; 安装IDEA&#xff1a;参考JDK的安…

20240131在ubuntu20.04.6下使用whisper不同模式的比对

20240131在ubuntu20.04.6下使用whisper不同模式的比对 2024/1/31 16:07 首先你要有一张NVIDIA的显卡&#xff0c;比如我用的PDD拼多多的二手GTX1080显卡。【并且极其可能是矿卡&#xff01;】 2、请正确安装好NVIDIA最新的驱动程序和CUDA。可选安装&#xff01; 3、配置whisper…

开发实践9_OnlinePlatform笔记

学习朔宁夫开发工程师课程笔记。 0架构&#xff1a; 01. MyDoc\PycharmProjects\ProjOnline&#xff0c;注册一个index app备主页用。 02. python manage.py startapp users, python manage.py startapp course. install apps. 03. total url urlpatterns [# http://127.…