JavaScript中运算符的应用


前言

什么是运算符?
  它是完成一系列操作的符号。运算符用于将一个或几个值进行计算而产生一个新的值,操作数可以是常量或变量。
  JavaScript的运算符按照操作数的个数可以分为单目运算符、双目运算符、三目运算符;按功能可以分为算术运算符、比较运算符、赋值运算符、字符串运算符、逻辑运算符、条件运算符等。


一、算术运算符

算术运算符用于程序中的加、减、乘、除等运算。在JavaScript中常用的算术运算符
加(+)、减(-)、乘(*)、除(/)、求模(%)、自增运算符(++)、自减运算符(–)

<script>
document.write(10+20);
// 返回值为30            
document.write(10-20);
// 返回值为-10            
document.write(10*20);            
// 返回值为200             
document.write(10/20);            
// 返回值为0.5             
 document.write(7%4);           
// 返回值为3             
document.write(2%5);            
// 返回值为2             
document.write("<p>")            
var i=1            
document.write(i++);            
//  返回的值是1,在使用i之后使i的值加1                   
document.write(++i);             
//  返回的值是3,在使用i之前使i的值加1
</script>        

二、字符串运算符

+(连接两个字符串)

+=(连接两个字符串并加结果赋给第一个字符串) a+=b相当于a=a+b

实例:将多个字符串进行连接,并将结果显示在页面中

<script>
	var name,age,height,weight;
	name="roddy";
	age=21;
	height="178cm";
	weight="55公斤";
	alert("姓名:"+name+"\n年龄:"+age+"\n身高:"+height+"\n体重:"+weight);
</script>

运行代码,结果如下所示。
在这里插入图片描述

三、比较运算符

<  >  <=  >=  
==(等于。只根据表面值进行判断,不涉及数据类型)
 ===(绝对等于。根据表面值和数据类型同时进行判断) 
 !=(不等于。只根据表面值进行判断,不涉及数据类型)
 !==(不绝对等于。根据表面值和数据类型同时进行判断)
 
数字与布尔:进行数字的比较
数字与字符串:把字符串转换为数再比较(视情况而定)
布尔与字符串:把两边都转换为数字在进行比较
null==undefined>>true(null与undefined比较结果为true)
null或者undefined与其他类型比较都是false

实例:不同数据类型之间的比较

<script>
document.write("520"==520);
// 返回的值为true,因为它只根据表面值进行判断,不涉及数据类型
document.write("520"===520);
// 返回的值为false,因为它根据表面值和数据类型同时进行判断
console.log(1>true);
// 结果为false
console.log(1>"luodi");
// 结果为false
console.log("zu">"luodi");
// 结果为true
console.log(null==undefined);
// 结果为true,null与undefined比较结果为true
console.log(null>undefined);
// 结果为false,null与其他类型比较(非数字和布尔类型)都为false
console.log(null<undefined);
// 结果为false,null与其他类型比较(非数字和布尔类型)都为false
console.log(null>true);
// 结果为false,两边都转换为数字类型再进行比较
console.log(null<true);
// 结果为true,两边都转换为数字类型再进行比较
console.log(null>520);
// 结果为false,null转换为数字类型再进行比较
console.log(null<520);
// 结果为true,null转换为数字类型再进行比较
console.log(null>"ld123")
// 结果为false,null与其他类型比较(非数字和布尔类型)都为false
console.log(null<"ld123")
// 结果为false,null与其他类型比较(非数字和布尔类型)都为false
console.log(undefined>null);
// 结果为false,undefined与其他类型比较(非数字和布尔类型)都为false                                                           
</script>

四、赋值运算符

= += -= *= /= %=
a=b 将b的值赋给a
a+=b 相当于a=a+b
a-=b 相当于a=a-b
a*=b 相当于a=a*b
a/=b 相当于a=a/b
a%=b 相当于a=a%b
var a=2,b=3;
console.log(a+=b);
// 结果为5
console.log(a-=b);
// 结果为2
console.log(a*=b);
// 结果为6
console.log(a/=b);
// 结果为2
console.log(a%=b);
// 结果为2

五、逻辑运算符

&&(与)   ||(或)   !(非)           
&&   两边的表达式 只有都为真 结果才为真 只要有一边为假结果则为假
0&&任何数 0
&&左边的为false   结果为false
如果两边都为数字则输出最后一个数字

六、条件运算符

条件运算符示JavaScript支持的一种特殊的三目运算符,其语法格式如下:

表达式?结果1:结果2

如果“表达式”的值为true,则整个表达式的结果为“结果1”,否则为“结果2”
实例:使用条件运算符实现一个简单的判断功能。

var age=21;
var status;
status=(age>=18)?"成年人":"未成年人";
document.write("Roddy今年"+age+"岁");
document.write("<br>");
document.write("Roddy是"+status+"");

运行代码,结果如下所示。
在这里插入图片描述

七、typeof运算符

// typeof运算符用于判断操作数的数据类型
// 数值         返回 number
// 字符串       返回 string
// 布尔值       返回 boolean
// undefined    返回 undefined
// null        返回 object
// 对象         返回 object
// 函数         返回 function

八、位运算

<script>
// & 位与
// 3&4
console.log(3&4)
// 将数据转换为2进制并且逐位相与
// 3    011
// 4    100
// 0    000
// 所以结果为0
       
// | 位或
console.log(3|4)
// 将数据转换为2进制并且逐位相或
// 3    011
// 4    100
// 7    111
// 所以结果为7
    
// >>  <<  左移右移运算符
console.log(14>>2)
// 14   1110
// 向右移两位变成11,转换为十进制为3,所以结果为3
console.log(14<<1)
// 14   1110
// 向左移一位变成11100,转换为十进制为28,所以结果为28
</script>

九、运算符优先级

  JavaScript运算符都有明确的优先级和结合性。优先级较高的运算符将先于优先级较低的运算符进行运算。结合性则是指具有同等优先级的运算符将按照怎样的顺序进行运算。
在这里插入图片描述
实例:

<script>
var a;
a=20-(5+6)<10&&2>1;
alert(a)
</script>

运行结果如下:
在这里插入图片描述
实例:

<script>
var a=1;
b=a=10;
alert("b的值为:"+b)
</script>

运行结果如下:
在这里插入图片描述
结论:当表达式中连续出现几个运算符优先级相同时,其运算的优先顺序由其结合性决定。
例如,运算符“+”是向左结合的,所有在计算“a+b+c”的值时,会先计算“a+b”的值。
而赋值运算符“=”是向右结合的,所有在计算“a=b=1”的值时,会先计算“b=1”。

猜你喜欢

转载自blog.csdn.net/RoddyLD/article/details/112791727