资讯专栏INFORMATION COLUMN

JavaScript 运算符与逻辑分支

yankeys / 1619人阅读

摘要:复合赋值运算符通过的形式表示,表示算术运算符。含有的运算都为和都不等于,逻辑运算符逻辑运算符通常用于布尔值的操作,一般和关系运算符配合使用,有三个逻辑运算符逻辑与逻辑或逻辑非。无论这个值是什么数据类型,这个运算符都会返回一个布尔值。

运算符 一元运算符

只能操作一个值的运算符叫做一元运算符

//后取值 先执行运算, 再取值
//前取值 先取值, 再执行运算
 前自加:
  var x=5;
  var num1=++x;  // 相当于x=x+1; var num1=x;
  console.log("num1="+num1+"  x="+x);  //num1=6  x=6

  后自加:
  var x=5;
  var num2=x++;  // 相当于 var num2=x; x=x+1;
  console.log("num2:"+num2+"  x:"+x);  //num2=5  x=6

  前自减:
  var x=5;
  var num3=--x;  //相当于 x=x-1; var num3=x;
  console.log("num3="+num3+"  x="+x);  //num3=4  x=4

  后自减
  var x=5;
  var num4=x--;  //相当于 var num4=x;  x=x-1;
  console.log("num4="+num4+"  x="+x);  //num4=5  x=4

其他类型应用一元运算符的规则

var b = "89";
b++; //90,数值字符自动转换成数值
var b= "ab";
b++; //NaN,字符串包含非数值转成NaN
var b = false;
b++; //1,false转成数值0,累加就是1
var b = 2.3;
b++; //3.3,直接加1
赋值运算符

赋值运算符用等于号(=)表示,就是把右边的值赋给左边的变量。
复合赋值运算符通过 x=的形式表示,x 表示算术运算符。
如: +=, -=, *=, /=, %=等

  =   等于    x=2;
  +=  加等于  x+=3; 等同于x=x+3;
  -=  减等于  x-=3; 等同于x=x-3;  
  *=  乘等于  x*=3; 等同于x=x*3;
  -=  除等于  x/=3; 等同于x=x/3;
  %=  余等于  x%=3; 等同于x=x%3;
关系运算符

用于进行比较的运算符称作为关系运算符

关系运算符的比较规则:

数字和数字比较, 直接比较大小

数字和字符串比较, 字符串转换为数字后再比较

字符串和字符串比较, 进行字符的ASCII码值比较

比较注意事项:

布尔值 ture=1, false=0

含有NaN的运算都为false,undefined 和null 都不等于0或者flase

如果要恒等, 则必须值和类型都要相等;

> 大于  若左边数据大于右边数据,返回 true,否则返回 false。 
3>2 //true

< 小于  若左边数据小于右边数据,则返回布尔值true,否则返回false。  
2<3 //true

>=  大于等于  若左边数据大于或等于右边数据,返回 true,否则返回 false。 
2>=2 //true
3>=2 //true

<=  小于等于。若左边数据小于或等于右边数据,返回 true,否则返回 false。
2<=2  //true
2<=3  //true

==  相等  若两数据大小相等,返回 true,否则返回 false
2==2 //true
2=="2" //true

!=  不等  若两数据大小不相等,返回 true,否则返回 false。 
2!=5 //true

=== 全等(恒等) 若两数据大小和数据类型都相等,返回 true,否则返回 false。
55==="55" //false
55===55  //true

!== 不全等(不恒等) 若两数据大小或数据类型不相等,返回 true,否则返回 false。
55!=="55" //true
55!==55  //false=0

布尔值 ture=1, false=0
false == 0   //true
true == 1    //true 
true == 2    //false

undefined 是派生自 null 的,两个数据大小相等,数据类型不等。
null == undefined  //true
null === undefined //false

含有NaN的运算都为false
"NaN" == NaN  //false
5 == NaN     //false
NaN == NaN   //false

undefined 和null 都不等于0,flase 
null == 0    //false
null == false    //false

undefined == 0    //false
undefined == false    //false
逻辑运算符

逻辑运算符通常用于布尔值的操作,一般和关系运算符配合使用,有三个逻
辑运算符: 逻辑与&&(AND)、逻辑或||(OR)、逻辑非!(NOT)。

&& 逻辑与:
如果第一个操作数返回是 false,第二个数不管是true还是false都会返回false。
即符号两边的操作数为真,返回true,否则返回false。

var flag=(true) && (true)   //true
var flag=(false) && (true)  //false
var flag=(false) && (false)  //false

|| 逻辑或:
如果第一操作数的求值结果为 true,第二个数不管是true还是false都会返回true。
即符号两边的操作数同时为假,返回false,否则返回true。

var flag=(false) || (false)  //false
 var flag=(true) || (true)    //true
 var flag=(true) || (false)   //true

! 逻辑非:
逻辑非运算符可以用于任何值。无论这个值是什么数据类型,这个运算符都会返
回一个布尔值。它的流程是:先将这个值转换成布尔值,然后取反,规则如下:

操作数为真,返回false,否则返回true
var flag=!(true);   //false
var flag=!(false);  //true

操作数是一个空字符串, 返回true; 非空字符串, 返回false
var flag=!("")     //true
var flag=!("test") //false

操作数是数值0, 返回true; 任意非0数值(包括 Infinity),返回false
var flag=!(0) //true
var flag=!(1)  //false

操作数是NaN, 返回true
var flag=!(NaN) //true

操作数是undefined, 返回true
var flag=!(undefined) //true
字符串运算符

字符串运算符: 字符串运算符只有一个,即:“+”。
它的作用是将两个字符串相加。 规则:至少一个操作数是字符串

var result1="hello"+"world"; // 两个都是字符串, 直接连接两个字符串
console.log(result1); //helloworld
console.log(typeof result1);   

//如果其中有一个是字符串, 另一个是其他类型, 则会先将其他的类型强制转换成字符,然后再连接
var result2="hello"+2; 
console.log(result2); //hello2
console.log(typeof result2);  
三目运算符(三元条件运算符)

三目运算符(三元条件运算符): 表达式 ? 值1 : 值2
如果表达式的值为true,则结果取值1。否则为值2

语法为:(如果条件表达式的值为true,则结果取值1。否则为值2。)
条件表达式 ? 值1 : 值2

var age=11;
var status = (age >= 18) ? "major" : "minor";

当age大于等于18的时候,语句将第一个值“major”赋值给status;否则将第二个值“minor”赋值给status。
运算符的优先级

| 运算符 |描述 |
| ------------- |:-------------: |
| . [] () |对象成员存取、数组下标、函数调用等 |
| ++ -- ~ ! delete new typeof void |一元运算符 |
|* / % |乘法、除法、求余|
|+ - +|加法、减法、字符串连接|
|<< >> >>>|移位|
|< <= > >= instanceof |关系比较、检测类实例|
|== != === !==| 恒等(全等)|
|& |位与|
|^ | 位异或|
| | |位或 |
|&& |逻辑与|
| |||逻辑或|
|?:|三元条件|
|= x= |赋值、运算赋值|
|= x= |赋值、运算赋值|
|, |多重赋值、数组元素|

表达式

表达式是javascript中的一个短语,表达式指的是可用于计算的式子,即可能产生一个值的式子。
变量名也是一种简单的表达式,它的值就是赋值给变量的值。
复杂的表达式由运算符和操作数 (变量或常量) 组成的式子
算术运算符组成的式子叫算术表达式
关系运算符组成的式子叫关系表达式或者条件表达式
逻辑运算符组成的式子叫做逻辑表达式
如:2+3;a+5;c>3; a&&b等

流程控制

JavaScript有三种基本的流程控制结构:顺序结构、选择结构和循环结构,流程控制是用来控制代码的执行顺序。
JavaScrip在顺序结构中可以包含选择结构和循环结构

顺序结构:
指按照语句出现的先后顺序依次执行

选择结构:
指按照给定的逻辑条件来决定执行顺序。
选择结构可以分为单向选择、双向选择和多向选择。但无论是单向还是多向选择,程序在执行过程中都只能执行其中一条分支。

循环结构
指根据代码的逻辑条件来判断是否重复执行某一段程序。若逻辑条件为true,则重复执行,即进入循环,否则结束循环。

循环结构可以先判断逻辑条件,也可以先执行循环体

if单支语句
if条件判断语句的写法:
if(表达式){
执行语句
}

当括号内的表达式结果成立( 为true 时) ,则执行大括号内的语句,否则不执行。

注意:

if后面的()不能省略。

一条执行语句可以省略{}, 多条时不能省略{}, 建议不管是一条还是多条都写上{}

if双分支语句的写法:
if(表达式){
执行语句1
}
else{
执行语句2
}

当if 括号内的表达式结果成立,执行执行语句1 ,否则执行执行语句2;

注意:else语句必须和if语句搭配出现使用
if多分支语句

if多分支语句的写法:

if(表达式){
执行语句1
}
else if(表达式2){
执行语句2
}
else if(表达式3){
执行语句3
}
else{
执行语句n
}

从上往下,满足哪个条件就执行其相对应的语句,都不满足时,执行最后的else
的语句,只能进入其中之一。

if的嵌套

将整个if语句块插入另一个if语句块中

if (表达式1) {
  if (表达式2) {
    if (表达式3){
      语句;
    }
    else{
      语句;
    }
  }
  else{
    语句;
  }
}
注意: 嵌套if时,最好不要超过三层; 内层的每一对if...else代码要缩进且对
齐;编写代码时,else要与最近的if配对。

需求:
输出不同年龄段的称呼:
少年:18周岁以下,青年:18周岁至40周岁,中年:40周岁至60周岁,老年:60周岁以上

婴儿[0岁-1岁)、幼童[1岁-4岁)、小童[4岁-7岁),中童[7岁-13岁)、
大童[13岁-18岁),成年人等于18岁

switch case 语句

用于基于不同的条件来执行不同的动作,如果有多个条件,可以使用嵌套的if语句来解决,但这种方法会增加程序的复杂度,降低程序的可读性。

//n可以是变量/表达式,将n的值与常量a1、a2、……比较,若n与其中某个值相等时,执行相应数据后面的语句,且当遇到关键字break时,程序跳出switch结构;若找不到与n相等的值,则执行关键字default下面的语句。

switch(n)
{
    case a1:
        执行代码块 1
        break;
    case a2:
        执行代码块 2
        break;
    default:
        与 case a1 和 case a2 不同时执行的代码
}

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/100690.html

相关文章

  • JavaScript 条件表达式深入学习

    摘要:本文章记录本人在深入学习条件表达式中看书理解到的一些东西,并且整理记录下来,加深记忆和方便之后的复习。表达式的值具有线性特征,如对连续的区间值进行判断。 本文章记录本人在深入学习js条件表达式中看书理解到的一些东西,并且整理记录下来,加深记忆和方便之后的复习。主要是深入学习if else和switch语句的一些性能优化和逻辑思维。 提高条件性能的策略 js的条件表达式和其他语言一样...

    ARGUS 评论0 收藏0
  • 2.java算符逻辑控制

    摘要:如果条件为,则逻辑非运算符将得到进行逻辑判断的顺序为从左到右。再次检测布尔表达式。其作用域限定在循环语句块,其值与此时数组元素的值相等。 运算符和逻辑控制 运算符 java中的运算符可以分为以下几种: 算符运算符 关系运算符 位运算符 逻辑运算符 赋值运算符 三目运算符 算符运算符 操作符 描述 + 加法 - 减法 * 乘法 / 除法 % 取余(模) ...

    dingding199389 评论0 收藏0
  • javascript性能优化方面的知识总结

    摘要:插入迭代器如前面两条语句可以写成使用直接量替换为替换为替换为如果要创建具有一些特性的一般对象,也可以使用字面量,如下前面的代码可用对象字面量来改写成这样使用优化多次一旦需要更新请考虑使用文档碎片来构建结构,然后再将其添加到现存的文档中。 好赞,收藏自 总结的js性能优化方面的小知识(不喜勿喷) 前言 一直在学习javascript,也有看过《犀利开发Jquery内核详解与实践》,对...

    BlackHole1 评论0 收藏0
  • 网页动画性能日志(一)

    摘要:当用户滚动页面时,合成线程会通知主线程更新页面中最新可见部分的位图。但是,如果主线程响应地不够快,合成线程不会保持等待,而是马上绘制已经生成的位图,还没准备好的部分用白色进行填充。 动画做多了,自然就要考虑性能,我打算出一个系列的日志,详细的讲解一下网页动画性能相关的知识,如果你已经可以运用css3 canvas来做动画,可以来参考一下。 目前我做的最复杂的动画就是360搜索中PC端的...

    zhiwei 评论0 收藏0
  • Python 工匠:编写条件分支代码的技巧

    摘要:系列文章工匠善用变量改善代码质量序言编写条件分支代码是编码过程中不可或缺的一部分。而进行条件分支判断时用到的也是这个值重点来了,虽然所有用户类实例的布尔值都是真。 欢迎大家前往腾讯云+社区,获取更多腾讯海量技术实践干货哦~ 本文由鹅厂优文发表于云+社区专栏 作者:朱雷 | 腾讯IEG高级工程师 『Python 工匠』是什么? 我一直觉得编程某种意义是一门『手艺』,因为优雅而高效的代码...

    KaltZK 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<