当前位置： 首页 > news >正文

JavaScript——数据类型、类型转换

news 2026/2/7 10:44:14

数据类型

计算机世界中的万事万物都是数据。

计算机程序可以处理大量的数据，为什么要给数据分类?

  • 更加充分和高效的利用内存
  • 也更加方便程序员的使用数据

基本数据类型

number 数字型

  • JavaScript中正数、负数、小数等统一称为number
    • JS是弱数据类型，变量到底属于哪种类型，只有赋值之后，才能确定
    • Java是强数据类型，例如： int a = 3，必须是整数
    • 可以进行+、-、*、/、%的运算
      • *、/、%的优先级相同

NaN

代表一个计算错误。它是一个不正确的或者一个未定义的数字操作所得到的结果

console.log("good" - 2) //输出：NaN

NaN是粘性的。任何对NaN的操作都会返回NaN

console.log(NaN+2) // 输出：NaN

甚至两个NaN都不相等

console.log(NaN === NaN) // 输出：false

string 字符串型

通过单引号(")、双引号（"")或反引号(`)包裹的数据都叫字符串，单引号和双引号没有本质上的区别，推荐使用单引号。

string 字符串型

通过单引号(")、双引号（"")或反引号(`)包裹的数据都叫字符串，单引号和双引号没有本质上的区别，推荐使用单引号。

模板字符串

使用场景

  • 拼接字符串和变量
  • 在没有它之前，要拼接变量比较麻烦

语法

  • ··（反引号）
  • 内容拼接变量时，用${}包住变量

boolean 布尔型

只有两个值：true和false

undefined 未定义型

未定义是比较特殊的类型，只有一个值undefined。

什么情况出现未定义类型?

只声明变量，不赋值的情况下，变量的默认值为undefined，一般很少【直接】为某个变量赋值为undefined。

let num
console.log(num)

开发场景

我们开发中经常声明一个变量，等待传送过来的数据。

如果我们不知道这个数据是否传递过来，此时我们可以通过检测这个变量是不是undefined，就判断用户是否有数据传递过来。

null 空类型

    let obj = nullconfirm.log(obj)

引用数字类型

object 对象

检测数据类型

通过typeof关键字检测数据类型

typeof运算符可以返回被检测的数据类型。它支持两种语法形式:

1.作为运算符: typeof x（常用的写法)

2.函数形式: typeof(x)

换言之，有括号和没有括号，得到的结果是一样的，所以我们直接使用运算符的写法。

let obj = null
console.log(typeof obj) // object  
// 这是一个比较特殊的结果

类型转换

隐式转换

某些运算符被执行时，系统内部自动将数据类型进行转换，这种转换称为隐式转换。

规则:

  • ＋号两边只要有一个是字符串，都会把另外一个转成字符串
  • 除了+以外的算术运算符，比如–、*、/等都会把数据转成数字类型

缺点:

  • 转换类型不明确，靠经验才能总结

小技巧:

  • +号作为正号解析可以转换成数字型
  • 任何数据和字符串相加结果都是字符串
    console.log(2 + '2') // 22 stringconsole.log(2 - '2') // 0  numberconsole.log(+ '2')  // 把字符串类型转化为了数字型console.log(typeof + '2')  // 类型为数字型

显示转换

  • Number()
    • 把对象的值转换为数字，如果无法转换为数字，那么Number()函数返回NaN
  • parseInt()
    • 分析一个字符串，并且返回一个整数
  • parseFloat
    • 分析一个字符串，并且返回一个浮点数
    console.log(Number(str))// 1   显示转化// let age = Number(prompt('请输入你的年龄')) // 转化为数字型// 2   隐式转换let age = + prompt('请输入你的年龄')console.log(typeof age)console.log(parseInt('12ps')) // 只能取数字开头的字符串中的整数  12console.log(parseInt('13.12ps')) // 只能取数字开头的字符串中的整数  13console.log(parseInt('asd123dfa'))   // 结果为NaN//.................  console.log(parseFloat('12ps'))   // 12console.log(parseFloat('13.12ps'))  // 13.12console.log(parseFloat('asd123dfa'))   // 结果为NaN

操作实例

    let num1 = +prompt('请输入第一个数字:')let num2 = +prompt('请输入第二个数字:')alert(`两个数之和为:${num1 + num2}`)

综合案例

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>h2 {text-align: center;/*给字体为h2的设为中心对齐*/}table {/*合并边框*/border-collapse: collapse;/* 设置每个表格的高度为80px */height: 80px;/* 设置表格中的数据都居中对齐 */text-align: center;/* 让块元素水平剧中 */margin: 0 auto;}th {/* 设置表头单元格的左右边宽距 */padding: 5px 30px;/* padding: 10px 5px 15px 20px;上填充是 10px 右填充是 5px 下填充是 15px 左填充是 20px 顺时针的 padding: 10px 5px 15px;上填充是 10px 右填充和左填充是 5px 下填充是 15px padding: 10px 5px;上填充和下填充是 10px 右填充和左填充是 5px padding: 10px;所有四个填充都是 10px */}table,th,td {border: 1px solid #000/*solid定义实现边框*/}</style>
</head><body><h2>订单付款确认</h2><!-- 下面这个表达式的快捷键为:table>tr>th*5  --><!--tr  table row 表示表格的一行td table data 表示表格的数据单元格th table header 表示表格的表头单元格--><script>// 1 用户输入let price = +prompt('请输入商品价格：')let num = +prompt('请输入商品数量：')let address = prompt('请输入收货地址：')// 2 计算总额let total = price * num// 3 页面打印document.write(`<table><tr><th>商品名称</th><th>商品价格</th><th>商品数量</th><th>总价</th><th>收货地址</th></tr><tr><td>HUAWEI Mate 60 Pro</td><td>${price}元</td><td>${num}</td><td>${total}元</td><td>${address}</td></tr></table>`)</script>
</body></html>

相关文章：

JavaScript——数据类型、类型转换

数据类型 计算机世界中的万事万物都是数据。 计算机程序可以处理大量的数据&#xff0c;为什么要给数据分类? 更加充分和高效的利用内存也更加方便程序员的使用数据 基本数据类型 number 数字型 JavaScript中正数、负数、小数等统一称为number JS是弱数据类型&#xff0…...

编程日记 2023/10/9 12:18:50

C位操作符

目录 一、位操作符 1.位与& 2.位或| 3.位取反~ 4.位异或^ 5.位与&#xff0c;位或&#xff0c;位异或的特点总结 6.左移位《《 右移位 》》 二、位与&#xff0c;位或&#xff0c;位异或在操作寄存器时的特殊作用 1.寄存器操作的要求&#xff08;特定位改变而不…...

编程日记 2023/10/9 12:17:49

【linux进程(三)】进程有哪些状态?--Linux下常见的三种进程状态

&#x1f493;博主CSDN主页:杭电码农-NEO&#x1f493;   ⏩专栏分类:Linux从入门到精通⏪   &#x1f69a;代码仓库:NEO的学习日记&#x1f69a;   &#x1f339;关注我&#x1faf5;带你学更多操作系统知识   &#x1f51d;&#x1f51d; Linux进程 1. 前言2. 操作系统…...

编程日记 2023/10/9 12:16:48

numString.charAt(i) - ‘0‘

numString.charAt(i) 表示获取字符串 numString 中第 i 个字符&#xff0c;这里假设该字符是数字 0 到 9 之间的一个字符。 0 是字符常量&#xff0c;表示数字 0 对应的字符。例如&#xff0c;字符 0 转换成数字就是 0&#xff0c;字符 1 转换成数字就是 1&#xff0c;以此类推…...

编程日记 2023/10/9 12:15:47

《Python 自动化办公应用大全》书籍推荐（包邮送书五本）

前言 随着科技的快速发展和智能化办公的需求增加&#xff0c;Python自动化办公成为了一种趋势。Python作为一种高级编程语言&#xff0c;具有简单易学、功能强大和开放源代码等优势&#xff0c;可以帮助我们更高效地完成日常办公任务。 Python自动化办公还可以帮助我们实现更…...

编程日记 2023/10/9 12:13:45

day57:ARMday4，程序状态寄存器读写指令、软中断指令、C和汇编的混合编程、开发板介绍

思维导图&#xff1a;有道云笔记...

编程日记 2023/10/9 12:12:44

el-cascader

场景&#xff1a; el-cascader lazy multiple 反显数据 非lazy的场景 selecetedOptions2: [[1, 2, 3],[1, 2, 4], ],可以正常回显&#xff1b;> ok lazy场景下&#xff1a; 是不可以回显的… 如果el-cascader是异步的单选 cascader默认会加载下个层级的&#xff08;子…...

编程日记 2023/10/9 12:11:43

图论第3天----第841题、第463题

# 图论第3天----第841题、第463题 文章目录 一、第841题--钥匙和房间二、第463题--岛屿的周长 ​ 又继续开始修行&#xff0c;把图论这块补上&#xff0c;估计要个5-6天时间。 一、第841题–钥匙和房间 ​ 有向图的遍历。dfs遍历3部曲做&#xff0c;思路也较顺----访问过的&a…...

编程日记 2023/10/9 12:08:40

软件测试/测试开发丨利用ChatGPT 生成自动化测试脚本

点此获取更多相关资料 简介 自动化测试脚本可以模拟用户与应用程序的交互&#xff0c;例如点击按钮、输入数据、导航到不同的页面等等&#xff0c;以验证应用程序的正确性、性能和稳定性。 自动化测试在回归测试、冒烟测试等测试流程中都可以极大地起到节省时间、节省人力的作…...

编程日记 2023/10/9 12:07:39

3.3.OpenCV技能树--二值图像处理--图像形态学操作

文章目录 1.图像形态学运算简介2.图像开运算处理2.1.图像开运算处理简介2.2.图像开运算处理代码2.3.图像开运算处理效果 3.图像闭运算处理3.1.图像闭运算处理简介3.2.图像闭运算处理代码3.3.图像闭运算处理效果 4.图像形态学梯度处理4.1.图像形态学梯度处理简介4.2.图像形态学梯…...

编程日记 2023/10/9 12:06:38

这15个海运提单的雷区 你知道吗？

海运提单中英文对照 海运提单主要项目填制说明 1、托运人(Shipper)&#xff1a;即与承运人签订运输契约&#xff0c;委托运输的货主&#xff0c;即发货人。在信用证支付方式下&#xff0c;一般以受益人为托运人;托收方式以托收的委托人为托运人。另外&#xff0c;根据《UCP500》…...

编程日记 2023/10/9 12:05:37

几道web题目

总结几道国庆写的web题目 [ACTF2020 新生赛]Include1 点进去发现就一个flag.php,源代码和抓包都没拿到好东西 结合题目猜是文件包含&#xff0c;构建payload ?filephp://filter/readconvert.base64-encode/resourceflag.php 得到base64编码过的flag&#xff0c;解码即可 此题…...

编程日记 2023/10/9 12:04:36

API接口大全分享，含短信API、IP查询API。。。

免费API接口大全分享&#xff0c;含短信API、IP查询API等。。。 语音验证码短信&#xff1a;拨打电话告知用户验证码&#xff0c;实现信息验证。短信验证码&#xff1a;可用于登录、注册、找回密码、支付认证等等应用场景。支持三大运营商&#xff0c;3秒可达&#xff0c;99.9…...

编程日记 2023/10/9 12:03:35

记录一次springboot使用定时任务中@Async没有生效的场景

环境说明 jdk21springboot 3.0.11 springcloud 2022.0.0 spring-cloud-alibaba 2022.0.0.0 在开发一个定时触发的任务的时候&#xff0c;由于开发执行任务的函数比较耗费时间&#xff0c;所以采用异步解决问题。 发现并没有按照预期的触发 经询问后&#xff0c;发现当前类的…...

编程日记 2023/10/9 12:02:34

腾讯云/阿里云国际站免费账号：腾讯云国际站如何对象存储cos设置防盗链

简介 为了避免恶意程序使用资源 URL 盗刷公网流量或使用恶意手法盗用资源&#xff0c;腾讯云国际站给用户带来不必要的损失。腾讯云对象存储支持防盗链配置&#xff0c;建议您通过控制台的防盗链设置配置黑/白名单&#xff0c;来进行安全防护。 注意&#xff1a; 如果您访问对…...

编程日记 2023/10/9 12:01:33

python编程：使用 Pillow 将照片转换为1寸报名照片

引言&#xff1a; 在现代科技时代&#xff0c;我们经常需要调整和处理照片以适应特定的需求和用途。本文将介绍如何使用 wxPython 和 Pillow 库&#xff0c;通过一个简单的图形界面程序&#xff0c;将选择的照片转换为指定尺寸的 JPG 格式&#xff0c;并保存在桌面上。 C:\pyt…...

编程日记 2023/10/9 12:00:33

Aria2 for Mac (免HomeBrew)

Aria2 for Mac (免HomeBrew)-CSDN博客 之前搜索Aria2的安装方法&#xff0c;推荐的方法是使用HomeBrew安装。是&#xff0c;这个插件很省事&#xff0c;但启用条件是你安装了HomeBrew且运行起来需要再下十来个G的Xcode…… 这对急用的我非常不友好&#xff0c;当然&#xff0c…...

编程日记 2023/10/9 11:59:32

【Java】微服务——Gateway网关

目录 1.为什么需要网关2.gateway快速入门1&#xff09;创建gateway服务&#xff0c;引入依赖2&#xff09;编写启动类3&#xff09;编写基础配置和路由规则4&#xff09;重启测试5&#xff09;网关路由的流程图 3.3.断言工厂3.4.过滤器工厂3.4.1.路由过滤器的种类3.4.2.请求头过…...

编程日记 2023/10/9 11:58:31

大厂笔试汇总

大厂笔试 华为笔试汇总1.交易系统的降级策略（二分法）2.获取最多食物（树形DP）3.小王的密码本（哈希）4.每日股票价格（单调栈）5.中庸行者（回溯）输入描述输出描述6.数字序列比大小（贪心）输入描述输出描述7、快递中转站8、互通设备集字节跳动中兴笔试华为笔试汇总 1.交易…...

编程日记 2023/10/9 11:57:30

【数据结构】快排的详细讲解

目录&#xff1a; 介绍 一&#xff0c;递归快排确定基准值 二&#xff0c;递归遍历 三&#xff0c;非递归的快排 四&#xff0c;快排的效率 介绍 快排是排序算法中效率是比较高的&#xff0c;快排的基本思想是运用二分思想&#xff0c;与二叉树的前序遍历类似&#xff0c;…...

编程日记 2023/10/9 11:56:29

《Qt C++ 与 OpenCV：解锁视频播放程序设计的奥秘》

引言：探索视频播放程序设计之旅 在当今数字化时代，多媒体应用已渗透到我们生活的方方面面，从日常的视频娱乐到专业的视频监控、视频会议系统，视频播放程序作为多媒体应用的核心组成部分，扮演着至关重要的角色。无论是在个人电脑、移动设备还是智能电视等平台上，用户都期望…...

编程新知 2026/1/25 1:05:45

前端倒计时误差!

提示：记录工作中遇到的需求及解决办法 文章目录 前言一、误差从何而来？二、五大解决方案1. 动态校准法（基础版）2. Web Worker 计时3. 服务器时间同步4. Performance API 高精度计时5. 页面可见性API优化三、生产环境最佳实践四、终极解决方案架构前言 前几天听说公司某个项…...

编程新知 2025/9/8 23:14:43

ardupilot 开发环境eclipse 中import 缺少C++

目录 文章目录 目录摘要1.修复过程摘要 本节主要解决ardupilot 开发环境eclipse 中import 缺少C++，无法导入ardupilot代码，会引起查看不方便的问题。如下图所示 1.修复过程 0.安装ubuntu 软件中自带的eclipse 1.打开eclipse—Help—install new software 2.在 Work with中…...

编程新知 2026/1/31 5:06:34

让AI看见世界：MCP协议与服务器的工作原理

让AI看见世界&#xff1a;MCP协议与服务器的工作原理 MCP&#xff08;Model Context Protocol&#xff09;是一种创新的通信协议&#xff0c;旨在让大型语言模型能够安全、高效地与外部资源进行交互。在AI技术快速发展的今天&#xff0c;MCP正成为连接AI与现实世界的重要桥梁。…...

编程新知 2026/1/31 11:13:53

c#开发AI模型对话

AI模型 前面已经介绍了一般AI模型本地部署&#xff0c;直接调用现成的模型数据。这里主要讲述讲接口集成到我们自己的程序中使用方式。 微软提供了ML.NET来开发和使用AI模型&#xff0c;但是目前国内可能使用不多&#xff0c;至少实践例子很少看见。开发训练模型就不介绍了&am…...

编程新知 2026/2/1 8:59:45

【学习笔记】深入理解Java虚拟机学习笔记——第4章 虚拟机性能监控，故障处理工具

第2章 虚拟机性能监控&#xff0c;故障处理工具 4.1 概述 略 4.2 基础故障处理工具 4.2.1 jps:虚拟机进程状况工具 命令&#xff1a;jps [options] [hostid] 功能&#xff1a;本地虚拟机进程显示进程ID&#xff08;与ps相同&#xff09;&#xff0c;可同时显示主类&#x…...

编程新知 2026/1/15 1:34:10

Mobile ALOHA全身模仿学习

一、题目 Mobile ALOHA&#xff1a;通过低成本全身远程操作学习双手移动操作 传统模仿学习&#xff08;Imitation Learning&#xff09;缺点&#xff1a;聚焦与桌面操作&#xff0c;缺乏通用任务所需的移动性和灵活性 本论文优点&#xff1a;&#xff08;1&#xff09;在ALOHA…...

编程新知 2026/1/27 14:18:20

管理学院权限管理系统开发总结

文章目录 &#x1f393; 管理学院权限管理系统开发总结 - 现代化Web应用实践之路&#x1f4dd; 项目概述&#x1f3d7;️ 技术架构设计后端技术栈前端技术栈 &#x1f4a1; 核心功能特性1. 用户管理模块2. 权限管理系统3. 统计报表功能4. 用户体验优化 &#x1f5c4;️ 数据库设…...

编程新知 2026/1/24 6:30:25

vulnyx Blogger writeup

信息收集 arp-scan nmap 获取userFlag 上web看看 一个默认的页面&#xff0c;gobuster扫一下目录 可以看到扫出的目录中得到了一个有价值的目录/wordpress&#xff0c;说明目标所使用的cms是wordpress&#xff0c;访问http://192.168.43.213/wordpress/然后查看源码能看到 这…...

编程新知 2026/1/29 5:24:50

ZYNQ学习记录FPGA(一)ZYNQ简介

一、知识准备 1.一些术语,缩写和概念&#xff1a; 1&#xff09;ZYNQ全称&#xff1a;ZYNQ7000 All Pgrammable SoC 2&#xff09;SoC:system on chips(片上系统)&#xff0c;对比集成电路的SoB&#xff08;system on board&#xff09; 3&#xff09;ARM&#xff1a;处理器…...

编程新知 2026/2/5 9:30:45