js运算符，函数及使用，代码块

条件运算符

• 条件运算符也叫三元运算符
• 语法：条件表达式?语句1:语句2;
• 执行的流程：

条件运算符在执行时，首先对条件表达式进行求值，如果该值为true，则执行语句1，并返回执行结果。如果该值为false，则执行语句2，并返回执行结果。如果条件的表达式的求值结果是一个非布尔值，会将其转换为布尔值然后在运算.

逗号

• 使用逗号可以在一条语句中执行多次操作。
• 比如：var num1=1, num2=2, num3=3;
• 使用逗号运算符分隔的语句会从左到右顺 序依次执行

运算符的优先级

• .、[]、 new
• ()
• ++、 --
• !、~、+(单目)、-(单目)、typeof、
• void、delete
• %、*、/
• +(双目)、-(双目)
• << 、 >>、 >>>
• <、<=、>、>=
• ==、!==、===
• &
  ^
  |
  &&
  ||
  ?:
  • =、+=、-=、*=、/=、%=、<<=、>>=、>>>=、&=、^=、|=
  • ,

代码块

• 代码块是在大括号 {} 中所写的语句，以此将 多条语句的集合视为一条语句来使用。
• 例如：
  {
  var a = 123;
  a++;
  alert(a);
  }
• 我们一般使用代码块将需要一起执行的语句进 行分组，需要注意的是，代码块结尾不需要加 分号。

条件语句

• 条件语句是通过判断指定表达式的值来决 定执行还是跳过某些语句。

• 最基本的条件语句：
  if...else
  switch...case

• if...else

• if...else语句是一种最基本的控制语句，它让JavaScript可以有条件的执行语句。

  image

• switch...case
  switch...case是另一种流程控制语句。
  switch语句更适用于多条分支使用同一条语句的情况。
  语法switch(语句){
  case 表达式1:
  语句...
  case 表达式2:
  语句...
  default:
  语句...
  }
  ：

• 需要注意的是case语句只是标识的程序运行的起点，并不是终 点，所以一旦符合case的条件程序会一直运行到结束。所以我 们一般会在case中添加break作为语句的结束。

流程控制语句

• JS中的程序是从上到下一行一行执行的
• 通过流程控制语句可以控制程序执行流程，使程序可以根据一定的条件来选择执行
• 语句的分类：
  1.条件判断语句
  2.条件分支语句
  3.循环语句

return关键字

    <script type="text/javascript">
        window.onload = function(){
            var oInput01 = document.getElementById('input01');
            var oInput02 = document.getElementById('input02');
            var oBtn = document.getElementById('btn');

            //写入值
            // oInput01.value = 10;
            // oInput02.value = 5;

            oBtn.onclick = function(){
                var val01 = oInput01.value;
                var val02 = oInput02.value;
                var rs = add(val01, val02);
                alert(rs);
            }

            function add(a, b){
                var c = parseInt(a) + parseInt(b);
                // alert('计算完成');//执行
                return c;//返回函数设定的值，同时结束函数的运行
                // return;//不返回值，仅结束函数的运行
                // alert('计算完成');//不执行
            }
        }
    </script>

函数传参

<script type="text/javascript">
        window.onload = function(){
            var oDiv = document.getElementById('div1');

            changeStyle('color', 'gold');
            changeStyle('background', 'red');
            changeStyle('width', '300px');
            changeStyle('height', '300px');
            changeStyle('fontSize', '30px');

            function changeStyle(styl, val){
                oDiv.style[styl] = val;
            }
        }
    </script>

匿名函数

<script type="text/javascript">
        window.onload = function(){
            var oDiv = document.getElementById('div1');

            /*有名字的函数*/
            // oDiv.onclick = myalert;

            // function myalert(){
            //  alert('hello');
            // }

            /*匿名函数*/
            oDiv.onclick = function(){
                alert('hello');
            }
        }
    </script>