Javascript(二) 类型转换、运算符

最新推荐文章于 2022-03-06 17:31:40 发布

原创最新推荐文章于 2022-03-06 17:31:40 发布 · 289 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript

JavaScript 专栏收录该内容

67 篇文章

订阅专栏

类型转换

隐式类型转换
由于 JavaScript 是弱类型/松散类型的，在任何情况下都可以强制转换

转换为字符串: 将⼀个值加上空字符串可以轻松转换为字符串类型

        let  num=100;
        let  boo=true;
        let str1=num+"";
        let str2=boo+"";
        console.log(typeof str1) // string
        console.log(typeof str2) // string

转换为数字: 使⽤用一元的加号操作符，可以把字符串转换为数字

        let str3="haha";
        let num3=+str3;
      
        let boo3=true;
        let num4=+boo3;
        console.log(typeof num3); //number
        console.log(typeof num4); //number

转换为布尔值: 使⽤否操作符(!)两次，可以把一个值转换为布尔型。

        let str1="100";
        let str2="haah";
        let num=200;
        let num2=0;

        let boo1=!!str1;
        let boo2=!!str2;
        let boo3=!!num;
        let boo4=!!num2;
        console.log(boo1);// true
        console.log(boo2);// true
        console.log(boo3);// true
        console.log(boo4);// false

显式类型转换

使⽤ JavaScript 的包装型的构造函数进行类型转换

  let str="666";
        let str2="hahah";
        let boo=true;

        let num1=Number(str);
        let num11=Number(str2);
        let num2=Number(boo);

        console.log(num1); //666
        console.log(typeof num1);//  number

        console.log(num11); //NaN
        console.log(typeof num11);// number

        console.log(num2);// 1
        console.log(typeof num2);// number

        let str=String(100);
        let str2=String(true);

        console.log(str); // 100
        console.log(str2);// true
        console.log(typeof str);// string
        console.log(typeof str2);// string

        let str="hd";
        let str2="";
        let num1=916;
        let num2=0;

        let boo1=Boolean(str);
        let boo2=Boolean(str2);
        let boo3=Boolean(num1);
        let boo4=Boolean(num2);

        console.log(boo1);// ture
        console.log(boo2);// falese
        console.log(boo3);// true
        console.log(boo4);// false

使用数据类型的转换函数进行类型转换

        let  num=100;
        let boo=true;

        let str=num.toString();
        let  str2=boo.toString();
        console.log(str);//100
        console.log(str2);//true

        console.log(typeof str);// string
        console.log(typeof str2);// string

        let str1="99.745";
        let str2="100haha234";
        let boo=true;

        let int1=parseInt(str1);
        let int2=parseInt(str2);
        let int3=parseInt(boo);

        console.log(int1);// 结果：99
        console.log(int2);// 结果：100
        console.log(int3);// 结果：NaN

         let  str="100.345";
         let flo=parseFloat(str);
         console.log(flo);// 100.345

运算符

JavaScript 提供了了⼀组⽤用于操作数据值的运算符。

算数运算符（+ - * / % ++ --）
比较运算符（> >= < <= == != === !==）
逻辑运算符（&& || !）
赋值运算符（= += -= *= /= %= ）
字符串连接运算符（+）
三元运算符（? :）
特殊运算符（typeof instanceof delete）

算数运算符

给定 A=20 ，B=10 条件，下述表格描述算数运算符:

算数运算符的基本操作⽐较简单，但下述情况需要特别注意:

如果运算数中的一个或两个是字符串类型，JavaScript 会⾃动转换为数字值，再进行计算。
如果运算数中的一个或两个是字符串类型，但其中的字符不是数字，JavaScript 会自动转换数字值失败，得到 NaN 结果。任何一个运算数是 NaN，结果都是 NaN。

布尔值 false 和 true 会转换为 0 和 1 进行计算

求余运算符
求余运算符，用于计算两个运算数整除后的余数。

console.log( 10 % 3 );// 输出 1
console.log( -10 % 3 );// 输出 -1
console.log( 10 % -3 );// 输出 1
console.log( -10 % -3 );// 输出 -1

// 余数的符号和被除数相同

自增运算符

自增运算符，用于整数值逐次加 1。分别具有两种⽤用法:

前置型：⾃增运算符位于运算数之前。先加 1，再赋值。

后置型：自增运算符位于运算数之后。先赋值，再加 1。

var x = 3; 
console.log( x++ );// 输出 3 
console.log( x );// 输出 4
var y = 3;
 console.log( ++y );// 输出 4
 console.log( y );// 输出 4

自减运算符

自减运算符，用于整数值逐次减 1。分别具有两种⽤用法:

前置型：自增运算符位于运算数之前。先减 1，再赋值。

后置型：自增运算符位于运算数之后。先赋值，再减 1。

var x = 3; 
console.log( x-- );// 输出 3 
console.log( x );// 输出 2
var y = 3; 
console.log( --y );// 输出 2 
console.log( y );// 输出 2

比较运算符
给定 A=20 ，B=10条件，下述表格描述比较运算符:

全等与全不等

var x = 10; 
var y = '10';
console.log( x == y );// 输出 true 
console.log( x === y );// 输出 false 
console.log( x != y );// 输出 false 
console.log( x !== y );// 输出 true

isNaN 函数
isNaN() 函数⽤于判断其参数是否为 NaN（非数字值）。
多用于检测使用类型转换函数进行数据类型转换后的结果是否为合法的数字值。

值得注意的是: NaN 与任何值（包括自身）进⾏比较，结果都是 false。不能使⽤ == 或者 === 运算符判断某个值是否是 NaN，而只能使⽤用isNaN() 函数。

        console.log(isNaN(parseInt('123.45a')));// 输出 false
        console.log(isNaN('123.45a'));// 输出 true
        console.log(isNaN(Number('123.45a')));// 输出 true

逻辑运算符

给定 A=20 B=10条件，下述表格描述⽐比较运算符:

逻辑与运算符

console.log( false && true );// 输出 false
 console.log( true && true );// 输出 true
// 数字值 1 和 0 转换为布尔值 true 和 false 
console.log( 1 && 0 );// 输出 false
// 空字符串串转换为布尔值 false，⾮非空字符串串转换为布尔值 true 
console.log( "" && "atguigu" );// 输出 false

逻辑或运算符

console.log( false || true );// 输出 true 
console.log( false || false );// 输出 false
// 数字值 1 和 0 转换为布尔值 true 和 false 
console.log( 1 || 0 );// 输出 true
// 空字符串串转换为布尔值 false，⾮非空字符串串转换为布尔值 true 
console.log( "" || "atguigu" );// 输出 true

逻辑非运算符

console.log( !true );// 输出 false
console.log( !1 );// 输出 false
console.log( !"atguigu" );// 输出 false

值得注意的是: 能被转换为 false 的值有null, 0, NaN, 空字符串串("") 和 undeﬁned。

逻辑短路路原则

所谓短路路原则，就是只要确定运算符前面的运算数为 true 或 false，就可以确定返回结果为 true 或 false。
逻辑与运算符

逻辑与运算符前面为false，结果都将返回逻辑与运算符前面的值。
逻辑与运算符前面为true，结果都将返回逻辑与运算符后面的值。

       console.log(true && true);// true
       console.log(false && true);// false
       console.log("haha" && "yaoyao");// yaoyao

逻辑或运算符

逻辑或运算符前面为false，结果都将返回逻辑或运算符后面的值。
逻辑或运算符前面为true，结果都将返回逻辑或运算符前面的值。

       console.log(true || true);//true
       console.log(false || true);//true
       console.log("haha" || "yaoyao");//haha

       console.log('string' && 0 && true);// 0
       console.log('' || 1 || false);// 1

赋值运算符

赋值运算符⽤用于为变量量或属性进⾏行行赋值操作

var atguigu = "atguigu";// 将字符串串 "atguigu" 赋值给变量量 atguigu 
var obj.x = 1;// 将数字值 1 赋值给 obj 对象的 x 属性

赋值运算符就是将右边运算数的值赋给左边运算数。

var C = A + B;// 将A+B的值赋给 c

值得注意的是: C += A由于运⾏行行时可以进⾏行行优化，执⾏行行效率都要优于C = C + A。

字符串连接运算符
字符串连接运算符使用的是加法运算符（+）。

两个运算数都是数字值时，"+"⽤用于两个运算数相加计算。
两个运算数中的⼀一个是字符串串时，"+"⽤用于字符串串连接计算。

       let  str="haha";
       let  str2="5";
       let  str3="2";
       let  str4=3;
       let  str5=1;
       console.log(str+str2);//haha5
       console.log(str2+str3);//52
       console.log(str4+str5);//4