隐式转换和显式转换

目录

隐式转换

基本数据类型隐式转换

引用数据类型隐式转换

显式转换

将其他类型转为string类型

 将其他类型转为boolean类型

将其他类型转为number类型 

---

隐式转换

基本数据类型隐式转换

使用运算符 +   两个操作数有一个是字符串，则字符串拼接。

// + 字符串拼接
console.log(1 + '2');

 使用运算符  - * / %    将其他类型转为number类型

// 基本数据类型
// + - * / % 转换为number
console.log(1 - '');
console.log(1 - {});
console.log(1 - []);
console.log(1 - function(){});

使用 == 转换  

如果两个操作数 一个是数字 一个是字符串 隐式将字符串转为数字进行比较

如果两个操作数 一个是数字 一个是布尔值 隐式将布尔值转为数字进行比较

如果两个操作数 一个是布尔值 一个是字符串 隐式将两者转为数字进行比较

console.log(1 == '1');
console.log(1 == true);
console.log('1' == true);

引用数据类型隐式转换

将引用数据类型转换为原始值(基本数据类型)，引用数据类型的toString() 和 valueOf()方法

console.log([].toString(),[].valueOf(),typeof ([].toString()),typeof ([].valueOf()));//"" [] string obejct
console.log({}.toString(),{}.valueOf(),typeof ({}.toString()),typeof ({}.valueOf()));


console.log([] + [],typeof([]+[]),'转换1');   // "" 转换1
console.log([] + {},'转换2',typeof([] + {}));   // [object Object] 转换2
console.log({} + {},'转换3',typeof({} + {}));   // [object Object][object Object] 转换3
console.log([].toString(),[].valueOf(),'转换4')
console.log({}.toString(),{}.valueOf(),typeof({}.toString()),typeof({}.valueOf()));

这里有个值得注意的点是

        重写toString() 和 valueOf()

                只有toString() 用toString()方法

                只有valueOf()  用valueOf()方法

                两者都有 用valueOf()方法

var obj = {
    name:"lisi",
    age:16,
    toString(){
        return 10
    },
    valueOf(){
        // return null
        return 20
    }
}
var b = 10;
console.log(obj + b);

显式转换

将其他类型转为string类型

        1.连接字符串 + ""

var a = 10;
var b = true;
console.log(a+"",typeof (a+""));
console.log(b+"",typeof (b+""));
console.log(null+"",typeof (null+""));
console.log(undefined+"",typeof (undefined+""));

       

         2.用tostring()方法  null和undefined不能用 没有包装器     数字可以变为2进制 8进制 16进制

var a = 10;
var b = true;
console.log(a.toString(),typeof(a.toString()));
console.log(b.toString(),typeof(b.toString()));
// console.log(null.toString(),typeof(null.toString()));
// console.log(undefined.toString(),typeof(undefined.toString()));
console.log(a.toString());
console.log(a.toString(2));  //将number转为2进制的string
console.log(a.toString(8));  //将number转为8进制的string
console.log(a.toString(16));    //将number转为16进制的string

        

         3.用String()方法

console.log(String(a),typeof String(a));
console.log(String(b),typeof String(b));
console.log(String(null),typeof String(null));
console.log(String(undefined),typeof String(undefined));

 

 将其他类型转为boolean类型

        1.使用Boolean()包装器函数

console.log(Boolean(10),typeof Boolean(10));                //true
console.log(Boolean('hello'),typeof Boolean('hello'));      //true
console.log(Boolean(null),typeof Boolean(null));            //false
console.log(Boolean(undefined),typeof Boolean(undefined));  //false

     

        2.使用!!或! (比较严谨)

console.log(!!10,typeof(!!10));                                 //true  
console.log(!!'hello',typeof(!!'hello'));                       //true
console.log(!!null,typeof(!!null));                             //false
console.log(!!undefined,typeof(!!undefined));                   //false
console.log(!10,typeof(!10));                                   
console.log(!'hello',typeof(!'hello'));
console.log(!null,typeof(!null));
console.log(!undefined,typeof(!undefined));

将其他类型转为number类型 

        1.使用 - * / %  

var a = '10';
var b = true;
var c = false;
console.log(+a,+b,+c,typeof(+a),typeof(+b),typeof(+c));
console.log(+null,+undefined,typeof(+null),typeof(+undefined));

        

        2.使用 Number()方法       

console.log(Number(a),typeof Number(a));
console.log(Number(b),typeof Number(b));
console.log(Number(c),typeof Number(c));
console.log(Number(null),typeof Number(null));
console.log(Number(undefined),typeof Number(undefined));
console.log(Number("123")); //123  如果仅包含数值，转换为对应的数值
console.log(Number("234.1")); //234.1 解析为对应的小数 
console.log(Number("+12.1")); //12.1 首位为符号位，其余为为数值，转换为对应的数值 
console.log(Number("1+2.3")); // NaN 符号位出现在其他位置，解析为NaN 
console.log(Number("0xa")); //10 如果仅包含十六进制格式，转为为对应的十进制的值
console.log(Number("010")); //10【注意】不会当做八进制被解析，结果为10。 
console.log(Number("")); // 0 空字符串被转换为0 
console.log(Number("123ac")); // NaN 包含其他字符： NaN 
console.log(Number(12)); //12

        3.使用 parseInt()方法    取整数         

console.log(parseInt(a),typeof parseInt(a)); //10
console.log(parseInt(b),typeof parseInt(b)); //NaN
console.log(parseInt(c),typeof parseInt(c)); //NaN
console.log(parseInt(null),typeof parseInt(null));   //NaN
console.log(parseInt(undefined),typeof parseInt(undefined)); //NaN
console.log(parseInt("123")); //123；如果仅包含数值，转换为对应的数值
console.log(parseInt("234.1")); //234；小数点后面的数值省略 
console.log(parseInt("+12.1")); //12； 首位为符号位，其余为为数值，转换为整数 
console.log(parseInt("1+2.7")); //1； 符号位出现在其他位置，保留符号位前面的数值 
console.log(parseInt("0xa")); //10； 如果仅包含十六进制格式，转为为对应的十进制的值
console.log(parseInt("010")); //10； 【注意】不会当做八进制被解析，结果为10
console.log(parseInt("")); //NaN；空字符串被转换为NaN
console.log(parseInt("1+2.3")); //1;如果首位为数值，依次向后解析，找到连续的数值，直到遇到第一个非数值的，将之前获取的数值转换为Number返回 
console.log(parseInt("123ac")); //123;

        

        4.使用 parseFloat()方法  保留小数        

console.log(parseFloat('10'),typeof parseFloat('10'));
console.log(parseFloat('10.5'),typeof parseFloat('10.5'));
console.log(parseFloat(''),typeof parseFloat(''));
console.log(parseFloat('null'),typeof parseFloat('null'));
console.log(parseFloat('undefined'),typeof parseFloat('undefined'));
console.log(parseFloat('true'),typeof parseFloat('true'));

console.log(parseFloat("123")); //123；如果仅包含数值，转换为对应的数值
console.log(parseFloat("234.1")); //234.1；保留小数点后面的数值 
console.log(parseFloat("+12.1")); //12.1； 首位为符号位，其余为为数值，转换为整数 
console.log(parseFloat("1+2.6")); //1；符号位出现在其他位置，保留符号位前的数值 
console.log(parseFloat("0xa")); //0； 【注意】不会当做十六进制来解析。
console.log(parseFloat("010")); //10； 【注意】不会当做八进制被解析，结果为10
console.log(parseFloat("")); //NaN；空字符串被转换为NaN
console.log(parseFloat("1+2.3")); //1;如果首位为数值，依次向后解析，找到连续的数值，直到遇到第一个非数值的，将之前获取的数值转换为Number返回 
console.log(parseFloat("123.3ac"));//123.3;