JavaScript Day02 操作符及类型转换与流程控制语句 2

本文涉及的产品
全局流量管理 GTM,标准版 1个月
公共DNS(含HTTPDNS解析),每月1000万次HTTP解析
云解析 DNS,旗舰版 1个月
简介: JavaScript Day02 操作符及类型转换与流程控制语句 2

1.5.比较运算符

比较运算符在逻辑语句中使用,以判定变量或值是否相等。通常用于条件判断语句中。

比较运算符的优先级低于算术运算符,高于赋值运算符运算结果一般都为boolean


运算符 描述 比较 返回
== 等于 x == 8 false
x == 5 true
x == “5” true
=== 值相等并且类型相等 x === 5 true
x === “5” false
!= 不相等 x != 8
!== 值不相等或类型不相等 x !== 5 false
x !== “5” true
x !== 8 true
> 大于 x > 8 false
< 小于 x < 8 true
>= 大于或等于 x >= 8 false
<= 小于或等于 x <= 8 true
==

等同 的意思, 两边值类型不同的时候,要先进行类型转换为同一类型后,再比较值是否相等。

// 常用于相同类型的值的比较
console.log(123 == 345);  //false
console.log('123' == '345');  //false
// 如果两个值类型不同,也有可能相等,需根据以下规则进行类型转换在比较
// 如果一个是null,一个是undefined,那么相等
console.log(null == undefined); //true
// 如果一个是字符串,一个是数值,把字符串转换成数值之后再进行比较
console.log(123 == '123');  //true
//如果是整数类型和boolean类型的数值进行比较,1和true使用==比较结果为true,0和false使用==比较结果也为true,其它都为false;可以理解记忆为使用==比较整数时将1等同true,将0等同false。
console.log(1 == true); //true
console.log(0 == false);  //true
===

恒等 的意思,不做类型转换,类型不同的结果一定不等。

// 如果类型不同,就一定不相等
console.log(123 === '123'); //false
// 如果两个都是数值,并且是同一个值,那么相等;如果其中至少一个是NaN,那么不相等。(判断一个值是否是NaN,只能使用isNaN() 来判断)
console.log(123 === 123); //true
console.log(123 === 10 / 'a');  //false
// 如果两个都是字符串,每个位置的字符都一样,那么相等,否则不相等。
console.log('hello' === 'hello'); //true
// 如果两个值都是true,或是false,那么相等
console.log(true === true); //true
console.log(1 === true);  //false
// 如果两个值都是null,或是undefined,那么相等
console.log(null === null); //true
console.log(null === undefined);  //false

双等和三等的区别

双等表示只要值相等即可为真,而三等则要求不仅值相等,而且也要求类型相同。

建议:尽量使用严格运算符 三等。因为"=="不严谨,可能会带来一些违反直觉的后果。


注意:


1、对于string,number等基础类型,双等和三等是有区别的


1)不同类型间比较,双等之比较“转化成同一类型后的值”看“值”是否相等,===如果类型不同,其结果就是不等


2)同类型比较,直接进行“值”比较,两者结果一样


2、对于Array,Object等高级类型,双等和三等是没有区别的


进行“指针地址”比较


3、基础类型与高级类型,双等和三等是有区别的


1)对于==,将高级转化为基础类型,进行“值”比较


2)因为类型不同,===结果为false


!=

!= 和 ==用法类似 比较若类型不同,先偿试转换类型,再作值比较,最后返回值比较结果 。


!==

!== 和 === 用法类似 只有在相同类型下,才会比较其值。


‘>‘和’<’ 大于和小于

var a = 10;
var b = 20;
console.log(a > b); //false
console.log(a < b); //true
‘>=‘和’<=’ 大于等于和小于等于
var a = 10;
var b = 20;
console.log(a >= b); //false
console.log(a <= b); //true
非数值的情况下使用’>‘’<‘’>=‘’<=’

##### 对于非数值进行比较时,会先将其转换为数值,然后再进行比较。

// true转换为数值是1 false转换为数值是0
console.log(1 > true); // 结果为false
console.log(1 >= true); // 结果为true
console.log(1 > '0'); // 结果为true
console.log(1 > null); // 结果为true
//任何值和NaN作比较结果都是false
console.log(1 > 'hello'); // 结果为false 任何值和NaN作比较结果都是false

如果符号两侧都是字符串,不会将其转换为数值进行比较,而会分别比较字符串中字符的Unicode编码。

注意:所以在比较两个字符串型的数字时,一定要先转型。

console.log('134545353' > '5'); // 不转型则返回false
console.log('134545353' > +'5');// 这样结果才返回true

而在比较字符编码时,是一位一位进行比较的,如果符号两侧第一位一样,则比较下一位,所以借此可以用来对英文进行排序,而比较中文是没有意义的。

console.log('1' < '5'); // 结果为true
console.log('11' < '5'); // 结果也为true
console.log('be' > 'b'); // 结果为true 先比较第一位b的字符编码是一样的,再比较第二位,由于be有e,而b只有一位,所以be>b
console.log('be' < 'b'); // 结果为false

1.6.逻辑运算符

运算符 描述 例子
&& and (x < 10 && y > 1) 为 true
|| or ````(x==5
! not !(x==y) 为 true

1.6.1 && 与(同真才真,有假则假)

可应用于任意数值。如果有一个操作数不是布尔类型,逻辑与就不一定返回boolean类型

如果第一个操作数是null,NaN,undefined,false,0,""可被转换为false的值的时候返回该值

console.log(null && 'world'); //null

当第一个表达式为真,整个表达式的结果取决于第二个表达式,返回第二个表达式

console.log('hello' && 'world'); //world

当第一个表达式为假,整个表达式的结果就可以确定,返回第一个表达式

console.log(false && 'world'); //false

[null,NaN,undefined,false,0,“”]直接返回该操作数

console.log(''&&123);  //''  空字符串
console.log(0&&null);  //0
console.log(123&&345); //345
console.log(123&&undefined); //undefined

1.6.2 ||(有真才真,同假则假)

如果两个或多个操作数都是null,NaN,undefined,false,0,""可被转换为false的值的时候返回该值。

console.log(null || false); //false

如果第一个操作数是null,NaN,undefined,false,0,“” 则返回第二个操作数。

console.log(null || 'hello'); //'hello'

如果第一个操作数是真,直接返回第一个操作数。

console.log(123||345);   //123

当第一个表达式为真,整个表达式的结果就可以确定,返回第一个表达式

当第一个表达式为假,整个表达式的结果取决于第二个表达式,返回第二个表达式

有一个为true结果就为true

同时为false结果才为false

1.6.3 !(NOT)

经常被用作条件判断时的取反操作,类型判断等,还可以用’!'将变量转换为Boolean类型

var a;
if (!a) {}
console.log(!null);  //true
console.log(!undefined);  //true
console.log(!''); //true
console.log(!100);  //false
console.log(!'abc');  //false

1.7.三目运算符

·JavaScript中的三目运算符用作判断时

基本语法为: expression ? sentence1 : sentence2

当expression的值为真时执行sentence1,否则执行 sentence2

var age = 19;
var result = age > 16 ? "成年人":"未成年人";
// 当age大于16岁时,条件为真,执行sentence1,其次反之

2.类型转换

2.1.* => 字符串类型

2.1.1 其他类型转换为String

toString()函数

除了null,undefined,其他三种基本数据类型的变量均有一个toString()函数,该函数可以获取该变量指定值的字符串表示。

var a = true;
var b = 123;
console.log(a.toString(), b.toString());// 'true'  '123'
console.log(typeof a.toString(), typeof b.toString());//string string

如果变量为number类型,默认情况下toString()是以十进制格式返回数值的字符串表示,通过传递参数,可以输入以二进制,八进制,十六进制乃至任意有效进制格式的字符串值

var num = 10;
console.log(num.toString());  //"10"
console.log(num.toString(2))  //"1010"
console.log(num.toString(8))  //"12"
console.log(num.toString(16)) //"a"

任意其他数据与字符串相加都会转化为字符串

console.log(typeof (true + ''));  //string

2.2.* => 布尔类型

-其他数据类型转换为Boolean

Boolean()包装器

Boolean('hello') //true

使用!!转换任意其他数据类型都可以转换为布尔类型。

!!'hello' //true

2.3.* => 数字类型

其他数据类型转换为Number
Number()包装器

如果转换的值是null,undefined,boolean,number

Number(true); //1
Number(false); //0
Number(null); //0
Number(undefined); //NaN
Number(10); //10 如果是数字值,原样输出

如果转换的值是string

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

如果转换的值是null,undefined,boolean,均转换为NaN

如果转换的值是Number

parseInt(10); //10 如果是整数值,原样输出 parseInt(10.3); //10 如果是小数,舍去小数点一级后面的内容

如果转换的值是string

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

如果转换的值是null,undefined,boolean,均转换为NaN

如果转换的值是Number

parseFloat(10); //10 如果是整数值,原样输出 parseFloat(10.1); //10.1 如果是小数,保留小数点,但是如果是10.0结果为10

如果转换的值是string

parseFloat("123"); //123;如果仅包含数值,转换为对应的数值
parseFloat("234.1"); //234.1;保留小数点后面的数值 
parseFloat("+12.1"); //12.1; 首位为符号位,其余为为数值,转换为整数 
parseFloat("1+2.6"); //1;符号位出现在其他位置,保留符号位前的数值 
parseFloat("0xa"); //0; 【注意】不会当做十六进制来解析。
parseFloat("010"); //10; 【注意】不会当做八进制被解析,结果为10
parseFloat(""); //NaN;空字符串被转换为NaN
parseFloat("1+2.3"); //1;如果首位为数值,依次向后解析,找到连续的数值,直到遇到第一个非数值的,将之前获取的数值转换为Number返回 parseFloat("123.3ac");//123.3;
+
+"23"                    //23
+null                    //0
+undefined               //NaN
目录
相关文章
|
6月前
|
JavaScript 前端开发 算法
JavaScript 中算术操作符:全面解读、实战应用与最佳实践
【4月更文挑战第5天】本文探讨JavaScript中的算术操作符,包括加、减、乘、除、求余、自增、自减及复合赋值等,强调理解与熟练运用它们对提升编程效率和代码准确性的重要性。文中通过示例介绍了各种操作符的用法,同时提醒注意数据类型转换、浮点数精度、除以零错误以及利用短路求值优化逻辑等问题。通过学习,读者能更好地掌握算术操作符在不同场景的应用,提升编程技能。
76 1
|
1月前
|
JavaScript 前端开发 安全
如何处理 JavaScript 中的类型转换错误?
【10月更文挑战第9天】处理类型转换错误需要综合运用多种方法和策略,同时要保持对潜在问题的警惕性。通过合理的错误处理,可以提高程序的健壮性,减少因类型转换错误带来的负面影响。
20 0
|
1月前
|
JavaScript 前端开发
JS隐式类型转换规则
【10月更文挑战第9天】 不同的 JavaScript 引擎可能在隐式类型转换的具体实现上存在一些细微差别。理解这些隐式类型转换规则对于正确处理数据和避免错误非常重要。
16 0
|
2月前
|
JavaScript 前端开发
JavaScript 类型转换
JavaScript 类型转换
26 4
|
1月前
|
JavaScript 前端开发
JavaScript 流程控制语句
JavaScript 流程控制语句
|
3月前
|
JavaScript 前端开发
JavaScript基础&实战(3)js中的流程控制语句、条件分支语句、for循环、while循环
这篇文章讲解了JavaScript中的流程控制语句,包括基本的if条件判断、弹窗提示输入、switch条件分支语句、while和do...while循环以及for循环的使用和示例。
JavaScript基础&实战(3)js中的流程控制语句、条件分支语句、for循环、while循环
|
3月前
|
JavaScript
js流程控制语句
js流程控制语句
17 1
|
3月前
|
JavaScript
js流程控制语句
js流程控制语句
17 0
|
3月前
|
JavaScript 前端开发 开发者
深入解析JavaScript中的比较操作符
【8月更文挑战第20天】
27 0
|
3月前
|
JavaScript
js流程控制语句
js流程控制语句