JavaScript数据类型以及转换
一、数据类型
分类
基本(值)类型:
- String
- Number
- Boolean
- undefined
- unll
对象(引用)类型:
- Object:任意对象
- Array:一种特别的对象
- Function:一种特别的对象
计算机世界中的万事成物都是数据。
计算机程序可以处理大量的数据,为了方便数据的管理,将数据分成了不同的类型:
注:通过 typeof 关键字检测数据类型 返回数据类型的字符串表达
<script>
// 检测 1 是什么类型数据,结果为 number
document.write(typeof 1);
</script>
1.1 数值类型
即我们数学中学习到的数字,可以是整数、小数、正数、负数
<script>
let score = 100; // 正整数
let price = 12.345; // 小数
let temperature = -40; // 负数
document.write(typeof score); // 结果为 number
document.write(typeof price); // 结果为 number
document.write(typeof temperature); // 结果为 number
</script>
JavaScript 中的数值类型与数学中的数字是一样的,分为正数、负数、小数等。
1.2 字符串类型
通过单引号( ''
) 、双引号( ""
)或反引号包裹的数据都叫字符串,单引号和双引号没有本质上的区别,推荐使用单引号。
注意事项:
无论单引号或是双引号必须成对使用
单引号/双引号可以互相嵌套,但是不以自已嵌套自已
必要时可以使用转义符
\
,输出单引号或双引号
<script>
let user_name = '小明'; // 使用单引号
let gender = "男"; // 使用双引号
let str = '123'; // 看上去是数字,但是用引号包裹了就成了字符串了
let str1 = ''; // 这种情况叫空字符串
documeent.write(typeof user_name); // 结果为 string
documeent.write(typeof gender); // 结果为 string
documeent.write(typeof str); // 结果为 string
</script>
1.3 布尔类型
表示肯定或否定时在计算机中对应的是布尔类型数据,它有两个固定的值 true
和 false
,表示肯定的数据用 true
,表示否定的数据用 false
。
1.4 undefined
未定义是比较特殊的类型,只有一个值 undefined,只声明变量,不赋值的情况下,变量的默认值为 undefined,一般很少【直接】为某个变量赋值为 undefined。
<script>
// 只声明了变量,并末赋值
let tmp;
document.write(typeof tmp); // 结果为 undefined
</script>
注:JavaScript 中变量的值决定了变量的数据类型。
1.5 NaN (不是一个数字)有时转换成数值类型,当转换失败时结果为 NaN
。
isNaN() 方法:是NaN返回true不是返回false
isNaN和Number.isNaN的区别:
isNaN会先将参数转为 Number类型 如果转不成则为NaN, 那么会返回true
Number.isNaN不会进行转换,所以只有当参数为 NaN 时才返回true
1.6 无穷大 无穷小(Infinity)
//无穷大
var max = Infinity
//无穷小
var min = -Infinity
二、类型转换
理解弱类型语言的特征,掌握显式类型转换的方法
在 JavaScript 中数据被分成了不同的类型,如数值、字符串、布尔值、undefined,在实际编程的过程中,不同数据类型之间存在着转换的关系。
2.1 隐式转换
某些运算符被执行时,系统内部自动将数据类型进行转换,这种转换称为隐式转换。
<script>
let num = 13; // 数值
let num2 = '2'; // 字符串
// 结果为 132
// 原因是将数值 num 转换成了字符串,相当于 '13'
// 然后 + 将两个字符串拼接到了一起
console.log(num + num2);
// 结果为 11
// 原因是将字符串 num2 转换成了数值,相当于 2
// 然后数值 13 减去 数值 2
console.log(num - num2);
let a = prompt('请输入一个数字');
let b = prompt('请再输入一个数字');
alert(a + b); //字符串
</script>
2.2显式转换
编写程序时过度依靠系统内部的隐式转换是不严禁的,因为隐式转换规律并不清晰,大多是靠经验总结的规律。为了避免因隐式转换带来的问题,通常根逻辑需要对数据进行显示转换。
2.2.1 转为number:有时转换成数值类型,当转换失败时结果为 NaN
1.Number方法(直接转number类型)
2.使用parseInt方法(转整型):截取数字字符
3.使用parstFloat方法 (转小数):截取数字字符
4.boolean类转为number类型:false为0,true为1
5.undefined和null转为number:undefined为NaN,null为0
2.2.2 Boolean方法 转为布尔类型
1.number转为布尔:非0和非NaN则为true
2.undefined和null转为boolean:值为false
3.Sting类型转为Boolean:非空字符串‘’即为ture
2.2.3 转为string类型
1.toString方法将number类型转为string类型
var str1 = number1.toString()
2.String()方法转为string类型
方法补充:
1.parseInt()、parseFloat()方法会先截取字符串中的数字字符(字符串必须以数字字符开头)再转为对应类型
2.Number()方法只能将数字字符组成的字符串转为数值类型
JavaScript数据类型以及转换的更多相关文章
- JavaScript数据类型和转换
JavaScript数据类型 1.Boolean(布尔) 布尔:(值类型)var b1=true;//布尔类型 2.Number(数字) 数值:(值类型)var n1=3.1415926;//数值类型 ...
- javascript数据类型及转换
此篇数据类型和转换只限于ECMA规范,规范用了比较大的篇幅讲数据类型和类型转换,理解了这个最基本的概念对表达式.语句.执行环境.对象及继承都有非常大的帮助,遂整理如下: 数据类型和值 类型转换 表达式 ...
- JavaScript学习笔记——数据类型强制转换和隐式转换
javascript数据类型强制转换 一.转换为数值类型 Number(参数) 把任何的类型转换为数值类型 A.如果是布尔值,false为0,true为1 B.如果是数字,转换成为本身.将无意义的后导 ...
- JavaScript复习之--javascript数据类型隐式转换
JavaScript数据类型隐式转换.一,函数类 isNaN() 该函数会对参数进行隐式的Number()转换,如果转换不成功则返回true. alert() 输出的内容隐式的 ...
- JavaScript 那些不经意间发生的数据类型自动转换
JavaScript可以自由的进行数据类型转换,也提供了多种显式转换的方式.但是更多的情况下,是由JavaScript自动转换的,当然这些转换遵循着一定的规则,了解数据类型自由转换的规则是非常必要的. ...
- Javascript的数据类型和转换
JavaScript 数据类型 在 JavaScript 中有 5 种不同的数据类型: string number boolean object function 3 种对象类型: Object Da ...
- 建议2:注意Javascript数据类型的特殊性---(2)慎用JavaScript类型自动转换
在JavaScript中能够自动转换变量的数据类型,这种转换是一种隐性行为.在自动转换数据类型时,JavaScript一般遵循:如果某个类型的值被用于需要其它类型的值的环境中,JavaScript就自 ...
- javascript数据类型及类型的转换总结
javascript 是浏览器客户端脚本语言,要想让网页与后台程序更好的交互效果,这里我们详细了解javascript 数据类型及类型的转换 1,数据类型 number number类型 数字类型,浮 ...
- 27 JavaScript的引入&注释&弹窗&变量常量&数据类型及转换&内存&垃圾回收
JS的引入: 1 内部引入 绑定元素事件如onclick="" 绑定锚点如href="JavaScript:void(0)" script标签引入,注意:如果标 ...
- javaScript数据类型及判断
ECMAScript数据类型概念: ECMAScript数据类型分为两类:原始类型和对象类型(即基本类型和引用类型): ECMAScript数据类型也可以分为可变类型和不可变类型,数组和对象属于可变类 ...
随机推荐
- kotlin information
Kotlin常用的by lazy你真的了解吗 => https://juejin.cn/post/7057675598671380493 END
- C# 字符串数组去重(去除数组中重复元素)
1. 去重distinct()或者GroupBy(p => p).Select(p => p.Key),去重的对象都需要为数组,具体看代码 string itemfileids = &qu ...
- 用H5 Canvas绘制一个仪表盘笔记
前端有许多做数据可视化的图表插件,但有时候UI设计的图可能用现成的js插件无法定制或者比较麻烦(还不如自己造轮子来的快). 下面记录下用H5 canvas设计一个仪表盘代码: <!DOCTYPE ...
- 性能再升级,XMeter Cloud 专业版正式上线
去年 8 月,EMQ 正式在全球市场推出了最简单.快速的 MQTT 负载和场景测试云服务--XMeter Cloud,用户无需部署即可进行 MQTT 测试,以更低的测试成本轻松打造具有竞争力的可靠物联 ...
- Q查询和F查询
F查询与Q查询 F查询 Django 提供 F() 来做这样的比较.F() 的实例可以在查询中引用字段,来比较同一个 model 实例中两个不同字段的值. # 查询评论数大于收藏数的书籍 from d ...
- wamp+phpstrom+Xdebuge helper(google)
一.软件安装两个软件的安装和第三个浏览器插件就不再赘述,网上有很多详细的教程,自行百度. 二.配置步骤1.wampwamp的优势在于自带xdebuge的dll文件,所以不需要在官网根据版本下载,具体位 ...
- Android Custom View使用Databinding
Android Custom View是可以使用 databinding 的 //java.lang.IllegalArgumentException: View is not a binding l ...
- 10 个常用的 JS 工具库,80% 的项目都在用!
Day.js 一个极简的处理时间和日期的 JavaScript 库,和 Moment.js 的 API 设计保持一样, 但体积仅有2KB. npm install dayjs 基本用法 import ...
- 简述47种Shader Map的渲染原理与制作方法
https://mp.weixin.qq.com/s/6EVpmgC53HqklIVkIpEssg
- Perl报错you may need to install the Win32::Console module(转)
ActivePerl-5.26.3.XXXX.msi安装后,命令行执行cpan,会出现如下提示而无法继续. Can't locate Win32/Console.pm in @INC (you may ...