JavaScript基础——数据类型转换

news2024/11/16 9:47:19

显示数据类型转换

String()函数进行显示转换

Number()函数进行显示转换

Boolean()函数进行显示转换

隐式数据类型转换

算术运算隐式转化

比较操作隐式转化

赋值操作


        在JavaScript中,数据类型转换是常见的操作,它允许将一种类型的数据转换为另一种类型。数据类型转换可以分为两种类型:隐式类型转换(也称为类型强制或类型合)和显式类型转换。

显示数据类型转换

        显式类型转换是由明确调用函数或方法来实现的,转换的意图是明确的

String()函数进行显示转换

        String()是一个JavaScript内置的构造函数,用于将任何类型的值转换为字符串。语法如下:

let str = String(需要转换的字符); 

        利用String()函数将布尔值和数字转换为字符串,并用typeof语句查看数据类型,可以发现转换后的数据类型为string。

        完整代码:

    <script>

        // 1) 转字符串
        console.log(typeof true);// 'boolean'
        console.log(typeof 100);// 'number'
        console.log(typeof String(100));// 'string'
        console.log(typeof String(true));// 'string'

    </script>

Number()函数进行显示转换

      Number()是JavaScript中的一个内置构造函数,它用于将任何类型的值转换为数字。语法如下:

let num = Number(需要转换的数字); 

        注意:利用Number()将字符串转为数字是不可行的,会输出NaN(not a number),意思是非数字,特殊的数值,但是数据类型也是number,因为已经进行了数据类型的转换。

        将指定的数据转换为number类型,并用typeof语句检测转换前后的数据类型,结果如下: 

 

        如果对布尔值进行转换,真值true会转换为1,假值false转换为0,数据类型均为number。

        同理,空值(空字符串、null等)的布尔值为false,转换为数字类型,结果是0,undefined缺少值转换为数字类型,结果是NaN,但数据类型均为number。

        逻辑运算的结果为真或假,也就是1或0,转换为数字类型也是同理。任何与逻辑运算相关的,都可以归纳为true和false,true对应1,false对应0。

        完整代码如下:

    <script>

        // 2)转数字类型
        console.log(typeof "abc");// 'string'
        console.log(Number("abc"));// NaN   (not a number) 非数字 特殊的数值。
        console.log(typeof Number("abc"));// 'number'
        console.log(typeof "100");// 'string'
        console.log(Number("100"));// 100
        console.log(typeof Number("100"));// 'number'


        console.log(typeof true);// 'boolean'
        console.log(typeof true);// 'boolean'
        console.log(typeof Number(true));// 'number'
        console.log(typeof Number(true));// 'number'
        console.log(Number("")); // 0
        console.log(Number(undefined)); // 0
        console.log(Number(null)); // 0

        console.log(typeof ""); // string
        console.log(typeof true); // boolean
        console.log(typeof false); // boolean

        console.log(typeof Number("")); // number
        console.log(typeof Number(null)); // number
        console.log(typeof Number(undefined)); // number
        console.log(typeof Number(true)); // number
        console.log(typeof Number(false)); // number

        console.log(Number(true)); // 1
        console.log(Number(false)); // 0
        console.log(Number("")); // 0
        console.log(Number(null)); // 0
        console.log(Number(undefined)); // NaN

        console.log(Number(1 > 2)); // 0
        console.log(Number(1 < 2)); // 1
        console.log(typeof Number(1 > 2)); // number
        console.log(typeof Number(1 < 2)); // number     
    </script>

Boolean()函数进行显示转换

        Boolean()是JavaScript中的一个内置构造函数,用于将任何类型的值转换为布尔值。语法如下:

let flag = Boolean(需要转换的字符); 

        在JavaScript中,将不同类型的值转换为布尔值时,非空字符串和所有非零数字(包括正数、负数和NaN以外的特殊值)都会转换为true,而空字符串、数字0、-0、NaN、null和undefined则会转换为false。

        完整代码:

    <script>

        // 2)转数字类型

        console.log(Boolean("abc")) // true
        console.log(Boolean(12)) // true
        console.log(Boolean([1, 2])) // true
        console.log(Boolean({ k: 2 })) // true

        console.log(Boolean(0)); // false
        console.log(Boolean(1 > 2)) // false
        console.log(Boolean("")); // false
        console.log(Boolean(null)); // false

        console.log(Boolean(undefined)); // false
        console.log(Boolean(NaN)); // false


    </script>

隐式数据类型转换

        隐式类型转换发生在JavaScript解释器在执行代码时自动将一种类型的值转换为另一种类型,而不需要者显式地指定。 

算术运算隐式转化

        任意数据类型和字符串拼接,都会变成字符串类型,利用“+”号连接的两个数据,一个为字符串,+"字符串",得到的数据就是字符串类型。

 

        完整代码:

    <script>

        // 任意数据类型和字符串拼接,都会变成字符串类型
        console.log(typeof 10);// 'number'
        console.log(typeof (10 + "abc"));// 'string'
        console.log(typeof true);//'boolean'
        console.log(typeof (true + ""));//'string'
        console.log(typeof (undefined + ""));//'string'

    </script>

        使用“-0”可以隐式转换成数字类型,任何数字减去0都等于其本身。

        完整代码如下:

    <script>

        // 使用“-”可以隐式转换成数字类型
        // 任何数字减去0都等于其本身
        console.log(100 - 60);// 40
        console.log(typeof "100");// 'string'
        console.log(typeof ("100" - 0));// 'number'

    </script>

        使用“*1”可以隐式转换成数字类型,任何数字乘以1都等于其本身。

        完整代码如下:

    <script>

        // 任何数字乘以1都等于其本身
        console.log(typeof "100");// 'string'
        console.log(typeof ("100" * 1));// 'number'

    </script>

比较操作隐式转化

        在进行比较时,不同类型的值会被转换成布尔值或数字,以便进行比较。例如,"0" == 0 的结果是 true,因为字符串"0"被转换成了数字0

        完整代码:

    <script>

        // 字符串与数字的比较
        console.log("0" == 0); // true,因为字符串 "0" 被转换成数字 0

        // 布尔值与数字的比较
        console.log(true == 1); // true,因为布尔 true 被转换成数字 1
        console.log(false == 0); // true,因为布尔 false 被转换成数字 0

        // 对象与原始类型的比较
        let obj = new String("100");
        console.log(obj == 100); // true,因为对象 obj 被转换成字符串 "100",然后 "100" 被转换成数字 100

        // null 和 undefined 的比较
        console.log(null == undefined); // true,null 和 undefined 是相等的
        console.log(null == 0); // false,null 和 0 是不相等的

        // NaN 的比较
        console.log(0 / 0 == 0 / 0); // false,因为 NaN 与任何值(包括自身)比较都返回 false

        // 空值和非空值的比较
        console.log("" == false); // true,空字符串被转换成数字 0,与 false(转换成数字 0)相等
        console.log(" " == false); // false,非空字符串被转换成数字,与 false 不相等

    </script>

        假设有多个比较运算时,会将结果转换为0或1,再继续比较。        

        假设需要比较1>2<3,程序首先会先比较1>2,结果为假,所以值为0,然后比较0<3,是真,所以输出true。        

        比较1<2>3,程序首先会先比较1<2,结果为真,所以值为1,然后比较1>3,是假,所以输出false。        

赋值操作

        在JavaScript中,赋值操作使用单个等号=来执行。赋值时,赋值的值(称为源值)通常会被转换成与目标变量的类型一致的值。

  

        完整代码如下:

    <script>

        let num; // 声明一个变量,未初始化

        // 将字符串赋值给num,隐式转换为数字
        num = "123"; // num 现在是数字 123

        // 将布尔值赋值给num,隐式转换为数字
        num = true; // num 现在是数字 1
        console.log(num);

        // 将对象赋值给字符串变量
        let str;
        str = new String("Hello"); // str 现在是字符串 "Hello"
        console.log(str);

        // 将数字赋值给布尔值变量,隐式转换为布尔值
        let bool;
        bool = 0; // bool 现在是 false,因为 0 被转换成 false
        console.log(bool);
        bool = 1; // bool 现在是 true,因为 1 被转换成 true
        console.log(bool);

        // 将null赋值给任何变量
        let obj;
        obj = null; // obj 现在是 null
        console.log(obj);

        // 将undefined赋值给任何变量
        let undef;
        undef = undefined; // undef 现在是 undefined
        console.log(undef);

    </script>

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

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

相关文章

c++网络编程实战——开发基于协议的文件传输模块(一)如何实现一个简单的tcp长连接

前言 在之前的几篇内容中我们已经介绍过基于ftp协议的文件传输模块&#xff0c;而这个系列我们所想实现的就是如何实现基于tcp进行的文件传输模块,话不多说&#xff0c;开坑开坑! 什么是tcp长连接 我们知道tcp在建立连接的时候会通过三次握手与四次挥手来建立tcp连接&#x…

用uniapp 及socket.io做一个简单聊天app 4

界面如下&#xff1a; <template><view class"container"><input v-model"username" placeholder"用户名" /><input v-model"password" type"password" placeholder"密码" /><butto…

探秘北京崇文门中医医院卫景沛医生:为何深受患者信赖?

卫景沛是北京崇文门中医医院特聘专家&#xff0c;深受患者信赖&#xff01; 北京崇文门中医医院卫景沛主任毕业于兰州大学医学院&#xff0c;拥有医学硕士学位。他的硕士导师是天坛医院的王拥军教授&#xff0c;主要研究方向为脑血管病及脑血管病介入治疗。 为了提升自己在缺血…

对称加密:数据安全的保障

&#x1f90d; 前端开发工程师、技术日更博主、已过CET6 &#x1f368; 阿珊和她的猫_CSDN博客专家、23年度博客之星前端领域TOP1 &#x1f560; 牛客高级专题作者、打造专栏《前端面试必备》 、《2024面试高频手撕题》 &#x1f35a; 蓝桥云课签约作者、上架课程《Vue.js 和 E…

Qt对象树的介绍

目录 创建项目&#xff08;此处我就不多介绍了&#xff09; 按钮 对象树 创建项目&#xff08;此处我就不多介绍了&#xff09; QMainWidow带菜单栏的 QWidget空白的 QDialog对话框 创建功能时注意&#xff1a; 项目工程名称一般不要有标点&#xff0c;不要带中文 按钮 /…

计算机基础(Windows 10+Office 2016)教程 —— 第8章 多媒体技术及应用

多媒体技术及应用 8.1 多媒体技术的概述8.1.1 多媒体技术的定义和特点8.1.2  多媒体的关键技术8.1.3 多媒体技术的发展趋势8.1.4 多媒体文件格式的转换8.1.5 多媒体技术的应用 8.2 多媒体计算机系统的构成8.2.1 多媒体计算机系统的硬件系统8.2.2 多媒体计算机系统的软件系统…

Python教程(十一):单元测试与异常捕获

目录 专栏列表前言一、Python中的测试1.1 单元测试1.1.1 定义测试类1.2.1 安装 pytest1.2.2 编写测试1.2.3 运行测试 二、Python中的异常捕获2.1 常规代码2.2 异常基础 三、抛出异常&#xff08;异常传播&#xff09;四、 自定义异常 专栏列表 Python教程&#xff08;一&#…

赛蓝企业管理系统 AuthToken/Index 身份认证绕过漏洞复现

0x01 产品简介 赛蓝企业管理系统是一款为企业提供全面管理解决方案的软件系统&#xff0c;它能够帮助企业实现精细化管理&#xff0c;提高效率&#xff0c;降低成本。系统集成了多种管理功能&#xff0c;包括但不限于项目管理、财务管理、采购管理、销售管理以及报表分析等&am…

【WPF开发】如何将工程打包成单独的EXE安装包

一、安装NSIS与HM NIS Edit 1、下载和安装NSIS NSIS官网 2、下载和安装HM NIS Edit HM NIS Edit官网 点击下载后等待几秒&#xff0c;就会弹出下载提示 双击下载的安装包&#xff0c;点击“OK” 点击“下一步” 点击“我接受” 更改路径后&#xff0c;点击安装即可 二、打包软…

SpringSecurity-1(认证和授权+SpringSecurity入门案例+自定义认证+数据库认证)

SpringSecurity 1 初识权限管理1.1 权限管理的概念1.2 权限管理的三个对象1.3 什么是SpringSecurity 2 SpringSecurity第一个入门程序2.1 SpringSecurity需要的依赖2.2 创建web工程2.2.1 使用maven构建web项目2.2.2 配置web.xml2.2.3 创建springSecurity.xml2.2.4 加载springSe…

【leetcode详解】寻找两个正序数组的中位数:最简单的【困难】题?

简评&#xff1a; 可以说&#xff0c;要做出来这道题&#xff0c;实际上是非常简单的 //这也是笔者目前唯一解出来的唯一一道【困难】题哈哈哈哈 思路解析&#xff1a; 将两个向量合并 class Solution { public:double findMedianSortedArrays(vector<int>& nums1…

c# MetroForm 和 IntPtr unsafe

一、NuGet安装框架 修改代码 效果&#xff1a; 结果&#xff1a; TopLevel与TopMost属性 frm.TopLevel false; //Form.TopLevel 获取或设置一个值&#xff0c;该值指示是否将窗体显示为顶级窗口。frm.TopMost false; //Form.TopMost 获取或设置一个值&#xff0c;指示该窗体…

嵌入式人工智能(43-基于树莓派4B的刷卡模块射频识别RFID-RC522)

1、RFID 射频识别&#xff08;RFID&#xff0c;Radio Frequency Identification&#xff09;是一种无线通信技术&#xff0c;用于自动识别和追踪标签上的信息。这项技术基于射频信号的传输和接收&#xff0c;通过将标签上的数据存储在特定的芯片中&#xff0c;实现物体的识别和…

上市公司绿色信息披露质量评分数据(2008-2023年)

数据来源&#xff1a;基础数据来源于上市公司年报/社会责任报告/环境报告以及ZJ会及统计局 时间跨度&#xff1a;2008-2023年 数据范围&#xff1a;企业及行业层面 数据指标&#xff1a; 按照是否货币化分类企业对于环境信息的披露:对于货币化的信息&#xff0c;定量和定性…

共襄恰青赛马节盛事 共享农业产业园成果

恰青赛马节是那曲一年一度的草原盛事&#xff0c;是藏北规模盛大的传统节日&#xff0c;承载着那曲悠久的文化底蕴&#xff0c;体现了藏北各族群众丰富的传统习俗&#xff0c;更是深受民众欢迎。今年的赛马节上&#xff0c;色尼区国家现代农业产业园紧抓机遇&#xff0c;设置农…

Android设备发送蓝牙文件到电脑笔记本失败解决

Android设备发送蓝牙文件到电脑笔记本失败解决 文章目录 Android设备发送蓝牙文件到电脑笔记本失败解决一、前言二、解决1、比较旧的电脑2、大部分新的电脑 三、其他1、发送蓝牙文件到Window电脑端小结2、可传输的蓝牙文件的文件类型 一、前言 普通手机之间蓝牙配对后&#xf…

软件测试开发

软件测试的职业发展 起点&#xff1a;功能测试 走管理 业务专家行业业务专家行业业务发展专家 走技术 测试开发资深测试开发测试架构师/全栈测试工程师 软件开发模型 瀑布模型 V模型和W模型 W模型和V模型都把软件的开发视为需求&#xff0c;设计&#xff0c;编码&#x…

SolarMarker 正在使用水坑攻击与伪造的 Chrome 浏览器更新进行攻击

在过去的三个月里&#xff0c;eSentire 的安全研究团队发现信息窃密恶意软件 SolarMarker 都没有发动攻击&#xff0c;却在最近忽然重返舞台。此前&#xff0c;SolarMarker 的运营者使用 SEO 投毒或者垃圾邮件来引诱受害者&#xff0c;受害者试图下载一些文档的免费模板&#x…

非对称加密:数据安全的双重保障

&#x1f90d; 前端开发工程师、技术日更博主、已过CET6 &#x1f368; 阿珊和她的猫_CSDN博客专家、23年度博客之星前端领域TOP1 &#x1f560; 牛客高级专题作者、打造专栏《前端面试必备》 、《2024面试高频手撕题》 &#x1f35a; 蓝桥云课签约作者、上架课程《Vue.js 和 E…

每日OJ_牛客HJ73 计算日期到天数转换

目录 牛客HJ73 计算日期到天数转换 解析代码 牛客HJ73 计算日期到天数转换 计算日期到天数转换_牛客题霸_牛客网 解析代码 用一个数组存放每月的累积天数输入的日期天数 当月的天数 当月之前的累积天数&#xff0c;如果包含二月&#xff0c;再去判断是否为闰年&#xff0c;…