JavaScript2.0

Posted 2021-07-12 364.99°

---

目录

• 2.语言基础
• • 2.1 作用域
  • 2.2 事件
  • 2.3 算术运算符
  • 2.4 逻辑运算符
  • 2.5 条件语句
  • 2.6 循环语句
  • 2.7 try-catch

2.语言基础

2.1 作用域

1.参数的作用域

声明在函数上的变量为参数，一个参数的作用域就在这个函数内部，超出函数该参数就无效

<script>
  function println(a){
     document.write("输出变量"+a);
     document.write("<br>");
  }
  function println1(){
     //函数println不在参数a的作用域内，故无法输出a
     document.write("输出变量"+a);
     document.write("<br>");
  }

  println(1);
  println1();
</script>

2.全局变量的作用域

定义在函数之外的变量，其作用域是整个script标签

<script>
  var a = 9;

  function println(){
     document.write("输出变量"+a);
     document.write("<br>");
  }
  function println1(){
     document.write("输出变量"+a);
     document.write("<br>");
  }

  println(a);
  println(a);
</script>

2.2 事件

事件：用来实现js与html之间的交互，一直在更新，方法多样，此处不多做赘述

例举一个鼠标点击事件
1.定义一个函数，被调用的时候弹出对话框
2.定义一个按钮，当按钮被点击，弹出对话框

<script>
  function showMe(){
    alert("弹出");
  }
</script>
  
<button onclick="showMe()">点我</button>

2.3 算术运算符

分类	关键字
基本算术运算符	+ - * / %
自增自减	++ –
赋值运算符	= += -= *= /= %=

运算符+的多态:1.两边都是数字的时候，表现为算数运算符
                         2.任意一边出现字符串，表现为字符串的相接

2.4 逻辑运算符

1.基本逻辑运算符

== != > >=

<script>
  function comp(a){
    document.write(a)
    document.write("<br/>")
  }
  
  comp("1 == 1：" + (1 == 1));  //判断相等
  comp("1 != 1：" + (1 != 1));  //判断不相等
  comp("1 > 1：" + (1 > 1));    //大于
  comp("1 >= 1：" + (1 >= 1));  //大于等于
</script>

2.绝对等，绝对不等

===:绝对等，值与数据类型都相等返回true
!==:绝对不等，值与类型有一个不等就返回true

<script>
  function comp(a){
    document.write(a)
    document.write("<br/>")
  }
  
  comp("1 == '1'：" + (1 == 1));
  comp("1 === 1：" + (1 === 1));      
  comp("1 === '1'：" + (1 === '1'));  
  comp("1 !== '1':" + (1 !== '1'));    
  comp("1 !== '2'：" + (1 !== '1'));  
</script>

3.三目运算符

条件?表达式1:表达式2,，条件为true，取值表达式1，条件为false，取值表达式2

<script>
  var a = 3;
  var b = a > 8 ? "a大于8" : "a小于8";
  document.write(b);
</script>

2.5 条件语句

1.if语句

if (条件){表达式} 条件为真（true或非0），则执行表达式

<script>

//单个if语句,多个if的类似
  if (2){
    document.write("执行语句1");
    document.write("<br>");
  }

//if else语句
  if (false){
    document.write("执行语句6");
    document.write("<br>");
  }
  else{
    document.write("执行语句7");
    document.write("<br>");
  }

//else if语句
  if (0){
    document.write("执行语句2");
    document.write("<br>");
  }
  else if(1){
    document.write("执行语句3");
    document.write("<br>");
  }
  else if(1){
    document.write("执行语句4");
    document.write("<br>");
  }
  else{
    document.write("执行语句5");
    document.write("<br>");
  }

</script>

2.switch

与else if语句类似，均为多条件判断
注意:每次判断结束，都要加上break，不然某次判断为真，执行完case语句后就不能跳出switch，会将之后的case都执行;
switch 中的case是进行绝对等比较

<script>
  
  var day = 6;
  var today;

  switch (day)
  {
    case 0:
      today = "周日";
      break;
    case 1:
      today = "周一";
      break;
    case 2:
      today = "周二";
      break;
    case 3:
      today = "周三";
      break;
    case 4:
      today = "周四";
      break;
    case 5:
      today = "周五";
      break;
    case 6:
      today = "周六";
      break;
    default://当所需判断的条件超出范围后执行default语句
      document.write("输入数据超出范围0~6");
    
  }
  
  if (today != null){
    document.write("今天是：" + today);
  }
</script>

2.6 循环语句

进行循环的时候，必须设置好限制条件，防止死循环
1.for
for(初值;限定条件;表达式){循环语句}

<script>
  function p(a){
    document.write(a + " ");
  }

  for(var i = 0;i < 7;i ++){
    p(i);
  }
</script>

2.while

while(判断条件){循环语句}，判断条件为真，就执行循环语句

<script>
  function p(a){
    document.write(a + " ");
  }

  var i = 7;
  while(i > 0){
     p(i);
     i --;
  }
</script>

3.do-while

do{循环语句}while(判断语句); 与while类似，不过do-while无论条件是否为真，都会先执行一次循环语句

<script>
  function p(a){
    document.write(a + " ");
  }

  var i = 7;
  do{
    p(i);
    i --;
  }while(i > 0);
</script>

4.增强型for

用于遍历数组序列等

5.continue

结束此次循环，直接进入下一次循环

<script>
  function p(a){
    document.write(a + " ");
  }

  var i = 7;
  while(i > 0){
    if (i == 3){
       i --;    //此处必须进行自减操作，不然会陷入死循环
       continue;
     }
    p(i);
    i --;
  }
</script>

6.break

直接跳出循环

<script>
  function p(a){
    document.write(a + " ");
  }

  var i = 7;
  while(i > 0){
    if (i == 3){
       break;
     }
    p(i);
    i --;
  }
</script>

2.7 try-catch

用来捕捉异常

1.调用不存在的函数

<script>
  var i = 7;
  while(i > 0){
    if (i == 3){
       i --;    
       continue;
     }
    p(i);     //调用不存在的函数，导致出错，中断执行
    i --;
  }
</script>

2.使用try-catch

<script>
  var i = 7;
  while(i > 0){
    if (i == 3){
       i --;    
       continue;
     }
    try{
      p(i);//代码出错，从此处，直接跳转到catch
      i --;
    }catch(err){
      document.write("捕捉到代码出错:");
      document.write(err.message);
      document.write("<br>");
      break;
    }

  }
  document.write("错误被捕捉后，代码就能继续执行");
</script>

---