js 类型转换

最新推荐文章于 2022-10-11 15:49:46 发布

竹节虫T

最新推荐文章于 2022-10-11 15:49:46 发布

阅读量519

点赞数

分类专栏：前端

本文链接：https://blog.csdn.net/weixin_43623871/article/details/86489954

版权

前端专栏收录该内容

61 篇文章 0 订阅

订阅专栏

文章目录

- - 1 typeof

1 typeof

1 typeof 获取变量的类型

typeof 在 ES2015中的返回值一共有七种：boolean,number, string, object，undefined, function,和 symbol。

null和数组的返回的类型都是object

首先数组中可以包含其他任何类型的元素，它并不是底层对象，所以它们没有自己独有的类型，就是说像数组这样的泛泛的引用值返回的都是Object类型。
但是有一个特例就是null,null是属于原始值它返回的也是Object类型，这属于浏览器的历史遗留问题(最早的时候的null代替的是空对象，给对象来占位的)，所以说除了null，泛泛的引用值返回的类型都属于Object类型。

undefined是一种特殊的类型，它所代表的是这么一种类型：它们有名字，但是不知道自己是什么类型，即只要有名字但是没有赋值的变量都是undefined类型.对于上面的例子。虽然a定义了，但是也是undefined类型，它们就是属于“有名字没值”的变量。用内存模型来说，undefined类型的对象就是只占用一块内存空间（用来保存变量名字）的对象.

var a;
console.log(typeof a);//undefined
console.log(typeof b);//undefined

2 typeof类型转换

显式类型转换

1。 Number 千方百计的转换为数字，转不成功的就会是NaN。

var num = Number("123");//123
var num = Number(false);//0
var num = Number(null);//0;
var num = Number(undefined);//NaN
var num = Number("abc");//NaN

2。 parseInt 转换为整数

第一种: parseInt只有一个参数


 
var a = parseInt(123.9);//123   直接去除小数点后面的数，不进行四舍五入
var b = parseInt("123");//123
var f = parseInt("abc");//NaN
var c = parseInt(false);//NaN
var d = parseInt(null);//NaN
var e = parseInt(undefined);//NaN

 var q = parseInt("1000px");//1000
 var z = parseInt("1234.567adc")//1234
 //parseInt是从数字位往后看，一直看到非数字位截止，把之前的返回（砍断原则）

第二种: parseInt(string, radix) 有2个参数，就是以目标进制radix为基底将string转换为十进制

第一个string 是传入的数值，
第二个radix是传入数值的进制，参数radix 可以忽略，默认为 10，各种进制的数转换为
十进制整数（如果不是整数，向下取整）。

radix 的取值范围是 2~36，如果 radix 为 1 或 radix>36 ，转换结果将是 NaN ，
如果 radix 为 0 或其它值将被忽略，radix 默认为 10 。
该函数要求第一个参数是字符串，如果不是字符串将被转换成字符串，而且，在进行转换之前，字符串参数的左侧符合进制数所使用字符集的字符被截取出来用于进制数的转换。字符串参数开头和结尾的空格会被忽略。
parseInt(param,radix) 相当于 parseInt(String(param).trim(),radix)

例如， parseInt(010) // 8，处理过程是

010 --> 8 //0 开头,八进制数
8 --> '8'
parseInt('8') //忽略 radix ,传入的 第一个参数 被识别为 10进制数

parseInt(0x10) // parseInt(16) 得到十进制16
parseInt(010,16) // parseInt('8',16) ,得到 8
parseInt(010,7) // parseInt('8',7) , 8 超出 7 进制数所使用字符的范围被丢弃，转换结果为 NaN
parseInt(0x10,8) // parseInt('16',8) 得到 14
parseInt(0x13,8) // parseInt('19',8) 字符 9 超出了8进制数所使用字符的范围，被丢弃，转换结果为 1

如果第一个参数直接传入字符串,忽略 radix ，则：
字符串以 0 开头，默认被识别为 8 进制( IE 9 识别为 10进制，ie 6-8 识别为 8 进制 )
字符串以 0x 开头，默认被识别为 16 进制
否则识别为 10进制

parseInt('010') //8 ,ie9 得到 10
parseInt('018') //1 ,ie9 得到 18
parseInt('017') //15 ， ,ie9 得到 15
parseInt('010',8) //直接识别为8进制 ，转换结果 8
parseInt('010',7) //直接识别为7进制 ，转换结果 7
parseInt('010',16) //直接识别为16进制 ，转换结果 16
parseInt("10",16);//16
parseInt('0x10') //16
parseInt('0x1g') //1
parseInt('0x1f') //31
parseInt('0x10',8) //直接识别为8进制 ，字符 x 超出 8进制数所使用字符的范围，转换结果 0
parseInt('0x10',15) // 转换结果 0
parseInt('0x10',16) // 0x 符合 16进制数的表达格式，被正确识别为 16 进制数，转换结果同 parseInt('10',16) 为 16
parseInt('0x10',17) // 识别为17进制，字符 x 超出 17进制数所使用字符的范围，转换结果 0
parseInt(true) //NaN ,注意区别 布尔型在 Number 函数中的用法， Number(true) //1

第三种: 需要特别注意的1/0 = Infinity

parseInt(1/0,18) // NaN
parseInt(1/0,19) //18 
//因为 字符 i 在 19 进制数使用的字符集内，字符n 及后面的被丢弃
//parseInt(1/0,19) 实际为 parseInt('i',19) 

parseInt(NaN,36) // 30191 
//因为 字符 n 在 36 进制中相当于 十进制 23，a 相当于十进制 10，于是有
//23*36*36 + 10*36 + 23 = 30191

parseInt(1/0,36) // 1461559270678 ,实为 parseInt('Infinity',36)

//parseFloat 是没有进制参数的，只能处理10进制数。
parseFloat.length //1

3。 parseFloat(string)只有一个参数

 var z = parseInt("1234.567adc")//1234.567

4。 tostring（）： null 和 undefined 不能使用toString方法,会报错

var demo = 123;
demo.toString();//"123"

var demo = undefined;
demo.toString();//报错

var demo = null;
demo.toString();//报错

//tostring（radix），就是把10 转换为 8进制
var a= 10;
var b = a.toString(8);//"12"

5。 String(mix)：不论什么都会转换成字符串

var num = String("123");//"123"
var num = String(false);//"false"
var num = String(null);//"null";
var num = String(undefined);//"undefined"
var num = String("abc");//"abc"

6。 Boolean()

var a = Boolean("");//false
var b = Boolean(false);//false
var c = Boolean(true);//true;
var d = Boolean(undefined);//false
var e = Boolean("abc");//true

一个小练习：把一个二进制数10000转换为16进制
（parseInt把二进制转换为十进制，toString将十进制转换为16进制）
在这里插入图片描述

隐式类型转换

1。isNaN() :

内部隐式的调用Number(),然后转换出来的与NaN比较
isNaN就是is not a number

console.log(isNaN(NaN));//true
console.log(isNaN("abc"));//true
console.log(isNaN(undefined));//true
console.log(isNaN(null));//false
console.log(isNaN(123));//false
console.log(isNaN(false));//false

自己编写的isNaN方法实现和系统一样的功能：
在这里插入图片描述
2。 ++ 自增，- - 自减， + 正号，- 负号，
（内部也是隐式的调用Number()）

var demo1 = "123";
demo1++;
console.log(demo1 + " : " + typeof(demo1));//124 : number

var demo2 = "abc";
demo2++;
console.log(demo2 + " : " + typeof(demo2));// NaN : number

var demo3 = +"abc";
console.log(demo3 + " : " + typeof(demo3));//NaN : number
//即使转换不成number类型的数字，但是它的类型也已经变成number类型了。

3。 + 加号（内部隐式的调用的是String()）
当加号两侧有一个是字符串类型的，那就会调用String()把两个都变成字符串

var demo4 = "a" + 1;
console.log(demo4 + " : " + typeof(demo4));//a1 : string

4。 - 减号，* 乘以，/ 除以，% 取模
（内部也是隐式的调用Number()）

var demo5  = "1" * 1;
console.log(demo5 + " : " + typeof(demo5));// 1 : number

var demo5  = "a" * 1;
console.log(demo5 + " : " + typeof(demo5));// NaN : number

5。 > 大于，< 小于， <= 小于等于 , >= 大于等于

var a = "3" > 2;//字符串和数字比较首先把字符串转换为数字
console.log(a +":" + typeof(a));//true:boolean

在这里插入图片描述
特殊的情况:
未定义的变量aaa在这里打印是不会报错的，会显示是undefined类型，那么typeof(typeof(aaa))就是typeof(“undefined”)为string类型

console.log(typeof(aaa));//undefined
console.log(typeof(typeof(aaa)))//string

在这里插入图片描述

案例分析

	var str = false  + 1;//如果加号两边没有字符串，就为正常的数字相加，那么false隐式的转换为Number类型为0
	console.log(str);//1
	
	var demo = false == 1;
	console.log(demo);//false
	
	//typeof(a)返回字符创类型的"undefined"，-true为-1,+undefined为NaN,NaN + "" = "NaN"
	if(typeof(a)&&-true + (+undefined) + ""){
		console.log("基础扎实");
	}
	
	if(11 + "11" * 2 == 33){
		console.log("基础扎实");
	}
	
	//双非表示boolean把后面的转化为bolean ，!!" "表示true;
	//!!""表示false
	!!" " + !!"" - !!false||document.write("你觉得能打印，你就是猪");
	//true + false - false = 1 + 0 -0 = 1
	//1 ||   （前面为1，就停止了，后面就不会计算了）