javascript数据类型和类型转换

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了javascript数据类型和类型转换相关的知识,希望对你有一定的参考价值。

一  数据类型

1)typeof 查看数据类型

1.number 数字

取值范围:正无穷 - 负无穷、NaN 正无穷:Number.POSITIVE_INFINITY 负无穷:Number.NEGATIVE_INFINITY

1 var v = NaN; 
2 alert(typeof v);//number
2.string 字符串
1 var v = ""; 
2 alert(typeof v);//string
3.boolean 布尔值 true | false
1 var v = true; 
2 alert(typeof v);//boolean
4.undefined 未定义
var v; 
alert(typeof v);//undefined
5.function 函数
1 var v = function(){ };
2 alert(typeof v);//function
6.object 对象: 元素、null、数组、json
1 var v = []; 
2 alert(typeof v);//object
总结:number/string/boolean/function/object/undefined

2)标准:

基本类型: number/string/boolean/undefined/null 复合类型: object
 

二、强制类型转换

1)转换成数字

方法一:parseInt 解析成整型(整数)
解析规则:从第0位开始,一位一位的查看是否是数字,如果到某一位不是数字,就把这位之前的数字提取出来,如果第0就不是数组,返回NaN
注意:
1)parseInt的第二个参数:parseInt(要转换的内容,进制);
2)0x是16进制前缀; alert(parseInt(‘0xf‘));//15
3)可识别最开始空格、+、-、0
1 console.log(parseInt("12.724.12.234")); //12
2 console.log(parseInt("1a12s"));//1
3 console.log(parseInt(".123"));//NaN
4 console.log(parseInt("s12345"));//NaN
5 console.log(parseInt(true));//NaN
6 console.log(parseInt(""));//NaN
7 console.log(parseInt(" +00123"));//123

 

方法二:parseFloat 解析成浮点型(小数)
解析规则:和parseInt一样,不一样的是,可以多解析一个小数点
1 console.log(parseFloat("12.724.12.234")); //12.724
2 console.log(parseFloat("1a12s"));//1
3 console.log(parseFloat(".123"));//0.123
4 console.log(parseFloat("s12345"));//NaN
5 console.log(parseFloat(true));//NaN
6 console.log(parseFloat(""));//NaN
方法三:Number
解析规则:在进行数字转换时,完整的把要转换的内容看一遍,必须完全符合数字的规范才去进行转发,否则返回 NaN 特殊解析:
1.布尔值: true 1 false 0
2.字符串 空字符串‘‘ 0 只有空格的字符串‘ ‘ 0 最开始含空格、+、-、0 " +00123"->123
3.undefined NaN
4.function NaN
5.object null
console.log(Number(null));//0 json console.log(Number({}));//NaN
 
数组 当数组只有一位时,就去转换这一位:这一位是数字,或者字符串,或者undefined,就会进行转换否则NaN
1 var v = [];
2 console.log(Number(v));//0
3 var v = [‘‘];
4 console.log(Number(v)); //0
5 var v = [‘ ‘];
6 console.log(Number(v)); //0
7 var v = [‘ +00112‘];
8 console.log(Number(v)); //112

2)转换成字符串 String

实际就是直接加上引号,变成字符串
1 var a = 12323;
2 console.log(String(a));//12323
3 var a = true;
4 console.log(String(a));//true
5 var a = function(){};
6 console.log(String(a));//function(){}

3)转换成布尔值 Boolean

true: 非0的数字, 非空字符串, 函数, 非空对象 false: 0, NaN , 空字符串, undefined, null

注意:

1.空对象不能进行属性操作
1 var a = [];
2 console.log(Boolean(a));//true

三、运算符

1)算术运算符

+ 加、- 减、* 乘、/ 除、% 取模(求余数)、++、--

2)赋值运算符

=、+=、-=、*=、/=、%= a += b; //a=a+b; a -= b; //a=a-b; a *= b; //a=a*b; a /= b; //a=a/b; a *= b; //a=a%b;

3)关系运算符

<、>、<=、>=、== 相等、!= 不等、===、!== 比较后都会返回布尔值

4)逻辑运算符

&& 与、|| 或、! 否 ?:三元运算符 1. && 两侧必须都为true 才会返回 true 否则 返回false
1 var a = 1;
2 var b = 3;
3 console.log(a!=b && a > b);//false
2. ||两侧有一侧为true 就会返回 true,否则 返回false
1 console.log(a!=b || a > b);//true
3. !
1 console.log(!(a != b));//false
4. 三元运算符 判断条件?成立的返回值:不成立的返回值;
1 var a = 0;
2 var b = 1;
3 var c = a > b?a:b;
4 console.log(c);//1
 1 //利用逻辑运算符简化运算
 2 var a = 1;
 3 var b = 1;
 4 function fn(){
 5 alert("条件成立");
 6 }
 7 function fn2(){
 8 alert("条件不成立");
 9 }
10 
11 /*if(a != b){
12 fn();
13 } else {
14 fn2();
15 }*/
16 
17 //&&并且:(当第一个条件成立时,才会去执行第二条件) 当左侧成立时就会只执行右侧代码,否则直接返回 false
18 //第一个条件为false,不会执行fn
19 a!=b&&fn();
20 
21 //当第一个条件成立时,返回true,语句结束,条件不成立就会去 执行右侧
22 //第一个条件为false,会执行fn2
23 a!=b||fn2();

 

四、隐式类型转换

1)+,++,+=:

1. 碰到字符串就执行字符串拼接
2. 如果可以转换成数字,就进行数字相加(Number转换成数字)
3. 如果不能把左右两边都转成数字,就执行字符串连接
1 var a = function(){};
2 var b = 1;
3 alert(a + b);//function(){}1

2)- 减、* 乘、/ 除、% 取模(求余数)、--:

会把左右两侧都转成成数字,进行相关操作,不能转换成数字 就返回NaN
1 var a = function(){};
2 var b = 1;
3 alert(a - b);//NaN

3)==、!= 会进行类型转换

===、!== 类型不一样,直接返回false 
1 var a = true;
2 var b = 1;
3 alert(a == b);//true
  1. 对于string,number等基础类型,==和===是有区别的
    • 1)不同类型间比较,==之比较“转化成同一类型后的值”看“值”是否相等,===如果类型不同,其结果就是不等
    • 2)同类型比较,直接进行“值”比较,两者结果一样
  2. 对于Array,Object等高级类型,==和===是没有区别的
    • 进行“指针地址”比较
  3. 基础类型与高级类型,==和===是有区别的
    • 1)对于==,将高级转化为基础类型,进行“值”比较
    • 2)因为类型不同,===结果为false
”==”与”===”是不同的,一个是判断值是否相等,一个是判断值及类型是否完全相等。 下面的规则用于判定===运算符比较的两个值是否相等的判断条件
  1. 如果两个值的类型不同,它们就不相同。
  2. 类型相同
    • 如果两个值是数字,而且值相同,那么除非其中一个或两个都是NaN(这种情况它们不是等同的),否则它们是等同的。值NaN永远不会与其他任何值等同,包括它自身(奇怪的家伙),要检测一个值是否是NaN,可以使用全局函数isNaN()。
    • 如果两个值都是字符串,而且在串中同一位置上的字符完全相同,那么它们就完全等同。如果字符串的长度或内容不同,它们就不是等同的。
    • 如果两个值都是布尔型true,或者两个值都是布尔型false,那么它们等同。
    • 如果两个值都是null或都是undefined,它们完全相同。
    • 如果两个值引用的是同一个对象、数组或函数,那么它们完全等同。如果它们引用的是不同的对象(数组或函数),它们就不完全等同,即使这两个对象具有完全相同的属性,或两个数组具有完全相同的元素。
下面的规则用于判定==运算符比较的两个值是否相等的判断条件
  1. 如果两个值具有相同的类型,那么就检测它们的等同性。如果这两个值完全相同,它们就相等。如果它们不完全相同,则它们不相等。
  2. 如果两个值的类型不同,它们仍然可能相等。用下面的规则和类型转换来检测它们的相等性
    • 如果一个值是null,另一个值是undefined,它们相等。
    • 如果一个值是数字,另一个值是字符串,把字符串转换为数字,再用转换后的值进行比较。
    • 如果一个值为true,将它转化为1,再进行比较。如果一个值为false,把它转化为0,再进行比较。
    • 如果一个值是对象,另一个值是数字或字符串,将对象转换成原始类型的值,再埋比较。可以使用对象的toString()方法或valueOf()方法把对象转化成原始类型的值。javascript核心语言的内部类通常先尝试valueOf()方法转换,再尝试toString()方法转换,但是对于Date类,则先执行toString()方法再执行valueOf()方法转换。不属于JavaScript核心语言的对象则可以采用JavaScript实现定义的方式把自身转换成原始数值。
    • 其他的数值组合是不相等的。

4)! 取反

1 alert(!"");//true

五、NaN

NaN: (not a number) 这不是一个数字 数据类型:number 注意:NaN 不等于任何数字,并且不等于它自己
1 var a = "100px";
2 var b = "100px";
3 alert(Number(a));//NaN
4 alert(Number(b));//NaN
5 alert(Number(a)==Number(b));//false

六、isNaN

isNaN 检测一个数据转换成数字之后,是否是NaN,是 返回true,否则返回false
1 var a = true;
2 alert(isNaN(a));//false
有一种可靠的并且准确的方法可以检测NaN:只有NaN是自己不等自己的,那么,我们就以使用不等于号(!==)来判断一个数是否等于自身,从而,可以检测到NaN了
1 function isReallyNaN(x) {
2     return x !== x;
3 }

以上是关于javascript数据类型和类型转换的主要内容,如果未能解决你的问题,请参考以下文章

深入浅出JavaScript中的隐式转换

JavaScript数据类型转换

javaScript-数据类型和数据类型转换

javascript:基本数据类型转换

javascript中的数据类型转换

Web | JavaScript的引用数据类型强制转换类型