JavaScript之数据类型、类型判断、类型转换
数据类型
基础类型
字符串(String):字符串是存储字符的变量。 字符串可以是引号中的任意文本。可以使用单引号或双引号。
数字 (Number):JavaScript只有一种数字类型,数字可以带小数点,也可以不带。
布尔 (Boolean):布尔(逻辑)只能有两个值:true 或 false。
空(Null):可以通过将变量的值设置为null来清空变量,只有一个值:null。
未定义(Undefined):表示变量不含有值,只有一个值:undefined。
原始数据类型(Symbol),是ES6引入的一种新的原始数据类型,表示独一无二的值。
特殊数字(BigInt):是一种数字类型的数据,它可以表示任意大小、任意精度格式的整数。
引用(对象)数据类型
引用(对象)数据常见类型:
对象 (Object):对象由花括号分隔,在括号内部,对象的属性以名称和值对的形式 (name : value) 来定义。属性由逗号分隔。
数组 (Array):数组对象是使用单独的变量名来存储一系列的值。
函数 (Function):函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块。
特殊的对象:
正则(RegExp):RegExp是正则表达式的简写,它描述了字符的模式对象。当检索某个文本时,可以使用一种模式来描述要检索的内容,RegExp就是这种模式。
日期(Date):日期对象用于处理日期和时间。
算数(Math) : 执行常见的算数任务。
注意
NaN 的数据类型是 number
数组(Array)的数据类型是 object
日期(Date)的数据类型为 object
null 的数据类型是 object
未定义变量的数据类型为 undefined
区别
1.基础类型存储在栈内存,被引用或拷贝时,会创建一个完全相等的变量
2.引用类型存储在堆内存,存储的是地址,多个引用指向同一个地址,会涉及一个“共享”的概念
let a = {name: 'aaa'}
let b = a;
console.log(a.name); // aaa
b.name = 'bbb';
console.log(a.name); // bbb
console.log(b.name); // bbb
数据类型的判断
typeof
typeof可以判断基础数据类型,null除外,但是引用数据类型中,除function类型以外,其余都是 ‘object’,是无法判断出来的。
注意:虽然
typeof null
输出object,但这是JS存在的一个Bug,不代表null就是引用数据类型,并且null 本身也不是对象。
typeof 1 // 'number'
typeof '1' // 'string'
typeof undefined // 'undefined'
typeof true // 'boolean'
typeof Symbol() // 'symbol'
typeof null // 'object'
typeof [] // 'object'
typeof {} // 'object'
typeof console // 'object'
typeof console.log // 'function'
instanceof
当new一个对象时,则新对象就是它原型链继承上面的对象,通过instanceof能判断这个对象是否是之前构造函数生成的对象,这样就基本可以判断出这个新对象的数据类型。
instanceof可以准确地判断复杂引用数据类型,但是不能正确判断基础数据类型
let User = function() {}
let u = new User()
u instanceof User // true
let user = new String('user')
user instanceof String // true
let str = 'str'
str instanceof String // false
自定义实现instanceof方法
function myInstanceof(a, b) {
// 先用typeof来判断基础数据类型,是则直接返回false
if(typeof a !== 'object' || a === null) return false;
// getProtypeOf是Object对象自带的API,能够拿到参数的原型对象
let aa = Object.getPrototypeOf(a);
while(true) {
// 循环寻找,直到找到相同的原型对象
if(aa === null) return false;
//找到相同原型对象,返回true
if(aa === b.prototype) return true;
aa = Object.getPrototypeof(aa);
}
}
验证
console.log(myInstanceof(new Number(10), Number)); // true
console.log(myInstanceof(10, Number)); // false
Object.prototype.toString
toString()是Object的原型方法,该方法可以统一返回格式为
[object Xxx]
的字符串,其中Xxx
是对象的类型。对于Object对象,直接调用toString()就能返回[object Object]
,而对于其他对象,则需要通过call来调用,才能返回正确的类型信息
Object.prototype.toString.call() 可以很好地判断引用类型,甚至可以把document和window都区分开来。值得注意的是:这个方法最后返回统一字符串格式为
[object Xxx]
,字符串里面的 “Xxx” ,第一个首字母要大写,使用typeof返回的是小写。
Object.prototype.toString({}) // "[object Object]"
Object.prototype.toString.call({}) // "[object Object]"
Object.prototype.toString.call(1) // "[object Number]"
Object.prototype.toString.call('1') // "[object String]"
Object.prototype.toString.call(true) // "[object Boolean]"
Object.prototype.toString.call(function(){}) // "[object Function]"
Object.prototype.toString.call(null) //"[object Null]"
Object.prototype.toString.call(undefined) //"[object Undefined]"
Object.prototype.toString.call(/123/g) //"[object RegExp]"
Object.prototype.toString.call(new Date()) //"[object Date]"
Object.prototype.toString.call([]) //"[object Array]"
Object.prototype.toString.call(document) //"[object HTMLDocument]"
Object.prototype.toString.call(window) //"[object Window]"
自定义数据类型判断
function myType(obj){
let type = typeof obj;
// 进行typeof判断,是基础数据类型直接返回
if (type !== "object") {
return type;
}
// typeof返回结果是object,再进行正则判断返回结果
return Object.prototype.toString.call(obj).replace(/^\[object (\S+)\]$/, '$1');
}
验证
myType([]) // "Array" typeof []是object
myType('10') // "string" typeof直接返回
myType(window) // "Window" toString返回
myType(null) // "Null" typeof null是object,需toString来判断
myType(undefined) // "undefined" typeof直接返回
myType() // "undefined" typeof直接返回
myType(function(){}) // "function" typeof判断为function,直接返回
myType(/123/g) //"RegExp" toString返回
数据类型的转换
强制类型转换
强制类型转换方式包括 Number()、parseInt()、parseFloat()、toString()、String()、Boolean(),都是通过自身的方法来进行数据类型的强制转换。
Number() 方法的强制转换规则
如果是布尔值,true 和 false 分别被转换为 1 和 0
如果是数字,返回自身
如果是 null,返回 0
如果是 undefined,返回 NaN
如果字符串中只包含数字(或者是 0X / 0x 开头的十六进制数字字符串,允许包含正负号),则将其转换为十进制
如果字符串中包含有效的浮点格式,将其转换为浮点数值
如果是空字符串,将其转换为 0
如果不是以上格式的字符串,均返回 NaN
如果是 Symbol,抛出错误
如果是对象,并且部署了 [Symbol.toPrimitive] ,那么调用此方法,否则调用对象的 valueOf() 方法,然后依据前面的规则转换返回的值
如果转换的结果是 NaN ,则调用对象的 toString() 方法,再次依照前面的顺序转换返回对应的值
示例:
Number(true); // 1
Number(false); // 0
Number('010'); //10
Number(null); //0
Number(''); //0
Number('1a'); //NaN
Number(-0X10); //-16
Number('0X10') //16
Boolean() 方法的强制转换规则
除了 undefined、 null、 false、 ''、 0(包括 +0,-0)、 NaN 转换出来是 false,其他都是 true
Boolean(0) //false
Boolean(null) //false
Boolean(undefined) //false
Boolean(NaN) //false
Boolean(1) //true
Boolean(10) //true
Boolean('10') //true
隐式类型转换
凡是通过逻辑运算符 (&&、 ||、 !)、运算符 (+、-、*、/)、关系操作符 (>、 <、 <= 、>=)、相等运算符 (==) 或者 if/while 条件的操作,如果遇到两个数据类型不一样的情况,都会出现隐式类型转换。
==的隐式类型转换规则
如果类型相同,无须进行类型转换
如果其中一个操作值是 null 或者 undefined,那么另一个操作符必须为 null 或者 undefined,才会返回 true,否则都返回 false
如果其中一个是 Symbol 类型,那么返回 false
两个操作值如果为 string 和 number 类型,那么就会将字符串转换为 number
如果一个操作值是 boolean,那么转换成 number
如果一个操作值为 object 且另一方为 string、number 或者 symbol,就会把 object 转为原始类型再进行判断,调用object的valueOf/toString方法进行转换
null == undefined // true
null == 0 // false
'' == null // false
'' == 0 // true 字符串转隐式转换成Number
'10' == 10 // true 字符串转隐式转换成Number
0 == false // true 布尔型隐式转换成Number
1 == true // true 布尔型隐式转换成Number
var a = {
value: 0,
valueOf: function() {
this.value++;
return this.value;
}
};
// a可以等于1、2、3
console.log(a == 1 && a == 2 && a ==3); //true Object隐式转换,注意:再重新执行a==3或之前的数字就是false,因为value已经加上去了
+的隐式类型转换规则
‘+’ 号操作符,不仅可以用作数字相加,还可以用作字符串拼接。仅当 ‘+’ 号两边都是数字时,进行的是加法运算。如果两边都是字符串,则直接拼接,无须进行隐式类型转换。
如果其中有一个是字符串,另外一个是undefined、null 或布尔型,则调用toString()方法进行字符串拼接
如果是纯对象、数组、正则等,则默认调用对象的转换方法会存在优先级,然后再进行拼接。
如果其中有一个是数字,另外一个是undefined、null、布尔型或数字,则会将其转换成数字进行加法运算。
如果其中一个是字符串、一个是数字,则按照字符串规则进行拼接
1 + 2 // 3
'1' + '2' // '12'
'1' + undefined // "1undefined" undefined转换字符串
'1' + null // "1null" null转换字符串
'1' + true // "1true" true转换字符串
'1' + 1n // '11' 特殊字符串和BigInt相加,BigInt转换为字符串
1 + undefined // NaN undefined转换数字相加NaN
1 + null // 1 null转换为0
1 + true // 2 true转换为1,二者相加为2
1 + 1n // 错误 不能把BigInt和Number类型直接混合相加
'1' + 2 // '12' 字符串拼接
Object转换规则
对象转换的规则,会先调用内置的 [ToPrimitive] 函数,其规则逻辑如下:
如果有Symbol.toPrimitive方法,则优先调用再返回
调用valueOf(),如果转换为基础类型,则返回
调用toString(),如果转换为基础类型,则返回
如果都没有返回基础类型,会报错
var obj = {
value: 1,
valueOf() {
return 2;
},
toString() {
return '3'
},
[Symbol.toPrimitive]() {
return 4
}
}
验证
// 有Symbol.toPrimitive则优先执行,没有则执行valueOf打印结果为3
// 没有Symbol.toPrimitive与valueOf,则调用toString返回'31',进行字符串拼接
console.log(obj + 1); // 输出5
// {}会默认调用valueOf是{},不是基础类型继续转换,调用toString,返回结果"[object Object]",于是和10进行'+'运算,按照字符串拼接规则来
10 + {} // "10[object Object]"
// [1,2,undefined,4,5]会默认先调用valueOf结果还是这个数组,不是基础数据类型继续转换,也还是调用toString,返回"1,2,,4,5",然后再和10进行运算,还是按照字符串拼接规则
[1,2,undefined,4,5] + 10 // "1,2,,4,510"
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。
文章由极客之音整理,本文链接:https://www.bmabk.com/index.php/post/136851.html