类型转换对于刚开始接触js的朋友是一个非常头痛的的事情 而现在我争取用一篇博客让你搞懂js中常见的类型转换
=> Boolean布尔类型
转化为布尔类型其实比较简单
空字符 => false
0 => false
NaN => false
undefined => false
null => false
其他的均为true
=> Number
- String => Number
非纯数字都转化为NaN
纯数字正常转化
Number('1hehe') //NaN
Number('1') //1
Number('1.1') //1.1
其他的同理 注意:非纯数字字符都转化为NaN 这里不要和parseInt()方法搞混了
- Null => Number
0 - Undefined => Number
NaN 虽然null和undefined在存在双等关系 但是在数值转化存在区别 (记忆小技巧:undefined为未定义 没有定义的东西不能转化为数值 所以转化结果为非数NaN) - 对象(这里应该说成类的实例) => Number
这个算是类型转化中最复杂的了 也是本篇博客重点
转化规则valueOf => toString
首先调用实例的valueOf方法 看的到的结果能否通过以上1 2 3规则转化 如果可以 类型转换结束 如果不行 则继续调用实例的toString方法 然后在根据以上规则进行转化为数值
------------------------------------------------------------------------------------------------------------------------------------------------
//Object 实例
const obj = new Object();
//缓存对象原有valueOf方法
const objValueOf = Object.prototype.valueOf;
//为了证明调用了valueOf方法和toString方法 我们重写原型上的方法
Object.prototype.valueOf = function () {
console.log('obj', 'valueOf');
return objValueOf.call(this);
}
Object.prototype.toString = function () {
console.log('obj', 'toString');
}
const objRes = Number(obj);
console.log(objRes)
//结果
//obj valueOf
//obj toString
//NaN
结果意料之中 调用了类实例的先调用了valueOf方法 然后调用toString 然后字符转化为数值NaN
------------------------------------------------------------------------------------------------------------------------------------------------
//Number 实例
const num = new Number(2);
const numValueOf = Number.prototype.valueOf;
Number.prototype.valueOf = function () {
console.log('num', 'valueOf');
return numValueOf.call(this);
}
Number.prototype.toString = function () {
console.log('num', 'toString');
}
const numRes = Number(num);
console.log(numRes);
//num valueOf
//2
结果依然意料之中 先调用valueOf方法 发现得到的结果为数值 类型转化结束
------------------------------------------------------------------------------------------------------------------------------------------------
//Boolean 实例
const bl = new Boolean(true);
const blValueOf = Boolean.prototype.valueOf;
Boolean.prototype.valueOf = function () {
console.log('bl', 'valueOf');
return blValueOf.call(this);
}
Boolean.prototype.toString = function () {
console.log('bl', 'toString');
}
const blRes = Number(bl);
console.log(blRes);
//bl valueOf
//1
结果依然意料之中 先调用valueOf方法 转化成了true 然后发现可以通过1 2 3规则转化为数值 于是类型转化结束 不在调用toString方法
------------------------------------------------------------------------------------------------------------------------------------------------
//String 实例
const str = new String('hehe');
const strValueOf = String.prototype.valueOf;
String.prototype.valueOf = function () {
console.log('str', 'valueOf');
return strValueOf.call(this);
}
String.prototype.toString = function () {
console.log('str', 'toString');
}
const strRes = Number(str);
console.log(strRes);
//str valueOf
//NaN
先调用valueOf方法转化为字符串hehe然后发现可以通过1 2 3规则转化 类型转化结束 不在调用toString方法
最后总结对象类型转化为数值类型规则
1。先调用valueOf方法把对象转化为原始类型(对象字符转化为原始字符 对象数值转化为原始数值 对象布尔转化为原始布尔)如果原始类型可以直接转化成数值就直接转化 类型转化也随之结束 如果原始类型还不能直接转化为数值(如{} 和 function() {})
2。则调用其toString方法 然后拿到结果转化为数值 (其实一般走到这步最后结果都为NaN 除非重写toString方法)