JavaScript入门

1. Javascript 介绍
   编程（数据结构，算法，内存分配）
   表单验证

   需要一门语言可以直接运行在浏览器中，来完成表单验证的功能。

   浏览器厂商

   网景 firefox
       js 标准 
       js 解释器
   
   IE
       js
       js 解释器
   
   google
       js
       js 解释器
   
   ECMAScript
   

2. Javascript
   1) ECMAScrpt【js 标准】（兼容器 100%）

   注释 //、/**/
   变量
   操作符
   流程控制语句
   数组
   对象
   函数
   正则表达式
   ...
   所有的 JS 解释器都可以兼容 ECMAScript【lodash】ECMAScript 库
   

   2) DOM【js 操作 html 的 api】

   Document object model     文档对象模型
   var dom = document.getElementsByTagName("input");
   var dom = document.getElementsById("input_name");
   dom.onclick = function(){}
   js 语言
       基础语法
       基础库【jQuery】DOM 库

   3) BOM【js 操作浏览器的 api】

   Browser Object model 浏览器对象模型
   alert()/prompt()/confirm()
   setInterval()
   setTimeout()
   XMLHttpReqeust
   ajax
   

3. 解释器
   浏览器【dom 操作，动画，表单校验，ajax 异步交互】

   nodeJS【网络编程（http 模块）数据库操作（mysql），io 文件 (file)，iot(…)】
   google v8 => nodeJS
   可以安装 linux window macos unix

4. 学习方式
   环境：ubuntu16.04
   软件：nodejs、vi(spf13)、git
   使用 sudoer 用户登录
   在家目录中编写测试代码

5. hello world
   1) 编写代码

   $ vi hello.js

   2) 执行代码

   $ node hello
   或
   $ node hello.js
   

6. js 特点
   1) 解释型语言

   js -> nodejs(js 解释器)

   2) 弱类型语言

   变量的数据类型取决于值的数据类型
   var a ;
   a = 2;        // a 的数据类型为 number
   a = true;    // a 的数据类型为 boolean

   3) 顺序解释执行
   4) 既可以作为前端脚本语言，也可以作为后端语言，取决于应用平台（浏览器 / 操作系统）和使用的框架（dom、jquery/http、mysql、file）

   Java
   编译型语言

   java -> .class -> jvm（java 解释器）

   强类型语言

   变量的数据类型取决于声明的数据类型
   int a ;
   a = 3;
   a = 8;
   
   无符号整数
       char
   有符号整数
       byte short int long
   有符号小数
       float double
   布尔类型
       boolean
   

7. 数据类型
   基本数据类型(用于保存单个值)

   字符串类型 string
       var a = "hello world"
       var a = 'hello world'
       var a = '1';
       var a = '{"name":"terry","age":12}';
   数字类型 number
       var a = 3;
       var a = 3.1;
       var a = 3.0;
   
       var a = 011;
       var a = 0x11;
       var a = 1.3e10;
   
       var a = 1/0;
   
   布尔类型 boolean
       var a = true;
       var a = false;
   
   null
       表示空对象
       var gf = null;        // 经常做，表示占位
   
   undefined
       表示未定义
       var a;
       console.log(a);
   
       var b = undefined;    // 很少这么做
   
   undefined 与 null 关系
   undefined 继承 null，所有 undefined == null 结果为 true, 但是 null 表示空对象，undefined 表示未定义
   

   引用数据类型(保存多个值)

   对象     var a = {name:"terry",age:12};
   数组     var arr = [1,2,3,4];
   函数
   正则表达式
   ...
   

内存图：变量都维护在栈区，基本数据类型的值保存在栈区，而引用数据类型的引用地址保存在栈区，值保存在堆区

1. 变量
   1) 变量声明

   var a;
   var b;

   2) 变量初始化

   a =3;
   b = "hello"
   
   var c = true;
   => 
   var c;
   c = true;

   3) 变量使用

   var result = a + 1;
   console.log(b);
   

   var a = 3;

   a 是一个基本数据类型的变量，a 的变量类型是 number，a 是一个整数类型
   变量是指向一个值
   基本数据类型类型的变量保存的单个值

   4) 变量的提升

   在所有代码执行之前，js 解释器会将 js 中所有的 var 声明的变量提升。

2. 编程语言
   1) 语法
   2) 系统库
   3) 解释器

   java     -> jvm
   c         -> linux
   js         -> nodejs/ 浏览器
   

10. 内置函数

console.log()

如何判断变量的数据类型
    typeof v

    var a = "hello world";
    if((typeof a) == "string"){ }
    if(a == "null"){}
如何判断一个变量是否是有穷的
    isFinite();
    当参数为无穷大或者小返回 false
如何判断一个变量是否是 NaN
    isNaN()
    当参数为 NaN 返回 true

1. 操作符（运算符）
   1) 算术运算符（number）

   +         +=
   -         -=
   *         *=

    /            /=
    %            %=

    var a = 3;
    var result = a + 3;
    result += 3;
    =》result = result + 3;
2) 一元运算符(number)
    +
    -
        var a = "12";
        +a;
        -a;
        经常用于类型转换
    ++
    --
        var a = 12;
        a++;
        ++a;    //a = 14
        var result = ++a+a++;
        /*
            a = 14;
            ++a                         //a = 15;
            result = a + a     //result = 30
            a++                         //a = 16
        */
        console.log(a);
        console.log(result);
3) 逻辑运算符(短路运算符)
    && 
        var age= 12;
        var gender = "male"

        age > 18 && gender == "male"

        并且，当第一个表达式为假，就可以确定整个表达式结果为假，这时候无需判断第二个表达式，将第一个表达式运算结果返回；当第一个表达式为真，整个表达式的结果取决于第二个表达式，将第二个表达式运算结果返回。var result = "hello" && 12;
    ||

    !
        !true                 false
        !false            true
        !!true          true
        !!"hello"     true    将其他数据类型转化为 boolean
4) 比较运算符
    ==
    !=
        比较两个变量的值，当值的数据类型不一样的时候，先转换为相同类型的然后再比较
        当比较引用数据类型的时候，比较的是内存地址
    ===
    !==
        先比较两个变量的数据类型，数据数据类型不一样，返回 false，否则继续比较值

        1 == "1"    //true
        1 === "1"    //false
    > >=
    < <=
5) 三目运算符
    exp1 ? exp2 : exp3
    当 exp1 为真，返回 exp2，否则返回 exp3

    var age = 22;
    var result = age >= 18 ? "成年人":"未成年人"
    =>
    var result;
    var age = 22;
    if(age >= 18){result = "成年人";} else {result = "未成年人";}

6) 拼接运算符
    字符串与任何其他数据类型相加都是字符串拼接
    "terry" + 2        //'terry2'
    如何将其他数据类型转换为字符串
    true+""

7) 赋值运算符
    var a = 3 + 1;
    将 3 + 1 的结果赋值给 a

#8) 位运算符(number, 转换为二进制再运算)
    ^
    &
    |

    1&2

1. 类型转换
   string

   String(v)
   +""
   v.toString()    // 不适用于 null，undefined
   

   boolean

   Bollean(v)
   !!v
   null                 false
   undefined     false
   NaN                 false
   Infinite         true
   0                     false
   ""                     false
   {}                     true
   

   number

   Number(v)
   +v
   -(-v)
       true             1
       false         0
       undefined NaN
   
   parseInt(v)         v 为字符串
       "12.3"         12
       "12abc"     12
       "a12abc"     NaN
   parseFloat(v)
       "12.3"         12.3
       "12abc"     12
       "a12abc"     NaN
   

2. 表达式
   操作符 + 操作数
   表达式以 ’;’ 作为结束

   var a = 3;
   var result = a>3;
   …

3. 流程控制语句

   1. 分支语句
      1) if else

      
      if(exp1) {exp2}
      exp3
      exp1 可以为任意数据类型，在执行的时候先判断 exp1 为 true 还是 false, 如果为 true 执行 exp2，exp3 始终都会执行
      
      if(exp1){exp2} else {exp3}
      如果 exp1 为 true, 执行 exp2，否则执行 exp3
      
      if(exp1){exp2} else if(exp3){exp4} else {exp5}
      如果 exp1 为 true，执行 exp2；如果 exp1 为 false，判断 exp3，如果 exp3 为 true，执行 exp4，否则执行 exp5
      
      课堂作业
          var day = 3;
          1     今天是周一
          2     今天是周二
          ...
          6,7 今天是周末

      2) switch

      var day = 3;
      switch(day){
          case 常量 1:
              代码块 1
              break;
          case 常量 2:
              代码块 2
              break;
          ...
          default :
              代码块 n
      }
      
      day === 常量 1     =》代码块 1
      day === 常量 2    =》代码块 2
      ...
      代码块 n
      
      注意：1. case 代码块中的 break 不能省略
          2. default 可以放在代码块的上部，中部，底部，如果放在上部或者中部，一定不能省略 break
          3. 变量与常量对比的时候使用 "==="
      

2. 循环语句



a b c d                         变量
拼音                              数据类型
汉字                                  操作符 
语法                                 表达式
成语，古诗词，史记【文言文】，文章         流程控制语句
写作，写字