-       面试题 --按值传递

        原始型：两者互补影响

        饮用型：（函数，数组都是引用类型）会互相影响，这个是保存了一个地址值

-         hash数组（关联数组）：下标是可以自己定义的

          为什么：索引数组的下标不具有意义，不便于查找

          如何使用：

          1.创建：2步

            1.创建空数组：var arr:[];

            2.为数组添加自定义下标并且赋值：arr["自定义下标"]=新值；

          2.访问元素：arr["自定义下标"];

          3.强调：hash数组的length失效了，为0！！

           遍历hash数组：不能再用for循环，必须使用**for in**循环,for in循环是纯自动化的；专门为遍历hash数组存在的，不止能遍历数组还可以遍历索引数组

           建议：索引数组用for，hash数组用for in

-       数组的API

        1.arr转str:(将数组转字符串)

        var str=arr.join("自定义连接符")

        固定套路  两个

        1.笔试题：将数组里面的内容拼接成为一句话/单词---无缝拼接，其实就是拼接成一个空的字符串

        var arr=["h","e","l","l","o",];

        var str=arr.join("");

        console.log(str);

        2.将数组拼接成为DOM页面的元素----数据渲染页面

​

- 数据拼接：添加元素的新方式

       将你传入的实参全部拼接到arr的末尾

       var newArr=arr.concat(新值1，...);

       特殊：

       1.不修改原数组，只会返回一个新数组

       2.concat支持传入数组参数，悄悄的将你传入的数组打散单个元素再拼接

-  截取子数组

       根据你传入的开始下标截取到结束下标

       var subArr=arr.slice(starti,endi+1);

       特殊：

       1.不修改原数组，只会返回一个新数组

       2.含头不含尾

       3.endi可以省略不写，如果省略，会从starti位置一直截取末尾

       4.starti也可以省略，如果两个实参都省略，那么会从头到位完整复制一份；此操作也叫作深拷贝---复制了一个副本给对方

       5.支持负数参数，-1代表倒数第一个

       6.以上的API都是不修改原数组的

-       删插替

        删除：var dels=arr.splice(starti,n);//n代表的是删除的个数

        特殊：虽然他直接修改原数组，但是也有返回值，返回的是删除的数据组成的一个新数组，因为前辈们考虑到有可能删除的东西是需要的东西，哪怕没有删除也会返回一个空数组

        插入：arr.aplice(starti,0,新值...);

        特殊：

        1.原starti的位置的元素以及后续元素都会向后移动

        2.尽量不要插入一个数组，会导致我们的数组一些是一堆，一些是二维遍历数组的时候就非常不方便

day01

• 介绍JavaScript
• 运行在浏览器端的解释型面向对象的脚本语言
• 由三部分组成 ecmascript+dom+bom
• 打开浏览器就可以独立自动运行
• 1：number 表示的是数字
• “1”：string 表示的是字符串
• 如何使用js

1. 在HTML页面上书写一个script标签
2. 创建js文件 在HTML页面中引入js文件 就像引入css一样 不过不是用link 是用

• 输出的三种方式

1. console.log 在控制台输出
2. document.write在页面上输出
3. alert（）在弹出框输入

• 变量 var
• 语法：var 变量名=值；
• 特殊：

1. 变量名不是随意的；
2. 不能以数字开头；
3. 建议用驼峰命名法；
4. 见名知意；

• 如果变量名是name，不管保存的是什么都会变成字符串
• 变量名不能是关键字
• 变量只可以创建，不赋值，那么默认值是undefined
• 多个变量连续创建，简写： var 变量名：值，变量名=值，变量名=值；
• 常量：
• 语法 const 变量名=值 其余特殊点和变量一样
• 数据的类型（两类）
• 原始、基本、值类型

1. number 蓝色
2. string 字符串 需要加上“” 黑色
3. Boolean 布尔 只有两个取值 true和false 蓝色
4. null 取值也是null 灰色
5. undefined

引用、对象类型：有11个，可以暂时理解成11个对象

运算符

1. 算数运算符 % NaN 不是一个数字 但是是一个数字类型 +如果碰到一个字符串，左右两边会悄悄转换成字符串+运算则不是+，而是拼接
2. 比较、关系运算符 结果一定是一个布尔值
3. 赋值运算符
4. 逻辑运算符 &&与，并且 ||或者
5. 自加自减运算符
6. 位运算

用户输入框 var变量=prompt（“提示文字”）

day02

• if...else
• switch...case
• 三目运算

强制转换类型

• 转字符串

1. var str=x.toString(); x 不能undefined和null，会报错，undefined和null不能使用.做任何操作，因为他们不是对象。
2. var str=String(x);// 万能的，任何人都可以转为字符串，但是不能手动转换

• 转数字

1. parseInt（str/num); 碰到非数字字符就停止转换，不认识则为NaN,不认识小数点
2. parseFloat（str): 和parseInt基本一样，但是认识小数点
3. Number(x); 万能的 但是不要手动转换、

• 转布尔

1. Boolean(x); 万能的 但是不要手动转换 只有六个值是false 0，“”，undefined，NaN,null,false 其他都是true。

day03

循环结构

1. while循环

• 语法：
• var 循环变量=几；
• while（循环条件）{ 循环体； 循环变量的变化；}
• while（true）是死循环
• break：退出整个循环
• continue：退出当前循环，下一次依然会执行 2.for循环
• 语法：
• for（var 循环变量=几；循环条件；循环变量变化）{ 循环体；}
• 特殊：for（；；）死循环 这个分号很重要

3. do..while循环

• 语法 ：
• var 循环变量=几；
• do{
• 循环体；循环变量的变化}while（循环条件）

function基础

• 概念：
• 定义：function函数名（）{函数/代码片段；}
• 调用：

1. 在js内部写：函数名（）
2. 在HTML上绑定事件，目前我们绑定的是点击事件

• 何时使用？

带参数的函数

• 创建出带有形参的函数 function函数名（形参...）{函数体/代码片段}

day04

自定义函数 function

• 什么是函数：需要先定义好，以后可以反复使用一个代码片段
• 何时使用：不希望打开页面立即执行，以后可以反复使用，希望用户来触发... 如何使用？
• 创建：2种
• 声明方式 创建函数
• function 函数名（形参列表）{ 操作； return 返回值/结果}
• 直接量方式 创建函数----不推荐
• var 函数名=function（形参列表）{ 操作； return 返回值/结果}

调用：

• var 接住返回的结果=函数名（实参列表）；
• 实际参数，可以是常量、变量、表达式
• 可以 var result=（）用来接住这个值； 作用域：2种
• 全局作用域
• 函数作用域
• 特殊点：

1. 千万不要在函数中对着未声明的变量直接赋值（就是没有var的）---全局污染：全局本身没有这个东西，但是被函数作用域添加上了
2. 局部可以使用全局的，但是全局不能使用局部的

声明提前----只会出现在笔试题中

重载***

• 相同的函数名，根据传入的实参不同，自动选择对应的函数去执行，但是js不支持，函数名如果重复了，后面的肯定会覆盖掉前面的
• 目的：减轻我们程序员的压力，记住一个方法就可以执行很多的操作
• 解决：在【函数内部】自带一个arguments的对象（类似数组对象）；不需要我们去创建----哪怕没有写过任何形参，他可以接收住所有的实参，所以默认你看他length长度为0；

固定套路：

1. 通过下标去获取传入的某一个实参：arguments【i】-----i
2. 通过length去获取到底传入了几个实参：arguments.length通过判断传入的实参不同，在内部去写判断，从而变相的实现重载

数组的基础

• 解决：数组：创建一个变量可以保存【多个数据】
• 数组都是线性排列，除了第一个元素，每个元素都有唯一的前驱元素
• 每个元素都有一个自己的位置，称之为“下标”，下标都是从0开始的，到最大的长度-1结束

创建数组2组

1. 1.直接量方式： var arr=[];//空数组 定义一个不包含元素的数组
2. 2.构建函数方式：var arr=new Array();//空数组 var arr=new Array(数据1，....)
3. 3.获取数组之中的元素； 数组名[i]
4. 4.后续添加/替换元素； 数组名[i]=新数据； 如果下标处没人则为添加，如果下标处有被替换
5. 5. 数组具有三大不限制

• 不限制元素的类型
• 不限制元素的长度
• 不限制下标越界

1. 如果获取元素时，下标越界，返回的是一个undefined
2. 如果添加元素时，下标越界，会得到一个稀疏数组，如果我们搭配上我们学过循环去遍历获取每个元素，那么你会得到很多很多undefined

解决：数组中有唯一的属性：length

• 语法：数组名.length
• 作用：获取到数组的长度，长度是从1开始的

三个固定套路：

1. 向末尾添加元素：arr【arr.length】=新数据
2. 获取数组的倒数第几个元素：arr[arr.length-n];
3. 缩容：删除倒数第n个元素：arr.length=n;

遍历元素：往往很多情况，我们不会拿某个元素来使用，而是拿出每个元素来进行相同或者相似的操作----搭配上循环

• 固定公式：
• for（var i=0；i<arr.length;i++）{ arr[i];//当前次元素}

day05

• DOM树概念
• 查找元素：两大方面
• 直接通过HTML的特点去查找元素

1. 通过 ID 查找元素： var elem=document.getElementById("id值"); 特殊： 1、返回值，找到了返回当前找到DOM元素，没找到返回的一个null 2、如果出现多个相同id，只会找到第一个 3、记住控制台输出的样子，这个样子才叫做一个DOM元素/节点/对象，才可以下午去做操作 4、忘记此方法，不允许使用，id不好用，一次只能找一个元素。id留给后端用
2. 通过 标签名来查找元素：

• var elems=document/已经找到的父元素.getElementsByTagName("标签名");
• 特殊：
• 1、返回值，找到了返回一个类数组DOM集合，没找到得到空集合 2、js只能直接操作DOM元素，不能直接操作DOM集合，解决：要么下标拿到某一个，要么遍历拿到每一个。 3、不一定非要从document开始查找，如果从document去找，会找到所有的元素，可以换成我们已经找到的某个父元素

3. 通过** class **查找元素：

• var elems=document/已经找到的父元素.getElementsByClassName("class名");
• 特殊：
• 1、返回值，找到了返回一个类数组DOM集合，没找到得到空集合 2、js只能直接操作DOM元素，不能直接操作DOM集合，解决：要么下标拿到某一个，要么遍历拿到每一个。 3、不一定非要从document开始查找，如果从document去找，会找到所有的元素，可以换成我们已经找到的某个父元素
• 通过关系去获取元素：前提条件：必须先找到一个元素才可以使用关系

1. 父元素：elem.parentNode; - 单个元素
2. 子元素：elem.children; - 集合
3. 第一个子元素：elem.firstElementChild; - 单个元素
4. 最后一个子元素：elem.lastElementChild; - 单个元素
5. 前一个兄弟：elem.previousElementSibling; - 单个元素
6. 后一个兄弟：elem.nextElementSibling; - 单个元素

• 不希望影响到别人，只希望影响到自己的关系网
• 操作元素：前提：先找到元素，才能操作元素，3方面 1.内容： 1.elem.innerHTML-获取和设置开始标签到结束标签之间的内容，支持识别标签的 获取：elem.innerHTML; 设置：elem.innerHTML="新内容"， 2.elem.innerText - 获取和设置开始标签到结束标签之间的纯文本，不识别标签的 获取：elem.innerText; 设置：elem.innerText="新内容";
• 属性
• 样式

day06

• 关于数组

  数组基础
  创建数组：
  1.直接量 var arr=[值1，...];
  2.构建函数： var arr=new Array(值，...);
  第二个方法有个坑 new Array(num);//这句话是创建了一个长度为num的空数组，长度是0的empty，里面只有无数的undefined
  

•   面试题 --按值传递
    原始型：两者互补影响
    饮用型：（函数，数组都是引用类型）会互相影响，这个是保存了一个地址值
    
  

•     hash数组（关联数组）：下标是可以自己定义的
      为什么：索引数组的下标不具有意义，不便于查找
  ```### day01
  
  

• 介绍JavaScript

• 运行在浏览器端的解释型面向对象的脚本语言

• 由三部分组成 ecmascript+dom+bom

• 打开浏览器就可以独立自动运行

• 1：number 表示的是数字

• “1”：string 表示的是字符串

• 如何使用js

1. 在HTML页面上书写一个script标签
2. 创建js文件 在HTML页面中引入js文件 就像引入css一样 不过不是用link 是用

• 输出的三种方式

1. console.log 在控制台输出
2. document.write在页面上输出
3. alert（）在弹出框输入

• 变量 var
• 语法：var 变量名=值；
• 特殊：

1. 变量名不是随意的；
2. 不能以数字开头；
3. 建议用驼峰命名法；
4. 见名知意；

• 如果变量名是name，不管保存的是什么都会变成字符串
• 变量名不能是关键字
• 变量只可以创建，不赋值，那么默认值是undefined
• 多个变量连续创建，简写： var 变量名：值，变量名=值，变量名=值；
• 常量：
• 语法 const 变量名=值 其余特殊点和变量一样
• 数据的类型（两类）
• 原始、基本、值类型

1. number 蓝色
2. string 字符串 需要加上“” 黑色
3. Boolean 布尔 只有两个取值 true和false 蓝色
4. null 取值也是null 灰色
5. undefined

引用、对象类型：有11个，可以暂时理解成11个对象

运算符

1. 算数运算符 % NaN 不是一个数字 但是是一个数字类型 +如果碰到一个字符串，左右两边会悄悄转换成字符串+运算则不是+，而是拼接
2. 比较、关系运算符 结果一定是一个布尔值
3. 赋值运算符
4. 逻辑运算符 &&与，并且 ||或者
5. 自加自减运算符
6. 位运算

用户输入框 var变量=prompt（“提示文字”）

day02

• if...else
• switch...case
• 三目运算

强制转换类型

• 转字符串

1. var str=x.toString(); x 不能undefined和null，会报错，undefined和null不能使用.做任何操作，因为他们不是对象。
2. var str=String(x);// 万能的，任何人都可以转为字符串，但是不能手动转换

• 转数字

1. parseInt（str/num); 碰到非数字字符就停止转换，不认识则为NaN,不认识小数点
2. parseFloat（str): 和parseInt基本一样，但是认识小数点
3. Number(x); 万能的 但是不要手动转换、

• 转布尔

1. Boolean(x); 万能的 但是不要手动转换 只有六个值是false 0，“”，undefined，NaN,null,false 其他都是true。

day03

循环结构

1. while循环

• 语法：
• var 循环变量=几；
• while（循环条件）{ 循环体； 循环变量的变化；}
• while（true）是死循环
• break：退出整个循环
• continue：退出当前循环，下一次依然会执行 2.for循环
• 语法：
• for（var 循环变量=几；循环条件；循环变量变化）{ 循环体；}
• 特殊：for（；；）死循环 这个分号很重要

3. do..while循环

• 语法 ：
• var 循环变量=几；
• do{
• 循环体；循环变量的变化}while（循环条件）

function基础

• 概念：
• 定义：function函数名（）{函数/代码片段；}
• 调用：

1. 在js内部写：函数名（）
2. 在HTML上绑定事件，目前我们绑定的是点击事件

• 何时使用？

带参数的函数

• 创建出带有形参的函数 function函数名（形参...）{函数体/代码片段}

day04

自定义函数 function

• 什么是函数：需要先定义好，以后可以反复使用一个代码片段
• 何时使用：不希望打开页面立即执行，以后可以反复使用，希望用户来触发... 如何使用？
• 创建：2种
• 声明方式 创建函数
• function 函数名（形参列表）{ 操作； return 返回值/结果}
• 直接量方式 创建函数----不推荐
• var 函数名=function（形参列表）{ 操作； return 返回值/结果}

调用：

• var 接住返回的结果=函数名（实参列表）；
• 实际参数，可以是常量、变量、表达式
• 可以 var result=（）用来接住这个值； 作用域：2种
• 全局作用域
• 函数作用域
• 特殊点：

1. 千万不要在函数中对着未声明的变量直接赋值（就是没有var的）---全局污染：全局本身没有这个东西，但是被函数作用域添加上了
2. 局部可以使用全局的，但是全局不能使用局部的

声明提前----只会出现在笔试题中

重载***

• 相同的函数名，根据传入的实参不同，自动选择对应的函数去执行，但是js不支持，函数名如果重复了，后面的肯定会覆盖掉前面的
• 目的：减轻我们程序员的压力，记住一个方法就可以执行很多的操作
• 解决：在【函数内部】自带一个arguments的对象（类似数组对象）；不需要我们去创建----哪怕没有写过任何形参，他可以接收住所有的实参，所以默认你看他length长度为0；

固定套路：

1. 通过下标去获取传入的某一个实参：arguments【i】-----i
2. 通过length去获取到底传入了几个实参：arguments.length通过判断传入的实参不同，在内部去写判断，从而变相的实现重载

数组的基础

• 解决：数组：创建一个变量可以保存【多个数据】
• 数组都是线性排列，除了第一个元素，每个元素都有唯一的前驱元素
• 每个元素都有一个自己的位置，称之为“下标”，下标都是从0开始的，到最大的长度-1结束

创建数组2组

1. 1.直接量方式： var arr=[];//空数组 定义一个不包含元素的数组

2. 2.构建函数方式：var arr=new Array();//空数组 var arr=new Array(数据1，....)

3. 3.获取数组之中的元素； 数组名[i]

4. 4.后续添加/替换元素； 数组名[i]=新数据； 如果下标处没人则为添加，如果下标处有被替换

5. 5. 数组具有三大不限制

• 不限制元素的类型
• 不限制元素的长度
• 不限制下标越界

1. 如果获取元素时，下标越界，返回的是一个undefined
2. 如果添加元素时，下标越界，会得到一个稀疏数组，如果我们搭配上我们学过循环去遍历获取每个元素，那么你会得到很多很多undefined

解决：数组中有唯一的属性：length

• 语法：数组名.length
• 作用：获取到数组的长度，长度是从1开始的

三个固定套路：

1. 向末尾添加元素：arr【arr.length】=新数据
2. 获取数组的倒数第几个元素：arr[arr.length-n];
3. 缩容：删除倒数第n个元素：arr.length=n;

遍历元素：往往很多情况，我们不会拿某个元素来使用，而是拿出每个元素来进行相同或者相似的操作----搭配上循环

• 固定公式：
• for（var i=0；i<arr.length;i++）{ arr[i];//当前次元素}

day05

• DOM树概念
• 查找元素：两大方面
• 直接通过HTML的特点去查找元素

1. 通过 ID 查找元素： var elem=document.getElementById("id值"); 特殊： 1、返回值，找到了返回当前找到DOM元素，没找到返回的一个null 2、如果出现多个相同id，只会找到第一个 3、记住控制台输出的样子，这个样子才叫做一个DOM元素/节点/对象，才可以下午去做操作 4、忘记此方法，不允许使用，id不好用，一次只能找一个元素。id留给后端用

2. 通过 标签名来查找元素：

• var elems=document/已经找到的父元素.getElementsByTagName("标签名");
• 特殊：
• 1、返回值，找到了返回一个类数组DOM集合，没找到得到空集合 2、js只能直接操作DOM元素，不能直接操作DOM集合，解决：要么下标拿到某一个，要么遍历拿到每一个。 3、不一定非要从document开始查找，如果从document去找，会找到所有的元素，可以换成我们已经找到的某个父元素

3. 通过** class **查找元素：

• var elems=document/已经找到的父元素.getElementsByClassName("class名");

• 特殊：

• 1、返回值，找到了返回一个类数组DOM集合，没找到得到空集合 2、js只能直接操作DOM元素，不能直接操作DOM集合，解决：要么下标拿到某一个，要么遍历拿到每一个。 3、不一定非要从document开始查找，如果从document去找，会找到所有的元素，可以换成我们已经找到的某个父元素

• 通过关系去获取元素：前提条件：必须先找到一个元素才可以使用关系

1. 父元素：elem.parentNode; - 单个元素
2. 子元素：elem.children; - 集合
3. 第一个子元素：elem.firstElementChild; - 单个元素
4. 最后一个子元素：elem.lastElementChild; - 单个元素
5. 前一个兄弟：elem.previousElementSibling; - 单个元素
6. 后一个兄弟：elem.nextElementSibling; - 单个元素

• 不希望影响到别人，只希望影响到自己的关系网

• 操作元素：前提：先找到元素，才能操作元素，3方面 1.内容： 1.elem.innerHTML-获取和设置开始标签到结束标签之间的内容，支持识别标签的 获取：elem.innerHTML; 设置：elem.innerHTML="新内容"， 2.elem.innerText - 获取和设置开始标签到结束标签之间的纯文本，不识别标签的 获取：elem.innerText; 设置：elem.innerText="新内容";

• 属性

• 样式

day06

• 关于数组

  数组基础
  创建数组：
  1.直接量 var arr=[值1，...];
  2.构建函数： var arr=new Array(值，...);
  第二个方法有个坑 new Array(num);//这句话是创建了一个长度为num的空数组，长度是0的empty，里面只有无数的undefined
  

•   面试题 --按值传递
    原始型：两者互补影响
    饮用型：（函数，数组都是引用类型）会互相影响，这个是保存了一个地址值
    
  

•     hash数组（关联数组）：下标是可以自己定义的
      为什么：索引数组的下标不具有意义，不便于查找
      如何使用：
      1.创建：2步
        1.创建空数组：var arr:[];
        2.为数组添加自定义下标并且赋值：arr["自定义下标"]=新值；
      
      2.访问元素：arr["自定义下标"];
      3.强调：hash数组的length失效了，为0！！
       遍历hash数组：不能再用for循环，必须使用**for in**循环,for in循环是纯自动化的；专门为遍历hash数组存在的，不止能遍历数组还可以遍历索引数组
       建议：索引数组用for，hash数组用for in
       
  

•   数组的API
    1.arr转str:(将数组转字符串)
    var str=arr.join("自定义连接符")
    
    固定套路  两个
    1.笔试题：将数组里面的内容拼接成为一句话/单词---无缝拼接，其实就是拼接成一个空的字符串
    var arr=["h","e","l","l","o",];
    var str=arr.join("");
    console.log(str);
    2.将数组拼接成为DOM页面的元素----数据渲染页面
  

• 数据拼接：添加元素的新方式

   将你传入的实参全部拼接到arr的末尾
   var newArr=arr.concat(新值1，...);
   特殊：
   1.不修改原数组，只会返回一个新数组
   2.concat支持传入数组参数，悄悄的将你传入的数组打散单个元素再拼接
  

• 截取子数组

  根据你传入的开始下标截取到结束下标
  var subArr=arr.slice(starti,endi+1);
  特殊：
  1.不修改原数组，只会返回一个新数组
  2.含头不含尾
  3.endi可以省略不写，如果省略，会从starti位置一直截取末尾
  4.starti也可以省略，如果两个实参都省略，那么会从头到位完整复制一份；此操作也叫作深拷贝---复制了一个副本给对方
  5.支持负数参数，-1代表倒数第一个
  6.以上的API都是不修改原数组的
  

•   删插替
    删除：var dels=arr.splice(starti,n);//n代表的是删除的个数
    
    特殊：虽然他直接修改原数组，但是也有返回值，返回的是删除的数据组成的一个新数组，因为前辈们考虑到有可能删除的东西是需要的东西，哪怕没有删除也会返回一个空数组
    
    插入：arr.aplice(starti,0,新值...);
    
    特殊：
    1.原starti的位置的元素以及后续元素都会向后移动
    2.尽量不要插入一个数组，会导致我们的数组一些是一堆，一些是二维遍历数组的时候就非常不方便
    
    替换：var dels=arr.splice(starti,n,新值...);
    
    特殊：删除的个数和替代的个数不必相同
    
  

  翻转数组（不是重点）： arr.reverse();

     数组排序
     1.冒泡排序
     2.实际开发中：arr.sort();
     默认：讲数组中的元素转为字符串后，再按位pk每个字符的Unicode码
     
     升序排列：
     arr.sort(function(a,b)){}=>这个函数也叫作匿名回调函数
     1.arr.sort(function(a,b)){
     return a-b}升序
     2.arr.sort(function(a,b)){
     return b-a}降序
     
     1.在网页上有功能能带有排序，他的底层一定是数组，因为js中只有数组可以排序
     2.以后只要网页上有随机功能，底层一定是用到了随机数组
     
     
  

day07

一.数组的API
1.栈和队列：添加元素和删除元素的新方式：


栈：其实就是数组，只不过一段封闭了，只能从另一端进出
何时使用：现实生活中，情况不多：电梯，旅游巴士...

如何使用：
开头进：arr.unshift(新值，...);//添加元素的新方式，向前添加
缺点：导致其余元素的下标发生变化

开头出：var first=arr.shift();//删除元素的新方式，向前删除，一次只能删除一个
缺点：导致其余元素的下标都会发生变化

结尾进：arr.push(新值,...)//添加元素的新方式，向后添加
结尾出：var last=arr.pop();//删除元素的新方法，向后删除


队列：其实就是数组，只不过是一端进，从另一端出；

开头进：arr.unshift(新值，...);
结尾出：var last=arr.pop();


结尾进：arr.push(新值，...);
开头出：var first=arr.shift();

• 二维数组：数组的元素，又引用着另一个数组

  何时：在一个数组中，希望再次细分每个分类
  
  创建：var arr=[[],[],[],];
  
  访问：arr[行下标][列下标]
  
  特殊：列下标越界，返回的是一个undefined
  
       行下标越界，得到的是报错，因为列下标越界得到的是undefined，undefined没资格在进行操作
  
  遍历二维数组：必然两层循环，外层循环控制行，内层循环控制列
  
  for(var r=0;r=arr.length;r++){
  for(var c=0;c<arr[r].length;c++){
  console.log(arr[r][c])}
  };
  

• 6个数组API

  1.判断：2个
  
  every：每一个，要求所有的元素都满足条件才会为true，只要有一个不满足则为false，类似于&&
  
  some：有一些，要求只要有一个元素满足，那么久会为true，所有元素都不满足则为false，非常类似于||
  
  2.遍历：拿到的数组中的每一个元素做相同 或 类似的操作
  
  forEach---直接修改原数组
  
  map----不修改原数组，返回一个新数组
  
  3.过滤和汇总：
  
  过滤：筛选出需要的部分，但是和现实不一样的是原数组并不会发生变化
  var subArr=arr.filter((val,i,arr)){
  return 判断条件；}
  
  汇总：var result=arr.reduce(function(prev前一个,val当前值,i当前值下标,arr数组)
  {return prev+val;}基础值)
  
  以上6个API都是在简化我们的for循环
  

• 箭头函数：简化一切匿名回调函数

  固定公式：function去掉，（）和{}之间添加=>,如果形参只有一个，那么（）可以省略，如果函数体只有一句话，那么{}也可以省略，如果函数体只有一句话并且是return，那么return的{}都可以省略
  

•    String概念：
  字符串：多个字符组成的【只读】字符【数组】
  

•   和数组的相同点：
    1.字符串的个数：str.length
    2.获取字符串中某个字符：str[i];
    3.遍历字符串
    4.所有数组不修改原数组的API，字符串也可以截取
    
  

•  和数组不同的地方
   所有的数组的直接修改原数组的API，字符串都不可用，比如排序只有数组可以使用，但是，字符串也会很多很多属于自己的API
   
  

•    引用/对象类型：11个
  
   1.string number boolean---包装类型
   2.array  function  date day math  regexp  error  object  global   
   
  

• 包装类型：专门用于将原始类型封装成一个引用类型的对象

    为什么：原始类型的值原本是没有任何属性和方法，意味着原始类型是不支持去做任何操作的
    
    如何使用：只要你试图使用原始类型的变量调用属性货方法的时候
    
    何时释放：方法调用完毕后，自动释放包装类型，又变成原始类型
    
    
  

day08

• 字符串API：就是一些只有字符串才能使用的函数，不需要我们创建

  转义字符：
  1."\"   将字符串中的程序冲突的字符转为原文
  2."\n"  换行
  3."\t"  大空格制表符
  4.输入Unicode编码的字符
  
  大小写转换：将字符串中的每一个字符
  
  转大写：var upper=str.toUpperCase();
  转小写：var upper=str.toLowerCase();
  
  获取字符串中指定的字符：str.CharAt(i)==str[i];
  
  获取字符串中指定位置的字符的ASCII码
  
  var ascii=str.CharCodeAt(i);
  
  通过ASCII码转回原文：
  
  var 原文=String.fromCharCode(ascii);
  

•   检索字符串：检查索引，检查下标：获取关键字的下标
  
     var i=str/arr.indexOf("关键字",starti);
     
     从starti位置开始，查找右侧第一个关键字的第一个字符的位置
     
     starti可以省略，默认从0的位置开始找
     
     返回值:找到了，返回第一个关键字的第一个字符的下标位置
     
           没找到，返回-1，其实我们根本不关心下标为多少，我们只关心下标为不为-1
     作用：判断有没有
     
     强调：数组也能使用此方法，数组这个方法是后期添加上的，原本此方法只有字符串可以用
     
     
     拼接字符串：var newStr=str.concat("新字符串"，...);  [还不如+运算]
     
  

•    截取字符串；3个       
     1.var subStr=str/arr.slice(starti,endi+1);这个比较好
     3.str.subString(starti,endi+1);不支持负数
     4.str.substr(starti,n);//n代表的是截取的个数
  

•    替换字符串：
   
     var newStr=str.replace("固定关键字"/正则表达式，“新内容”)；
     
  

•   切割/分割/分割字符串：
  
    作用：将字符串转为数组：
    var arr=str.split("自定义切割符")；
    
    注意：
    1.切割后，切割符就不存在了
    2.如果你的切割符写的是“”，会切散每一个字符
    
  

• 去掉空白字符： var newStr=str.trim去全部/ trim Start去开头 / trim End()

• js如何建立新元素：3步
  
  1.创建空标签：var elem=document.CreateElement("标签名");
  2.为其设置必要的属性和事件：
        elem.属性名="属性值"；
        elem.on事件名=function（）{操作}
  3.挂载上树/渲染页面：父元素.appendChild(elem);
  

day09

• 1.Math对象：专门提供了数学计算的API

  强调：不需要创建，可以直接使用
  
  API
  1.取整：3种
    上取整：超过一点点，就取下一个整数
   
     var num=Math.ceil(num);//小数位不超过15位，否则只能取整不能上取整
    
   下取整：无论超过多少都会省略小数部分
     
     var num=Math.floor(num);
     
   四舍五入取整
     
     var num=Math.round(num);//只取小数点第一位
     
  2.num.toFixed(d)
   
   n代表的是取多少位小数
   
   优点：1.可以四舍五入，并且可以保留到指定的小数位数
        2.解决浏览器带来的舍入误差
   缺点：结果是一个字符串，建议搭配上parseFloat（）使用
   
  

•    乘方和开方：
  
    乘方：Math.pow(底数，幂)----更简化：底数**幂
    
    开方：Math.sqrt(num)-----只能开平方
    
  

•    最大值和最小值
     
     var max/min=Math.max/ min(a,b,c,d...);自动在你传入的数字中比较出最大值和最小值
     
     问题：本身是不支持数组的运算的
     
     解决：固定用法：Max.max/ min.apply(Math,arr);
     
     apply具有数组打散的功能
     
     绝对值：把负数变为正数
     
     Math.abs(-1);
     
  

•    随机数:Math.random();在0-1之间去随机的小数
  
     搭配上parseInt，只能取到0，但不能取到1，意味着取不到最大值
     
     公式：parseInt（Math,random()*(max-min)+min）
     
  

•   Date对象
    创建：4种
     
     1.创建一个当前日期：
     var now=new Date();
     
     2.创建自定义时间:
     var elem=new Date("yyyy/MM/dd/ hh:mm:ss");
     
     3.创建一个自定义时间：
     var elem=newDate(yyyy,MM-1,dd,hh,mm,ss);  //这里月份要-1
     
     4.复制一个日期：
     
     为什么：日期的所有API都是直接修改原日期的，无法获得修改之前的日期，所以在执行API之前先进行复制，然后再操作复制后的日期
     
     var end=new Date(start);
     
  

•    API
     分量：时间的单位
     
     年月日星期：FullYear   Month  Date  Day
     时分秒毫秒：Hours  Minutes  Seconds  Milliseconds
     
     每个分量都有一对获取和设置的办法
     get xxx/ set xxx
     
     特殊：
     Month---0-11
     Date---1-31
     Day----0-6  0代表的是星期天
     Hours---0-23
     Minutes,Seconds:0-59
     
     2.Day,没有set的方法
     3.如果希望对某个分量进行加减操作：
      date.setxxx(getxxx)+/-n;
     4.格式化日期为本地字符：
      date.toLocaleString();垃圾
      
  

•    定时器
     1.周期性定时器：每过一段时间会执行一次，先等再做
     
     开启：timer=setInterval(回调函数，间隔秒数)
     
     停止：clearInterval(timer);
     
     2.一次性定时器：等待一段时间，只会做一次就结束了
  
     开启：timer=setTimeout(回调函数，间隔毫秒数)
     
     停止：clear Timeout(timer);
     
  

•    day10
     
   1.BOM----浏览器对象模型
   2.window对象
     1.全局对象：保存着全局变量和全局函数
     2.指代当前窗口本身：
     属性：
     1.获取浏览器的完整大小：outerWidth/outerHeight
     2.获取浏览器的文档显示区域的大小：innerWidth/innerHeight---
     3.获取屏幕的完整大小
     
  

•    方法：
     1.打开链接的新方式：
       1.当前窗口打开，可以后退：
       HTML：<a herf="url">内容</a>
       js:open("url","_self");
       
     2.当前窗口打开，禁止后退：使用场景：比如电商网站，结账后不许后退
       HTML做不到
       History:当前[窗口的历史记录] 他其实是可以前进后退
       Location:当前[窗口正在打开的URL]，有一个API：
       location.replace("新URL");//替换
     3.新窗口打开，可以打开多个
       HTML：<a herf"url" target="_blank">内容</a>
       js: open("url","_blank");
     
     4.新窗口打开，只能打开一个：使用场景：比如电商页面，只允许用户打开后，例如结账页面
     HTML：<a herf="url" target="自定义一个name">内容</a>
    
  

•   a标签的其他用途
   
    1.跳转
    2.锚点
    3.下载按钮：<a herf="xxx.exe/rar/zip">下载</a>
    4.打开图片和txt文档<a herf="xx.png/jpg/txt">打开图片和txt</a>
    5.直接书写js---不需要绑定事件<a herf="javascript:js代码">xxxx</a>
   
  

•    2.打开新窗口/新链接：newW=open("url","target","width=?,"height=?,left=?top=?");
         特殊：1.如果没有加第三个参数，那么窗口会和浏览器融为一体
               2.如果加了第三个参数，那么则会脱离浏览器独立存在
    
    3.关闭窗口window/newW.close()
    4.改变新窗口大小：newW.resizeTo(新宽，新高)；
    5.改变新窗口位置：newW.moveTo(新宽，新高)；
    6.window 提供了三个框
      警告框：alert
      输入框：var user=prompt
      确认框：var bool=confirm
      
    7.定时器也是window的提供的
    8.事件：
      1.window.onload事件--load加载：等待其他所有的资源加载完毕后才会执行的代码，放在里面的代码其实是最后才会执行的
      2.window.onresize事件---窗口如果大小发生了变化，就会触发，搭配上判断innerWidth可以理解为是js版本的css媒体查询
      3.window.onscroll事件---滚动事件，一旦滚动就会触发
      
      
    9.本地客户端存储技术：
      cookie：淘汰了，存储的大小只有2kb,而且操作极其麻烦，切割只能保存3天
      webStorage:H5带来的新特性，永久保存 非常简单
     
     分类：2种
     1.sessionStorage---会话级，只要浏览器一旦关闭，数据就会死亡
     2.localStorage---本地级，只要你不清空，就会永久存在
     
     两者用法一模一样，不用创建，直接可用
     
     操作：
     1.添加：xxxStorage.属性名=“属性值”;
     2.读取：xxxStorage.属性名；
     3.删除：xxxStorage.removeItem("属性名")；
     4.清空：xxxStorage.clear();
     
  

BOM的常用对象

history对象

1.history：保存了当前窗口的历史记录（过去的URL） 前进：history.go(1); 后退：history.go(-1); 刷新：history.go(0);

location对象

1.保存了当前窗口的正在打开的URL（现在的URL） 2.属性： 跳转：location=“新URL”--替换当前窗口，可以后退 跳转后，禁止后退：location.replace（“新URL”）替换当前窗口，禁止后退 刷新：location.rreload（）;

DOM

1.DOM查找元素

1.通过关系找元素
2.查找找元素：

    1.document.getElementsByxxx()--返回的是一个'动态集合';
    2.2个：
      1.var elem=document.querySelector("任意的css选择器");
      query--查询    selector--选择器
      缺陷：只能找到单个元素，如果匹配到多个，也只会返回第一个，没找到是null，一次只能操作一个元素
      2.var elems=document.querySelectorAll("任意的css选择器")
      优点：
      1.找到了是一个集合，没找到是一个空集合
      2.复杂查找时，非常简单
      3.返回的是一个静态集合

3.操作属性：
1.获取属性值：

核心 DOM：elem.getAttribute("属性名");
HTML DOM：elem.属性名;

2.设置属性值：

   核心DOM：elem.setAttribute("属性名","属性值");
   html dom:elem.属性名="属性值";

3.删除属性：
设置属性值为空字符串"",某些属性算是删除，但是只删除了属性值，属性名还在，而有的属性哪怕只有一个属性名，也会具有作用（herf,disabled,readonly）;

核心DOM：elem.removeAttribute("属性名")；
HTML DOM：elem.属性名="";  属性节点删不干净

4.判断有没有：垃圾

5.建议：优先使用HTML DOM

6.缺陷：
1.class必须写为className
2.自定义的东西都操作不了

如何创建元素上树

1.创建空标签：
var elem=document.creatElement("标签名");

2.为其设置必要的属性和事件：
elem.属性名="属性值";
elem.on事件名=function(){};

3.上树：3种
   1.*父元素.appendChild(elem);在父元素末尾追加一个子元素elem
   2.父元素.innerBefore(elem,已有子元素);在父元素追加一个子元素elem,但是是放在已有子元素前面
   3.父元素.replaceChild(elem,已有子元素);子父元素追加一个子元素elem,但是会替换掉已有子元素
   

删除元素：elem.remove();

let关键字

1.解决了声明提前
2.带来了块级作用域，一个{}就是第一个块，此变量只能在那个{}里面使用
3.如果用let去当作下标绑定事件，那么他会记录着你当前元素的下标，不再需要自定义下标了

归递

定义：简单来说就是在函数之中再一次调用了函数自己，迟早有一点会停下
何时：专门用于【遍历层次不明确】{那个刀剑传奇，火影忍者的例子}--DOM树和数据（children只能找到儿子层，找不到孙子层）

使用：

两步：
function 函数名（）{
1.第一层要做什么直接做
2.判断有没有下一层，如果有下一层再次调用此方法，只不过传入的实参是自己的下一层
}
函数名（函数实际的根）

缺陷：不能过多使用，不然会调用大量的函数，性能变差

绑定事件

1.在HTML上书写事件
2.*在js中使用时间处理函数属性
3.在js中使用时间API：不考虑老ie的话还是可以

event：

获取事件对象  event：

主流：会自动作为时间处理函数的第一个形参传入

老IE：event;

兼容：event;

事件委托：

target目标元素

1.目标元素：点击哪个是哪个，不会像this一样

主流：e.target;
老IE：e.srcElement;
兼容：e.srcElement;

this关键字

1.this的指向
单个元素绑定事件this---这个元素
多个元素绑定事件this---当前元素
箭头函数中的this---外部对象

函数中的js-----当前正在调用函数的
 定时器的this--window
 

强制改变this的指向

call/apply:临时的替换了函数的this--借用
语法：函数名.call(借用的对象，实参,...);---单独传入每个实参
     函数名.apply（借用的对象，arr);--只能传入一个实参要求是一个`数组`，apply其实会悄悄的打散数组    ·数组用apply·

bind:永久替换了函数的this---买

语法：var 新函数=函数名.bind(永久对象，永久实参，...)---不是立刻去执行需要自己调用

强调：bind绑定的新函数没办法被call/apply再次借用

`推荐用借用`

正则表达式

是什么：定义字符串中字符出现规则的表达式

何时使用：切割 替换 【验证】

语法：

1.最简单的正则表达式就是关键字原文  比如 "no"--/no/后缀

`后缀`：g(global):找全部     i:忽略大小写

2.备选字符集:/^[备选字符集]$/
强调：1.一个中括号，只管一位字符

      2.问题：正则表达式默认只要满足就不管后续了，而我们做验证的人，希望的是用户从头到尾按照我们的要求，完完全全的满足
      
解决：【做验证】前加^,后加$,两者同时使用，代表要求从头到尾完全匹配/^[备选字符集]$/

一些规则

一位数字[0-9];
一个字母[A-Za-z];
一个数字、字母、下划线[0-9A-Za-z_]
一位汉字[\u4e00-\u9fas]

预定义字符集

一位数字:\d---0-9
一位数字、字母、下划线：\w----0-9A-Za-z_
一位空白字符：\s

量词

预判公式

(?![0-9]+$)----不能全由数字组成，可能有大写、小写、汉字、日文、特殊符号...
(?![a-z]+$)----不能全由小写字母组成，可能有大写、数字、汉字、日文、特殊符号...
(?![0-9a-z]+$)----不能全由数字组成，也不能全由小写组成，也不能全由数字和小写的组合组成

支持正则表达式的字符串API

1.切割

var arr=str.split("固定切割符"/RegExp--这个是正则)；

2.替换（replace）

str=str.replace(/正则表达式/后缀，"新内容")；
replace支持正则，并且搭配上后缀g，这样就可以找到全部
缺陷：替换的新内容是固定的

高级替换法：

str=str.replace(/正则表达式/后缀，function(){})

何时前加^后加$,何时又该添加后缀g?

1.前加^后加$---验证
2.替换---希望替换所有

正则对象

创建：
1.直接量：var reg=/正则表达式/后缀；
2.构造函数:var reg=new RegExp("正则表达式"，"后缀")；

API:
1.验证:var bool=reg.test(用户输入的)；

swiper插件

专门的一个插件，提供了html/css/js方法

this的指向

1.单个元素绑定事件，this--->这个元素
2.多个元素绑定事件，this--->当前元素
3.定时器中的this-->window
4.箭头函数 this--->外部对象
5.函数中的this---->谁在调用此方法，this就是谁
6.构造函数之后this--->当前正在创建的对象

Object对象

面向对象：三大特点：封装、继承、多态

开发对象：

1.面向过程：开始--结束，其实我们一致的开发方式都是面向过程，先干什么，再干什么 2.面向对象：对象（属性和方法）

何时使用面向对象？ 以后任何操作都要封装在一个对象之中

为什么要面向对象：现实生活中所有的数据都必须包含在一个事物中才有意义

对象封装

封装、创建、定义：封装自定义

判断自有：

obj.hasOwnProperty("属性名");

判断共有：

 if(obj.hasOwnProperty("属性名")){
 自有
 }else{
 if ("属性名" in obj){
 共有
 }else{
 没有}
 }

修改和删除：自有和共有

自有：
修改：obj.属性名=新属性值；
删除：delete obj.属性名；

共有：
修改：原型对象.属性名=新属性值；（并没有修改而是在本地添加了一个同名属性）
删除：此操作无效

判断x是不是一个数组

1.Array.prototype.isPrototypeOf(x);
返回值是true是数组，false不是
x是数组才会返回true

2.判断x是不是由Array这个构造函数创建的

x instanceof Array；
返回值是true是数组，false不是

Array.isArray(x);
返回值是true是数组，false不是

输出【对象的字符串】形式

object.prototype.toString.call(x)==="[object  Array]"

if (Object.prototype.toString.call(arr) == "[object Array]") {
			console.log("数组");
		} else {
			console.log("不是数组");
		}

继承

实现自定义继承 1.两个对象之间设置继承

子对象.__proto__=父对象

2.多个对象之间设置继承

构造函数型名.prototype=父对象；
时机：应该在开始创建对象之前就设置好继承关系

class关键字：简化面向对象（封装、继承、多态）

  class类名 extends 老类{
      constructor(name ,age,hobby,...){
      //放在constructor里面的都是自有属性
      super（name，age）;
      this.hobby=hobby;
      }//放在constructor外面的都是共有方法
       //
}

闭包

专门用于防抖节流

希望保护一个可以反复使用的局部变量的一种词法结构，其实还是一个函数，只是写法比较特殊

如何使用：

1.两个函数进行嵌套
2.外层函数创建受保护的变量
3.外层函数return出内层函数
4.内层函数再操作受保护的变量

应该在哪里使用？

1.三个事件需要防抖节流
  1.elem.onmousemove
  2.input.oninput
  3.onresize---每次窗口改变大小都会触发

防抖节流：

function fdjl() {
			var timer = null;
			return function () {
				if (timer !== null) {
					clearTimeout(timer); timer = null;
				}
				timer = setTimeout(() => {
					操作

				}, 时间)
			}
		}

		var inner = fdjl();
		elem.on事件名 = function () {
                       inner（）；
		}

两链一包：

作用域链

1、作用域链：以函数的EC的scope chain属性为起点，经过AO，逐级引用，形成的一条链式结构，我们就称之为叫做作用域链 作用：查找变量，带来了变量的使用规则：优先使用自己的，自己没有找全局，全局没有就报错

原型链

2、原型链：每个对象都有一个属性叫做.proto，可以一层一层的找到每个对象的原型对象，最顶层的就是Object的原型，形成的一条链式结构，我们就称之为叫做原型链 作用：查找属性和方法，哪怕自己没有也会顺着原型链向上找，怪不得人人都能用toString()，因为他在最顶层

闭包

3、闭包：希望保护一个可以【反复使用的局部变量】的一种词法结构，其实还是一个函数，只是写法比较特殊 作用：专门用于防抖节流

脱衣服

如何脱掉后端传来的数据

后端穿衣服：var jsonText=JSON.stringify(obj1);
前端脱衣服：var jsonObj=JSON.parse(jsonText);