JavaScript (十四)——JavaScript typeof和类型转换

news2024/12/27 16:04:13

目录

JavaScript typeof, null, 和 undefined

typeof 操作符

null

undefined

undefined 和 null 的区别

JavaScript 类型转换

JavaScript 数据类型

JavaScript 类型转换

将数字转换为字符串

将布尔值转换为字符串

将日期转换为字符串

将字符串转换为数字

一元运算符 +

将布尔值转换为数字

将日期转换为数字

自动转换类型

自动转换为字符串


JavaScript typeof, null, 和 undefined

typeof 操作符

可以使用 typeof 操作符来检测变量的数据类型。

示例:

typeof "John"                // 返回 string 
typeof 3.14                  // 返回 number
typeof false                 // 返回 boolean
typeof [1,2,3,4]             // 返回 object
typeof {name:'John', age:34} // 返回 object
 在JavaScript中,数组是一种特殊的对象类型

null

在 JavaScript 中 null 表示 "什么都没有"。

null是一个只有一个值的特殊类型。表示一个空对象引用。

用 typeof 检测 null 返回是object。

可以设置为 null 来清空对象

示例:

<body>
    <p id="demo"></p>
    <p id="demo2"></p>
    <script>
    var x = 10;
    var x=null;
    document.getElementById("demo2").innerHTML = x ;
    document.getElementById("demo").innerHTML = typeof x;
    </script>
</body>

运行结果:

undefined

在 JavaScript 中, undefined 是一个没有设置值的变量。

typeof 一个没有值的变量会返回 undefined

var person;                  // 值为 undefined(空), 类型是undefined

任何变量都可以通过设置值为 undefined 来清空。 类型为 undefined.

person = undefined;          // 值为 undefined,  类型是undefined

undefined 和 null 的区别

null 和 undefined 的值相等,但类型不等

  • undefined:表示未定义,即变量已经声明了,但是还没有被赋予任何值。这通常发生在变量被声明了但没有显式地给其赋值,或者函数没有返回值时默认返回的情况。在内存中,这个变量可能并不存在一个具体的值或地址。
  • null:表示空值或空引用。它用于表示某个变量或对象是“无”或“空”的状态。与undefined不同,null是明确地被赋予了这样一个特殊的空值。
  • 使用typeof操作符检测时,undefined的类型是"undefined"
  • 尽管直觉上null应该表示没有值,但typeof null的结果却是"object"。这是因为JavaScript最初的设计缺陷,历史上null被认为是一个空的对象引用。
  • 当尝试将undefined转换为数值时,结果是NaN(Not-a-Number)。
  • 而将null转换为数值时,结果是0
  • undefined 主要用于以下几种情况:
    • 变量被声明了但没有被赋值。
    • 调用函数时,如果应该传入参数但没有传入,该参数在函数内部就是undefined
    • 函数没有明确返回值时,默认返回undefined
  • null 则常用于以下几种情况:
    • 表示某个变量或对象当前是“空”的或“没有值”的。
    • 作为函数的参数,明确表示该参数不是对象或不需要传入对象。
    • 在对象原型链的末端,表示没有更进一步的原型。
  • null 是JavaScript的一个关键字,不能用作变量名或函数名。
  • undefined 虽然不是关键字,但它在全局作用域中默认是undefined,且在某些环境中(如浏览器)其值是不可变的。然而,在ECMAScript 5(ES5)及以后的版本中,可以通过某些方式(如使用严格模式)来避免全局undefined被覆盖。

JavaScript 类型转换

Number() 转换为数字, String() 转换为字符串, Boolean() 转换为布尔值。

JavaScript 数据类型

NaN 的数据类型是 number

数组(Array)的数据类型是 object

日期(Date)的数据类型为 object

null 的数据类型是 object

未定义变量的数据类型为 undefined

如果对象是 JavaScript Array 或 JavaScript Date ,我们就无法通过 typeof 来判断他们的类型,因为都是 返回 object。

JavaScript 类型转换

JavaScript 变量可以转换为新变量或其他数据类型:

通过使用 JavaScript 函数

将数字转换为字符串

全局方法 String() 可以将数字转换为字符串。

该方法可用于任何类型的数字,字母,变量,表达式:

String(x)         // 将变量 x 转换为字符串并返回
	String(123)       // 将数字 123 转换为字符串并返回
	String(100 + 23)  // 将数字表达式转换为字符串并返回

Number 方法 toString() 也是有同样的效果。

x.toString()(123).toString()(100 + 23).toString()
方法描述
toExponential()把对象的值转换为指数计数法。
toFixed()把数字转换为字符串,结果的小数点后有指定位数的数字。
toPrecision()把数字格式化为指定的长度。

将布尔值转换为字符串

全局方法 String() 可以将布尔值转换为字符串。

String(false)        // 返回 "false"
String(true)         // 返回 "true"

Boolean 方法 toString() 也有相同的效果。

false.toString()     // 返回 "false"
true.toString()      // 返回 "true"

将日期转换为字符串

Date() 返回字符串

全局方法 String() 可以将日期对象转换为字符串。

Date 方法 toString() 也有相同的效果。

方法描述
getDate()从 Date 对象返回一个月中的某一天 (1 ~ 31)。
getDay()从 Date 对象返回一周中的某一天 (0 ~ 6)。
getFullYear()从 Date 对象以四位数字返回年份。
getHours()返回 Date 对象的小时 (0 ~ 23)。
getMilliseconds()返回 Date 对象的毫秒(0 ~ 999)。
getMinutes()返回 Date 对象的分钟 (0 ~ 59)。
getMonth()从 Date 对象返回月份 (0 ~ 11)。
getSeconds()返回 Date 对象的秒数 (0 ~ 59)。
getTime()返回 1970 年 1 月 1 日至今的毫秒数。

将字符串转换为数字

全局方法 Number() 可以将字符串转换为数字。

字符串包含数字(如 "3.14") 转换为数字 (如 3.14).

空字符串转换为 0。

其他的字符串会转换为 NaN (不是个数字)。

Number("3.14")    // 返回 3.14
Number(" ")       // 返回 0 
Number("")        	// 返回 0
Number("99 88")   // 返回 NaN
方法描述
parseFloat()解析一个字符串,并返回一个浮点数。
parseInt()

解析一个字符串,并返回一个整数。

一元运算符 +

Operator + 可用于将变量转换为数字:

var y = "5";     
// y 是一个字符串
var x = + y;      
// x 是一个数字

如果变量不能转换,它仍然会是一个数字,但值为 NaN (不是一个数字)

var y = "John";  
// y 是一个字符串
var x = + y;      // x 是一个数字 (NaN)

将布尔值转换为数字

全局方法 Number() 可将布尔值转换为数字。

Number(false)     // 返回 0
Number(true)      // 返回 1

将日期转换为数字

全局方法 Number() 可将日期转换为数字。

d = new Date();Number(d)          // 返回 1404568027739

日期方法 getTime() 也有相同的效果。

d = new Date();d.getTime()        // 返回 1404568027739

自动转换类型

当 JavaScript 尝试操作一个 "错误" 的数据类型时,会自动转换为 "正确" 的数据类型。

5 + null    // 返回 5         
 null 转换为 0
"5" + null  // 返回"5null"   
	 null 转换为 "null"
"5" + 1     // 返回 "51"      
 1 转换为 "1"  
"5" - 1     // 返回 4         
 "5" 转换为 5

自动转换为字符串

当尝试输出一个对象或一个变量时 JavaScript 会自动调用变量的 toString() 方法

document.getElementById("demo").innerHTML = myVar;
myVar = {name:"Fjohn"}  // toString 转换为 "[object Object]"
myVar = [1,2,3,4]       // toString 转换为 "1,2,3,4"

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

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

相关文章

新浪微博笔试秋招管培笔试测评肯耐珂萨题型题库解析

新浪微博的笔试是该公司用于筛选潜在候选人的重要环节&#xff0c;主要目的在于评估应聘者的逻辑推理、图表计算和文字理解能力。以下是新浪微博笔试题型的详细解析&#xff1a; 1. 逻辑推理 - **题型概述**&#xff1a;逻辑推理部分通常包含20题&#xff0c;考察应试者的逻…

算法板子:树形DP、树的DFS——树的重心

思想&#xff1a; 代码&#xff1a; #include <iostream> #include <cstring> using namespace std;const int N 1e5 10;// vis标记当前节点是否被访问过; vis[1]true代表编号为1的节点被访问过 bool vis[N]; // h数组为邻接表; h数组上的每个坑位都串了一个单链…

商业购物中心开业活动方案怎么写?附230个案例

商业购物中心开业活动方案的撰写是一个综合性的过程&#xff0c;需要结合购物中心的特点、目标消费群体、市场环境以及活动目的等多方面因素进行考虑。 以下是一个详细的撰写指南&#xff0c;带你一步步了解如何撰写一个成功的商业购物中心开业活动方案。 码字不易&#xff0…

处理kkFileView的com.aspose:aspose-cad:iar:23.9 not found 问题

背景: 一款很强大的开源的文件预览工具包下载地址:aspose-cad-23.9.jar 启动成功界面: 一、.问题描述:com.aspose:aspose-cad:iar:23.9 not found 处理方案:直接下载aspose-cad-23.9.jar 安装到本地 二、处理步骤(win环境):1.安装maven 下载地址:https://maven.apach…

CSP-J 复赛 模拟题

1.生产计划&#xff1a; 样例 #1 样例输入 #1 2 4 5 6 12 1 3 6 15 8 1 3 100 3 200 4 300 6 100 样例输出 #1 YES NO 2.分组和为3&#xff1a; 样 例 # 1 样 例 输 入 # 1 5 1 1 1 2 1 样 例 输 出 # 1 2 样 例 # 2 样 例 输 入 # 2 7 2 2 1 1 2 1 1 样 例 输 出 # …

2024最简七步完成 将本地项目提交到github仓库方法

2024最简七步完成 将本地项目提交到github仓库方法 文章目录 2024最简七步完成 将本地项目提交到github仓库方法一、前言二、具体步骤1、github仓库创建2、将远程仓库拉取并合并&#xff08;1&#xff09;初始化本地仓库&#xff08;2&#xff09;本地仓库与Github仓库关联&…

Linux驱动开发—并发与竞争,原子操作,自旋锁,信号量详解

1.并发与并行的概念 并发是指在同一时间段内&#xff0c;多个任务交替执行。并发可以发生在单核处理器上&#xff0c;通过任务切换实现 并行是指在同一时间段内&#xff0c;多个任务同时执行。并行可以发生在多核处理器上&#xff0c;例如下图任务1 和任务3同时进行&#xff0…

JAVA基础知识点3 (String 和 StringBuffer 以及 StringBuilder 的特点以及区别)

1&#xff0c;String 和 StringBuffer 以及 StringBuilder 的特点 &#xff08;1&#xff09;String的特点&#xff1a;String是final修饰的字符序列是不可改变的&#xff0c; 是字符串常量&#xff0c;一旦初始化就不可以被更改,因此是线程安全的 因为是常量每次对其操作都会…

C++必修:STL之vector的模拟实现

✨✨ 欢迎大家来到贝蒂大讲堂✨✨ &#x1f388;&#x1f388;养成好习惯&#xff0c;先赞后看哦~&#x1f388;&#x1f388; 所属专栏&#xff1a;C学习 贝蒂的主页&#xff1a;Betty’s blog 为了让我们更加深入理解vector&#xff0c;接下来我们将模拟实现一个简易版的vect…

龙迅#LT8918适用于TTL/LVDS转MIPIDSI/CSI应用方案,分辨率高达1080P@60HZ,可提供技术支持!

1. 描述 Lontium LT8918 是一款高性能 MIPIDSI/CSI-2 发射器&#xff0c;适用于移动显示面板或相机应用。 LT8918 的 TTL 输入在 SDR 或 DDR 采样下支持 24 位 RGB 和 BT656/1120 视频格式。最大输入像素时钟频率为 SDR 148.5MHz 或 DDR 74.25MHz&#xff0c;适用于1080P60Hz高…

PCL从理解到应用【08】 点云特征 | 法线估计 | 主曲率估计

前言 在PCL中&#xff0c;有多种方法和函数可以用来提取点云特征&#xff0c;本文介绍几何特征。 其中&#xff0c;几何特征主要包括法线估计和主曲率估计。 这些特征能够描述点云表面的几何形状&#xff0c;常用于进一步的点云处理和分析&#xff0c;如配准、分割和物体识别…

为什么 Kubernetes 是现代开发的必备工具

引言 在现代软件开发中&#xff0c;容器已经成为打包和运行应用程序的标准方式。然而&#xff0c;在生产环境中&#xff0c;管理这些运行中的容器并确保服务的高可用性和稳定性并不是一件容易的事。比如&#xff0c;当一个容器发生故障时&#xff0c;需要快速启动另一个容器来代…

C++ std::atomic和std::mutex

C11 引入了两个重要的同步机制用于多线程编程&#xff1a;std::atomic 和 std::mutex。它们各自适用于不同的并发控制需求&#xff0c;并在实现和使用上有很大的不同。 1. 目的和用途 std::atomic: 设计目的&#xff1a;为原子操作提供支持&#xff0c;保证对变量的操作&#…

Python试讲

Python试讲 导语Python简介Python及其特点如何使用Python Python与计算计算变量 导语 本次试讲内容如下&#xff1a;Python简介与使用&#xff0c;Python与基本运算 辅助教材为 《趣学Python编程》和《Python编程从入门到实践》 Python简介 Python是目前入门最简单最好学的…

FVM安装及配置

一、下载fvm 包 git&#xff1a;Release fvm 3.1.7 leoafarias/fvm GitHub 解压到本地文件夹&#xff0c;然后添加环境变量 管理员模式打开cmd&#xff0c;查看是否成功 fvm --version 二、安装Dart SDK 下载Dart SDK&#xff1a;Dart for Windows 三、安装GIT 四、指定…

python3.10安装geopandans实战笔记

1.geopandans安装所需软件库版本 python3.10 GDAL-3.4.3-cp310-cp310-win_amd64.whl【手动下载】 Fiona-1.8.21-cp310-cp310-win_amd64.whl【手动下载】 shapely-2.0.2-cp310-cp310-win_amd64.whl【手动下载】 pyproj 手动下载地址&#xff1a;https://download.csdn.net/down…

range和enumerate的区别

range通过索引遍历元素&#xff0c;属于间接访问。 enumerate直接遍历元素&#xff0c;效率稍高&#xff0c;代码简洁。range输出的是元素的索引。 enumerate输出的是元素的索引和元素。 参考&#xff1a;range与enumerate的区别_enumerate和range-CSDN博客

(一)springboot2.7.6集成activit5.23.0之集成引擎

集成引擎很简单。 首先是创建springboot项目然后引入相关依赖就完成了。pom.xml如下&#xff1a; <project xmlns"http://maven.apache.org/POM/4.0.0" xmlns:xsi"http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation"http://maven.…

鸿蒙应用框架开发【媒体库视频】 UI框架

媒体库视频 介绍 本示例使用Video组件展示了视频组件的基本功能&#xff0c;包括视频组件化&#xff0c;全屏化&#xff0c;窗口化&#xff0c;上下轮播视频等。 效果预览 使用说明&#xff1a; 进入首页点击播放按键&#xff1b;点击视频播放按钮&#xff0c;视频开始播放…

CTFHub技能树web——XSS——DOM反射

根据框里的内容 直接右键查看网页源代码 看到 了其闭合方式 然后去网页测试一下alert&#xff08;1&#xff09;反射 ;</script><script>alert(1)</script> 看到 确实存在 去xssaq.cn 创建一个项目 把src粘过来 在第一个输入框中 再将返回回来的url 复…