JS语法

JS是什么？

• JavaScript的简写，与Java没有半毛关系；相当于雷锋与雷峰塔，印度与印度尼西亚的关系

• 它是客户端(浏览器)脚本，服务端脚本Node.js

• 他可以给静态页面添加动态属性，如：添加事件，修改样式。

• 由来：NetSpace => LiveScript，后来与Sun公司合作；

  为了借助Java语言的名气进行宣传和推广，将名字改为了JavaScript。

JS引入方式

• 方式1：在HTML中的任意位置添加script标签，标签中即可书写JS代码
• 方式2：通过script标签引入外部的JS文件
• 方式3：设置元素的特定属性，添加或设置元素的特殊事件

变量定义

• 数字：number， 整数、小数
• 字符串：string，单引号、双引号都可以， '+'可以进行字符串拼接
• 布尔：boolean，只有两个值，true和false
• 数组：array，可以使用[]定义，也可以使用new Array()定义
• null：空类型，只有一个值，null，类型名为object
• NaN：not a number，不是一个数字，类型任然是object
  • 使用isNaN进行判断，不能使用 '=='
• 未定义：undefined
  • 定义变量不赋值，使用对象不存在的属性，都会出现未定义变量
  • 直接判断应与undefined比较，使用typeof判断应与'undefined'比较
• 对象：object
  • 方式1：先创建对象，然后添加属性和方法
  • 方式2：使用JSON字符串创建对象
  • 方式3：使用类似于构造方法的形式

基本运算

• 赋值运算：=
• 算术运算：+、-、*、/、%
• 复合运算：+=、-=、*=、/=、%=
• 自增自减：++、--
  • 放在变量前：先自增或自减，然后参与其他运算
  • 放在变量后：先参与其他运算，然后在自增或自减
• 关系运算：>、>=、<、<=、==、!=、===、!==
• 逻辑运算：&&、||、！
• 按位运算：&、|、^、~、<<、>>
• 三目运算：?:
  • 格式：表达式1 ? 表达式2 : 表达式3
  • 流程：首先判断表达式1的真假，若为真表达式2作为返回值，否则表达式3作为返回值

流程控制

• 说明：
  • 条件都是写在()中的
  • 代码块都是写在{}中的

• 分支结构(if-else)

  • if - else if - ... -else

• 分支结构(switch-case)

  • 格式：

    switch (表达式) {
        case 常量1:
            语句块1
            break
        ....
        
        default:
            语句块
            break
    }
    

  • 说明：

    当程序执行到switch-case语句时，首先计算表达式的值，然后与所有的case选项匹配，匹配成功，则直接跳转到对应的语句块执行，直到遇见break才跳出结构；若没有匹配成功，则执行default语句块。
    

    case选项不要出现相同的，不可能同时执行多个case选项的语句块。

• 循环结构(while)

  • 与python中的使用方式一样

  • 格式：

    while （表达式） {
        循环体
    }
    

• 循环结构(do-while)

  • 格式：

    do {
        循环体
    } while (表达式)
    

  • 说明：

    当程序执行到do-while语句时，首先执行循环体，然后判断表达式的真假；若表达式的值为真，则继续执行循环体，直到表达式的值为假；若表达式的值为假，则直接向下执行。
    

    do-while的循环体至少会执行一次，即使表达式一直不成立。

• 循环结构(for)

  • 格式：

    for (表达式1; 表达式2; 表达式3) {
        循环体
    }
    

  • 说明：

    当程序执行到for语句时，首先执行表达式1，然后判断表达式2的真假；若表达式2的值为真，则执行循环体，然后接着执行表达式3，之后再进行表达式2的判断；若表达式2的值为假，则跳出循环。
    

  • 使用：

    • for中的三个表达式可以任意组合的省略
    • 表达式1通常做初始化的操作，省略时需要将初始化操作放在for之前
    • 表达式2省略，循环条件为真也就是死循环，可以结合break完成原有的功能
    • 表达式3通常是使循环趋于结束的语句，省略后需要放在循环体的最后面。

• 循环结构(for-in)

  • 类似于python中的使用，专门用于遍历数组和对象

• 异常处理

  // 尝试执行代码
  try {
    // 抛出异常， 抛出一个字符串即可
    throw '出问题了'
    alert('normal')
  // catch 捕获异常
  } catch (e) {
    alert(e)
  }
  

函数使用

• 函数定义使用关键字：function

• 函数的调用可以放在定义之前

• 函数名不能重复，因为后面会覆盖前面的

• 函数可以像普通变量一样使用，打印时会显示全部内容

• 匿名函数：就是没有名字的函数，定义时只需将正常的函数定义去掉名字即可

• 内部函数：定义在函数内部的函数

• 函数参数：

  • 可以有默认值
  • 函数参数不传也不会报错
  • 所有的函数参数都会保存在arguments变量中(可以认为是数组)

• 封闭空间：

  // 封闭空间，既可以作为一个整体，又可以灵活实现功能
  (function(a, b){
    alert(a+b)
  })(3, 5)
  

• 变量作用域

  • 全局变量：定义在函数外部的变量，哪里都可以使用
  • 布局变量：定义在函数内部的变量，只能在函数内部使用

总结

• 常用函数：
  • alert
  • typeof
  • document.write
  • parseInt
  • parseFloat
• 常用类库：
  • String：字符串
  • Math：数学
  • Date：日期
  • Array：数组
  • RegExp：正则