JavaScript数据类型和转换

最新推荐文章于 2024-09-09 09:35:48 发布

逝水流痕

最新推荐文章于 2024-09-09 09:35:48 发布

阅读量425

点赞数

分类专栏：前端入门文章标签： javascript 前端

本文链接：https://blog.csdn.net/zxx2011082427/article/details/71325706

版权

前端入门专栏收录该内容

11 篇文章 0 订阅

订阅专栏

js数据类型和转换

这是每门编程语言都要学的，每本书开头都是数据类型和变量什么的，是不是觉得我都会了，跳过。。

BUT，这次no，这是最基本最重要的地方，一定要认真看。

一、数据类型

分为两类：基本数据类型和引用数据类型。

基本数据类型：string(字符串)，number(数字)，boolean(布尔值)，null(空)，undefined(未定义)

引用数据类型：array，object

下面分别介绍：

1、string

（1）由一对单引号或者双引号表示。并且单引号和双引号一定要成对出现。

个人推荐使用单引号好一点。

（1）var str1=‘a’;

（2）那么var str2=‘’;呢？这对引号里面什么都没有，这也是一个字符串，叫做空字符串。

（3）那么var str3=‘ ‘;呢？这对引号里是一个空格，这样是一个字符串。但不是空字符串。

（2）、（3）的区别是什么呢？在控制台打印一下：

var str1='a';
var str2='';
var str3=' ';
console.log(str1);
console.log(str2);
console.log(str3);

结果如下：

我们会发现空格是可以选中的，空字符串是不能被选中的。（空格的大小：半个字符大小，比如对于谷歌浏览器一个字符是16px，那么空格就是8px。）

（2）字符字面量（转义序列）

对于有强迫症的同学，希望整个字符串都用单引号表示，那如果遇到it’s me这种的字符串呢？

var str=‘it’s me’;//报错

那可以写成var str=“it’s me”;//不会出错

但是强迫症怎么弄？

var str='it\'s me’;

这就是转义字符。

（3）字符串的方法

toString()方法（null和undefined没有这个方法，number，string，boolean，对象都用这个方法）

一般toString()可以不传入参数，默认是按基数10传递，也可以传入参数作为基数。
var num=10;
alert(num.toString());// ’10'
alert(num.toString(2)); //‘1010’
alert(num.toString(8)); // ’12'
alert(null.toString()); //报错
如果不知道要转换的值是不是null或undefined，还可以使用转型函数String(),这个函数能够将任何类型的值转换为字符串。转换原则如下：

如果值有toString()方法，则调用该方法并返回结果。

如果值是null，返回’null'；

如果值是undefined，则返回’undefined’;

例子：

var value1=10;
var value2=true;
var value3=null;
var value4;
alert(String(value1)); //“10"
alert(String(value2));// "true"
alert(String(value3)); //“null"
alert(String(value4));// “undefined”

要把某个值转换为字符串，还可以使用加号，比如

1+"" //“1"

字符串是灰色的。无数多个。

2、number（数字）

（1）由0-9之间的任意数字组成，可以是整数也可以是小数，数字的范围在正无穷（+infinity）-负无穷（-infinity）之间

数字的最大值：Number.MAX_VALUE //1.7976931348623157e+308

数字的最小值：Number.MIN_VALUE //5e-324

在程序中，如果看到全部大写的变量命名，那么一般是常量。

如果大于最大值，会出现Infinity。

数字是蓝色的。无穷多个。

（2） NaN

NaN==NaN //false

NaN与任何值都不相等，包括NaN本身。

isNaN()可以检测任何值是不是NaN。
alert(isNaN(“blue”));//true,"blue”不能转换为数值。
alert(isNaN(true));//false
alert(isNaN(“10”));//false
isNaN()也可以用于检测对象。原则：

先调用对象的valueOf()方法，然后确定该方法返回的值是否可以转换为数值，如果不能，再调用toString()方法，再测试返回值。

3、boolean

true

false

4、undefined

使用var声明但没有初始化。

var a;

alert(a); //undefined

alert(b);// 报错

5、null

空对象

eg:

var btn=document.getElementById(‘zhangsan’); //假设zhangsan不存在
alert(btn); //null

undefined和null的区别：undefine表示变量有，但值无；null表示变量没有

var btn=document.getElementById(‘zhangsan’); //假设zhangsan不存在
alert(btn); //null 获取不存在的对象，就会返回null

<input id=“lisi” type=“text”/>
var btn=document.getElementById(‘lisi’); 
alert(btn); //[object HTMLinputCollection]
alert(btn.value);//空字符串，啥也没有,有value这个属性，但没有值。
alert(btn.name);//空字符串，啥也没有，有name这个属性，但没有值。
alert(btn.sex);//undefined，默认没有sex这个属性，会返回undefined

6、引用类型

对象object

每个数据是由键值对组成的，数据可以是0个，也可以是多个，每个数据之间用逗号隔开，最后一个数据类型不能加逗号（加了在IE低版本下会报错）

键名：不满足变量命名规则的需要加双引号或者单引号（数字除外）。

采用对象字面量的定义：
var obj={
    name:'zhangsan’,
    age:18,
    'background-color’:’red’,
    1:3
};

var person={
    name:"wang",
    age:30,
    height:’180cm’,
    weight:’100kg’，
    'girl-friend': null
};
采用构造函数声明：
var o=new Object();
Object的每个实例都具有下列属性和方法：

constructor:

hasOwnProperty(propertyName):用于检查给定的属性在当前对象实例中欧是否存在（而不是在实例的原型里）

isPrototypeOf(object):

propertyIsEnumerable(propertyName):

toLocaleString():

toString():

valueOf():

二、typeof

检测数据类型，返回这个类型对应的字符串（全小写）

返回的结果与系统中定义的类型是有区别的,比如返回string,定义的是首字母大写的。

有什么用呢？

比如淘宝购买数量输入框中判断是否是数字。

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<input type="text" placeholder="请输入数字" id="text"/>
<button id="btn">点我</button>
<script>
document.getElementById("btn").οnclick=function(){
var num=document.getElementById('text').value;
console.log(num);//num是一个字符串数字，比如输入123，输出是带引号的“123”
console.info(typeof num);//‘string’
if(typeof num=='number'){
alert('is a number');
}else{
alert('not a number');
}
num=Number(num);
console.log(num);//数字,但如果输入不是一个数，这是强行转，不好
console.info(typeof num);//‘number’
if(typeof num=='number'){
alert('is a number');
}else{
alert('not a number');
}
}
</script>
</body>
</html>

这里有一个表格，表示typeof返回的数据类型。

系统定义的数据类型	typeof返回的数据类型
String	string
Number	number
Boolean	boolean
Undefined	undefined
Null	object

Object

object

三、数据类型转换

js支持任意值转化成Number,boolean,String

1、任意类型转数字

Number(要转换的值) 把任意类型转化成数字（NaN也是数字的一种）

要转换的类型	例子	转换后的值
Undefined	undefined	NaN
Null	null	0
Boolean	true/false	1/0

String	''	0
	' '	0
	'你好'	NaN
	‘012’	12
	‘12a’	NaN

总结：

空字符串，空格字符串转数字结果是0

字符串里的内容是否是纯数字，如果是个纯数字的话，就转成对应的数字；

如果不是纯数字，那结果就是NaN。

Number类型转数字还是原来的数字，没有意义

Object转数字类型，没有意义，结果不定

{} //NaN

{name:”wang”}//NaN

[]//0

[3]//3

[’nihao’]//NaN

2、字符串转数字

parseInt() 把字符串转成整数型数字

parseFloat()把字符串转成浮点型（小数）数字

传进来的字符串必须是数字或者空格加数字开头，它会从数字开始，一位一位往后找，直到找到的字符串不是数字就会停止，会把找到的数字转化成真正的数字，如果没找到那就返回NaN。

当然也有例外，如果传入的是字母，再加上基数，也是可以的。

精度问题：

0.1+0.2==0.3 //false

3、isNaN()

真正的作用不是判断一个值是不是数字，而是判断一个值是不是NaN。

在判断时，会先把参数用Number()方法转换一下。

typeof(NaN)会返回number

typeof(123)也会返回number

所以没法区分NaN，123

可以用isNaN(),

isNaN(NaN)返回true，

isNaN(123)返回false

4、任意类型转字符串

控制台中字符串是灰色的，数字是蓝色的。

要转化的类型	转换后的值
Undefined	'undefined'
Null	'null'
Number	把数字加引号
Boolean	true->'true' flase->'false'
String	自身

Object

给对象加一对引号

5、任意类型转布尔值

要转化的类型	转换后的值
Undefined	false
Null	false
Number	0->false NaN->false Infinity->true 非零数字->true
Boolean	自身
String	''->false ' '->true '你好'->true

根据语义判断,语义上相当于’没有’，’无’，’空’，’零’，’非数字‘的就是false，有就是true

比如Undefined、Null类型，

6、隐式类型转换

（1）显示类型转换

通过一些方法，很明确的将某种数据类型转换为另一种数据类型

Number()、parseInt()、parseFloat()明确将数据转数字类型

String()明确将数据转化成字符串

Boolean()明确将数据转换成布尔值

（2）隐式类型转换

在进行一些操作的时候，根本目的不是做类型转换。但是如果要进行操作的话，那数据必须符合某种类型。

js会在内部对数据进行一些转换。

逝水流痕

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
1
评论
JavaScript数据类型和转换

js数据类型和转换这是每门编程语言都要学的，每本书开头都是数据类型和变量什么的，是不是觉得我都会了，跳过。。BUT，这次no，这是最基本最重要的地方，一定要认真看。一、数据类型分为两类：基本数据类型和引用数据类型。基本数据类型：string(字符串)，number(数字)，boolean(布尔值)，null(空)，undefined(未定义)引用数据类型：a
复制链接

扫一扫

专栏目录