Summary—【base】（JavaScript）

1、认识Js

    1.1 Js就是一门运行在客户端浏览器的脚本编程语言

    1.2 组成

           ECMAScript：Js的语法标准

           DOM：JS操作网页上的元素的API（应用接口），即操作网页

           BOM：JS操作浏览器的部分功能的API，即控制浏览器

    1.3特点

        ①简单易用

        ②解释执行（解释语言）：JS源代码是直接通过JS引擎执行的，并且是逐行解释执行

        ③基于对象

2、JS与HTML、CSS

    Html:  是用来制作网页，简单来说就是编写网页结构。

    CSS：用来编写网页的样式

    Javascript:   实现网页与客户之间互动的桥梁，让网页具有丰富的生命力

3、JS执行过程中的小原理

    1)html页面中出现<script>标签后，就会让页面暂停等待脚本的解析和执行。

    2)无论当前脚本是内嵌式还是外链式，页面的下载和渲染都必须停下来等待脚本的执行完成才能继续，这在页面的生命周期中是必须的。

 例如：通过外链式js文件查看加载速度。

4、JS语法规范

    4.1 js书写位置

        ①与css类似，直接嵌入到html页面中，放到页面中任何一个位置都可以。

        ②文件调用：JavaScript代码写到另一个文件当中（其后缀通常为“.js”），然后用格式为“<script src="javascript.js"></script>”的标记把它嵌入到文档中。

    4.2 基础知识

        

    4.3 注释语法

           // 单行注释 ；       /**/  多行注释 ； 快捷键：ctrl+/   

   4.4 声明变量

          ①变量定义：       var 自定义名称；

          ②变量的赋值：    通过“=”复制运算符给变量赋值

          ③变量的命名规范：

              1）不能使用纯数字定义，并且不能以数字开头；

              2）不能使用特殊字符定义变量或者以特殊字符开头，下划线_除外

              3）不能使用关键字定义

              4）不推荐使用汉字定义

              5）不推荐使用保留自定义变量

              6）JS中严格区分字符大小写

5、数据类型介绍

    5.1 简单数据类型

            ①Number类型：所有的数字（整数，小数，负数）

                表示方式：十六进制：以0x开头，同时以0—9或者a(A)—f(F)

                                    八进制：以0开头，0—7组成

            ②String(字符串类型)：凡是用" "或者' '引起来的都是字符串类型

                转义字符：\"     转双引号

                                   \'      转单引号

                                   \r      回车符

                                   \n      换行

            ③Boolean(布尔类型)： 取值只有两种——true 和 false

            ④NULL：值为空

            ⑤“ ” ：空字符串

            ⑥undefined ：未初始化——定义了变量没有给变量赋值

    5.2 复杂数据类型

           ①Object（对象）

            ②Array （数组）                  

6、比较运算符

        >    <    !=    >=    <=

    其结果：一种是true（正确的）；一种是false（错误的）

7、JS中的运算符

+ 加	i）当两个Number类型的变量相加，结果为Number
	ii）当一个Number类型的变量和一个String类型的变量相加，最后结果为字符串（加号起到的是连接的作用）
- 减	i）当两个Number类型的变量相减，结果为Number
	ii）当一个Number数据类型的变量和一个数字的字符串类型变量相减，最后的结果为Number类型
* 乘	结果与减法的结果一致
/ 除	结果同上，区别：当一个数字除以0最后的结果为 infinity（Infinity: 无穷大的数字）
%       取余	获取余数。
()     优先级	有括号先算括号里面的值

8、等号运算符

运算符	含义
=	赋值运算符
==	等于，判断变量是否相同，不关心数据类型是否相同，只关心内容是否相同
===	全等，不仅判断内容是否相同，还要判断数据类型是否一致
！=	不等于，判断的是内容，不考虑数据类型
！==	不全等于，判断的是内容和数据类型

9、逗号运算符

    var n1=123, n2=456;  //变量的集体申明

 

补充：运算符的优先级（从高到低）

 　——（）优先级最高

    ——一元运算符  ++  -- ！

    ——算术运算符   先* / % 后 + -

    ——关系运算符  >  >=  <  <=

    ——相等运算符 ==   !=  ===    !==

    ——逻辑运算符  先&& 后||

10、Math对象方式使用

    Math.ceil()   结果：整数  没有对数字进行四舍五入

    Math.floor()  结果：整数  没有对数字进行四舍五入

    Math.max(n1,n2);     返回两个数字的最大值

    Math.min(n1,n2);      返回两个数字的最小值

    Math.pow(n1,n2)  返回数字的几次方

    Math.round(n2)       四舍五入

    Math.random()       随机数

11、数据类型判断

——typeof(变量)  直接获取变量的数据类型

    ①NaN（not a number）：number数据类型

    ②变量的取值为null:  变量的数据类型object

    ③undefined取值的变量或者变量未赋值： 数据类型为undefined

    ④infinity： 数据类型属于number类型

12、数据类型转化

   ① 隐式类型转化

   ② 强制类型转化

12.1 字符串转化为数字

    1）隐式类型转化——只要将数字的字符串与0相减（参与运算加法运算除外）

    2） 强制类型转化——Number()   parseInt()  parseFloat()

     ①Number方式转化后：原来的数字，如果数字后面跟有非数字的字符，那么转化失败。

     ②ParseInt()方法转化后：保留的是整数部分，如果后面跟有非数字的字符，能转化成功。

     ③ParseFloat(): 还是保留原来的数字，如果数字后面跟有非数字的字符，那么转化成功。

12.2 数字转化为字符串

    1）隐式类型转化——通过prompt方法可以实现转化或者将当前数字和一个字符串相加

    2）强制类型转化—— String()  ；  变量.tostring()

12.3 其他类型转化为布尔类型

1）隐式类型转化——通过取反面实现转化

2）强制类型转化—— Boolean()；

 除0外所有的数据类型都转化为true  ，0 转化为false

13、逻辑运算符

——注意：逻辑运算之前，必须是两个Boolean类型的数据进行 ||  && ！ 运算

    13.1  ||  或 

 1）如果有一个结果为false 和一个结果为true进行或运算 结果为： true

 2）如果两个结果都为false ,  结果为false

 3）如果两个结果都为true,进行或运算后结果为 true

结果1	结果2	|| 运算结果
true	true	true
true	false	true
false	true	true
false	false	false

    13.2  && 且

结果1	结果2	&& 运算结果
true	true	true
true	false	false
false	true	false
false	false	false

    13.3    ！非

        1）如果为true     非运算后  结果为false

        2）如果为false    非运算后 结果为true

14、三元运算符

   14.1 语法结构——条件表达式?结果1:结果2

   14.2 含义——问号前面的位置是判断的条件，判断结果为Boolean型，为true时执行结果1，为false时执行结果2。可看成是 if....else... 的另一种写法

15、逻辑结构

    15.1 if...else条件分支

 if(条件表达式)     条件表达式的结果必须为Boolean
            {
                  如果条件表达式的结果为true,那么执行这里面的代码
          }else{
                 如果条件表达式的结果为false,那么执行这里面的代码
         }

   15.2 if...else if...else嵌套

if(条件表达式1)
 {
      结果为true 执行该处代码;
 }else if(条件表达式2){
   结果为true 执行该处代码;
 }else if(条件表达式3){
   结果为true 执行该处代码;
 }else{
如果以上代码条件都不满足，执行该处代码
}

    15.3 switch

switch(变量)
       {
        case 情况1:    //Case   后面的数据类型和switch里面的数据类型必须一致;并且可以作条件集体判断
    Js代码;
          break;
    case  情况2：
       Js 代码;
       break；
    default:
       Js代码；      
break;
       }

    15.4  while循环

        1）语法：

            初始化一个变量；

            while（循环体）{}

        2）执行顺序：

    当while条件表达式结果为true,那么一直会执行whlie循环体内的代码

    15.5 do...while 循环

        1）语法结构：

do{
       Js代码;
   }while(条件);

        2）区别于while循环：

            do...while循环比while循环至少多执行一次代码

    15.6 for循环

for(var a=1; a<=10; a++)
    {
        Js代码;
    } 

    15.7 break 与 continue 语句

        1）break：直接跳出当前循环

        2）continue：直接结束本次循环，进行下一次循环

while（判断条件）{
        if（特殊情况）{
            continue；  // 循环代码；
        }
}

16、自增自减

        1） a++    ++a    在原来变量的基础上加1的操作；

        2） a--      --a    在原来变量的基础上减1的操作；

 当 a++ 参与到运算中，先将a的值赋值给变量，然后变量a再加1；

 当++a参与到运算中，先将a的值加1然后将计算后的结果赋值给变量

17、数组

    1） 数组的概念——Js中的数组是将任意数据类型（数字、字符、布尔值等），放在一起按照一定顺序排练的集合

   2）数组的两种定义方式

i）var   ary=new Array()；
ii）var  ary1=[];

    3）数组两种默认值赋值方式

 i）// var  ary=new Array(1,2,4,"asdf")；//创建数组同时赋值

     // alert(ary);

 ii）// var   ary1=[1,2,3,5]; // 直接输入一个数组（称“字面量数组”）

     // alert(ary1); 

    4）下标介绍——数组中所有元素从0位置开始

    5）通过下标方式赋值及取值

var   ary=[];
ary[0]=1 ;  数组的赋值
alert(ary[0]);  数组的取值

    6）length 属性介绍——数组名.length用来获取数组的长度（数组中包含多少个元素）

    7）可通过for循环为数组赋值及取值

    8）数组合并方法concat介绍

                var newArray =  array.concat(ary);

    9)数组join方法介绍

                array.join();  // 默认返回的是一个逗号，值是字符串

18、函数（方法） function

——通常情况下，函数是完成特定功能的一段代码

        1）函数的定义：

                通过   function  +函数名+()  ===》函数的定义；

 function  a()     /函数的定义
      {
  方法体；
      }

       2）函数的调用：

                a()； // 直接写上方法名就可以实现方法的调用