【JavaScript运算符与表达式】

一、表达式

1.原始表达式:2.14,“test”,true/false,null……复合表达式:10*20……

2.数组、对象的初始化表达式:new Array(1,2),[1,undefined,4],{x:1,y:2}=>var o = new Object();o.x=1;o.y=2;……

3.函数表达式:var fe = function(){}; (function(){console.log('hello');})()……

4.属性访问表达式:var o = {x:1}; o.x; o['x'];……

5.调用表达式:func()……

6.对象创建表达式:new Func(1,2); new Object()……

二、运算符

1、算术运算符

  运算符 = 用于给 JavaScript 变量赋值。

  算术运算符 + 用于把值加起来。

运算符 + - * / % ++ --
描述 加法 减法 乘法 除法 取模(余数) 自增 自减

 

 

 

 

 

例子:

 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="UTF-8">
 5         <title></title>
 6         
 7         <script type="text/javascript">
 8         //算术运算符
 9         var a=2,b=5;
10         document.write(a+b+"=7"+"<br />");
11         document.write(a-b+"=-3"+"<br />");
12         document.write(a*b+"=10"+"<br />");
13         document.write(a/b+"=0.4"+"<br />");
14         document.write(a%b+"=2"+"<br />");
15         document.write(a%-b+"=2"+"<br />");
16         document.write(-a%-b+"=-2"+"<br />");
17         document.write(-b%-a+"=-1"+"<br />");
18         //+还有连接的意思
19         document.write(a+'2b'+"=22b"+"<br />");
20         document.write(a+b+'2b'+"=72b"+"<br />");
21         document.write('3'+'8'+"=38"+"<br />");
22         document.write(a+b*'2sb'+"=NaN"+"<br />");//只有加号可以连接
23         //自增自减运算符(整型,浮点型,null支持、字符串不支持)
24         var z=2;
25         //alert(h++);   //2
26         //alert(h);     //3
27         //alert(++h);   //4
28         //alert(--h);   //3
29         x=3.123;
30         //alert(--x);  //2.123
31         //alert(++x);  //3.123
32         n=null;
33         //alert(++n);   //1
34         //alert(--n);   //0
35         s=undefined;
36         //alert(++s);    //NaN
37         m='3b';
38         //alert(++m);  //NaN
39         alert(--m);    //NaN  
40         </script>
41     </head>
42     <body>
43     </body>
44 </html>

2、逻辑运算符

运算符 && || !
描述 逻辑与(and) 逻辑或(or) 逻辑非,取逻辑的反面

 

 

 

注意:这里会出现短路问题

表达式a && 表达式b :  计算表达式a(也可以是函数)的运算结果,

                                         如果为 True, 执行表达式b(或函数),并返回b的结果;

                                         如果为 False,返回a的结果;

 简单的说就是 逻辑与运算符属于短路操作,如果有第一个操作数返回的是false,第二个不管是true还是false都返回false。

表达式a || 表达式b :   计算表达式a(也可以是函数)的运算结果,

                                         如果为 Fasle, 执行表达式b(或函数),并返回b的结果;

                                         如果为 True,返回a的结果;

简单的说就是 逻辑或运算符也属于短路操作,如果有第一个操作数返回的是true,第二个不管是true还是false都返回true。

 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="utf-8">
 5         <title></title>
 6     </head>
 7     <body>
 8         <script type="text/javascript">
 9             //逻辑运算符的例子
10             //要求两个表达式为true,结果才是true
11 //            alert(true && true);
12 //            alert(true && false);
13 //            alert(false && true);
14 //            alert(false && false);
15             //如果第一个表达式为false,整个结果为false,就把第二个表达式短路了
16             var i=0,j=1;
17             if(i-- && j++){                        //0->false && 
18                 document.write('hello');
19             }else{
20                 document.write('world');
21             }
22             //alert(i);  //-1
23             //alert(j);    //1
24             //逻辑或|| 
25             //两个表达中有一个为true,整个结果为true
26 //            alert(true || true);
27 //            alert(true || false);
28 //            alert(false || true);
29 //            alert(false || false);
30             //如果第一个表达式为true,整个结果为true,把第二个表达式短路了
31             i=1;
32             j=0;
33             if(i-- || ++j){
34                 document.write('aa');
35             }else{
36                 document.write('bb');
37             }
38 //            alert(i);        //0
39 
40 //            alert(j);        //0
41         //逻辑非 !,取反的作用
42 //        alert(!true);
43 //        alert(!false);
44         </script>
45     </body>
46 </html>

3、三元运算符

(expr1) ? (expr2) : (expr3)

语法解释:在 expr1 求值为 TRUE 时整个表达式的值为 expr2,否则为 expr3。

 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="utf-8">
 5         <title></title>
 6     </head>
 7     <body>
 8         <script type="text/javascript">
 9             /*
10              三元运算符的例子
11              if(exp){
12                  exp为true的代码段;
13              }else{
14                  exp为false的代码段;
15              }
16              exp1?exp2:exp3;
17              */
18             if(3>1){
19                 document.write('aa');
20             }else{
21                 document.write('bb');
22             }
23             document.write('<br/>');
24             var res=3>1?'aa':'bb';
25             document.write(res);
26             document.write('<br/>');
27             var x=0/0;
28             var x=123;
29             res=isNaN(x)?0:x;
30             alert(res);
31         </script>
32         
33     </body>
34 </html>

4、比较运算符

运算符 描述 例子 运算结果
== 等于 2 == 3 FALSE
=== 恒等于(值和类型都要做比较) 2 === 2
2 === "2"
TRUE
FALSE
!= 不等于,也可写作<> 2 == 3 TRUE
> 大于 2 > 3 FALSE
< 小于 2 < 3 TRUE
>= 大于等于 2 >=3 FALSE
<= 小于等于 2 <= 3 TRUE

 

 

 

 

 

 

 

 

 

//            比较运算符的例子
//            alert(3>1);
//            alert(3>=1);
//            alert(3<=12);
//            alert(3<2);
              var res=1==true;
              res=1=='1';
              res=3=='3king';
              res=0==null;//false 
              res=0!=null;
              res=1===true;
              res=1===true;  //true //false
//            alert(res);
//            alert(NaN==NaN);//false
              alert(undefined==undefined);    

4、连接符

连接运算符 + 主要用于连接两个字符串或字符串变量。因此,在对字符串或字符串变量使用该运算符时,并不是对它们做加法计算。

1             //字符串连接符+
2             document.write('hello'+' yimentu '+'<br/>');
3             document.write(1+'king'+'<br/>');
4             var i=1,j=2,z=3;
5             document.write(''+i+j+z);
6             document.write('<br/>');
7             

5、赋值运算符

赋值运算符 = 用于赋值运算,赋值运算符的作用在于把右边的值赋值给左边变量。

 1             //赋值运算符的例子
 2             var username='king';
 3             document.write('用户名为:'+username+'<br/>');
 4             //+= -= *= /= %= .=
 5             var a=1;
 6             a+=3;//a=a+3;
 7                        //alert(a);
 8             a-=6;//-2
 9             a*=8;//-16
10             (a/=4);  //-4
11             a%=9;//a=a%9
12             //document.write(a);
13             document.write('<br/>');
14             var str1=' hello ',str2=' world ';
15             str2+=str1;//str2=str2+str1;
16             //document.write(str2);

 

posted @ 2018-01-06 22:37  张晓NAN  阅读(441)  评论(1编辑  收藏  举报