JavaScript中的数据类型转换方法小结


Posted in Javascript onOctober 26, 2015

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

  • 通过使用 JavaScript 函数
  • 通过 JavaScript 自身自动转换

将数字转换为字符串

全局方法 String() 可以将数字转换为字符串。
该方法可用于任何类型的数字,字母,变量,表达式:
实例

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

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

x.toString()
(123).toString()
(100 + 23).toString()

将布尔值转换为字符串

全局方法 String() 可以将布尔值转换为字符串。
String(false)    // 返回 "false"
String(true)     // 返回 "true"
Boolean 方法 toString() 也有相同的效果。
false.toString()   // 返回 "false"
true.toString()   // 返回 "true"

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

String(Date())   // 返回 Thu Jul 17 2014 15:38:19 GMT+0200 (W. Europe Daylight Time)

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

Date().toString()  // 返回 Thu Jul 17 2014 15:38:19 GMT+0200 (W. Europe Daylight Time)

将字符串转换为数字
全局方法 Number() 可以将字符串转换为数字。
字符串包含数字(如 "3.14") 转换为数字 (如 3.14).
空字符串转换为 0。
其他的字符串会转换为 NaN (不是个数字)。

Number("3.14")  // 返回 3.14
Number(" ")    // 返回 0 
Number("")    // 返回 0
Number("99 88")  // 返回 NaN

一元运算符 +
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

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

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

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

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

自动转换类型 Type Conversion
当 JavaScript 尝试操作一个 "错误" 的数据类型时,会自动转换为 "正确" 的数据类型。
以下输出结果不是你所期望的:

5 + null  // 返回 5     because null is converted to 0
"5" + null // 返回"5null"  because null is converted to "null"
"5" + 1   // 返回 "51"   because 1 is converted to "1" 
"5" - 1   // 返回 4     because "5" is converted to 5

自动转换为字符串
当你尝试输出一个对象或一个变量时 JavaScript 会自动调用变量的 toString() 方法:

document.getElementById("demo").innerHTML = myVar;

// if myVar = {name:"Fjohn"} // toString 转换为 "[object Object]"
// if myVar = [1,2,3,4]    // toString 转换为 "1,2,3,4"
// if myVar = new Date()   // toString 转换为 "Fri Jul 18 2014 09:08:55 GMT+0200"

数字和布尔值也经常相互转换:

// if myVar = 123       // toString 转换为 "123"
// if myVar = true      // toString 转换为 "true"
// if myVar = false      // toString 转换为 "false"
Javascript 相关文章推荐
javascript 显示当前系统时间代码
Dec 28 Javascript
关于Jqzoom的使用心得 jquery放大镜效果插件
Apr 12 Javascript
基于jQuery的合并表格中相同文本的相邻单元格的代码
Apr 06 Javascript
javascript确认框的三种使用方法
Dec 17 Javascript
jQuery实现响应浏览器缩放大小并改变背景颜色
Oct 31 Javascript
javascript获取当前的时间戳的方法汇总
Jul 26 Javascript
jquery彩色投票进度条简单实例演示
Jul 23 Javascript
Bootstrap所支持的表单控件实例详解
May 16 Javascript
快速入门Vue
Dec 19 Javascript
Vue.directive自定义指令的使用详解
Mar 10 Javascript
解决vue 项目引入字体图标报错、不显示等问题
Sep 01 Javascript
微信小程序激励式视频广告组件使用详解
Dec 06 Javascript
如何实现JavaScript动态加载CSS和JS文件
Dec 28 #Javascript
基于javascript实现漂亮的页面过渡动画效果附源码下载
Oct 26 #Javascript
JS实现的页面自定义滚动条效果
Oct 26 #Javascript
JS实现的鼠标跟随代码(卡通手型点击效果)
Oct 26 #Javascript
JS响应鼠标点击实现两个滑块区间拖动效果
Oct 26 #Javascript
javaScript实现可缩放的显示区效果代码
Oct 26 #Javascript
JS基于VML技术实现的五角星礼花效果代码
Oct 26 #Javascript
You might like
无线电广播的开始
2002/01/30 无线电
浅析php如何实现App常用的秒发功能
2016/08/03 PHP
PHP文件上传、客户端和服务器端加限制、抓取错误信息、完整步骤解析
2017/01/12 PHP
源码分析 Laravel 重复执行同一个队列任务的原因
2017/12/25 PHP
浏览器无法运行JAVA脚本的解决方法
2008/01/09 Javascript
jqPlot jquery的页面图表绘制工具
2009/07/25 Javascript
Javascript中定义方法的另类写法(批量定义js对象的方法)
2011/02/25 Javascript
基于jQuery的可用于选项卡及幻灯的切换插件
2011/03/28 Javascript
jQuery中用dom操作替代正则表达式
2014/12/29 Javascript
javascript操作符"!~"详解
2015/02/10 Javascript
基于jquery实现省市联动效果
2015/11/23 Javascript
JavaScript中实现无缝滚动、分享到侧边栏实例代码
2016/04/06 Javascript
详解使用Visual Studio Code对Node.js进行断点调试
2017/09/14 Javascript
微信小程序结合Storage实现搜索历史效果
2019/05/18 Javascript
解决Antd 里面的select 选择框联动触发的问题
2020/10/24 Javascript
vue添加自定义右键菜单的完整实例
2020/12/08 Vue.js
Python中对元组和列表按条件进行排序的方法示例
2015/11/10 Python
Python上下文管理器和with块详解
2017/09/09 Python
PyQt5每天必学之进度条效果
2018/04/19 Python
Python项目 基于Scapy实现SYN泛洪攻击的方法
2019/07/23 Python
Python函数参数类型及排序原理总结
2019/12/19 Python
pytorch下的unsqueeze和squeeze的用法说明
2021/02/06 Python
CSS3中31种选择器使用方法教程
2013/12/05 HTML / CSS
Html5 Canvas实现图片标记、缩放、移动和保存历史状态功能 (附转换公式)
2020/03/18 HTML / CSS
MYSQL支持事务吗
2013/08/09 面试题
农救科工作职责
2013/11/27 职场文书
校园新闻广播稿
2014/01/10 职场文书
校园创业策划书
2014/01/14 职场文书
婚礼新郎父母答谢词
2014/01/16 职场文书
党支部创先争优活动总结
2014/08/28 职场文书
见习报告的格式
2014/10/31 职场文书
学生个人总结范文
2015/02/15 职场文书
2015年营销工作总结范文
2015/04/23 职场文书
2019个人工作计划书的格式及范文!
2019/07/04 职场文书
分析MySQL抛出异常的几种常见解决方式
2021/05/18 MySQL
配置Kubernetes外网访问集群
2022/03/31 Servers