一、js概念-运行在浏览器端的解释型弱类型面向对象的脚本语言。
解释型：比较随意。碰到错误就停止。 弱类型：变量可以保存一切数据类型，由数据决定了数据类型是什么。
二、输出方式：
1、在控制台输出：console.log();
2、在页面上输出：document.write();
3、在警告框输出：alert();
用户输入框：var 保存=prompt("提示文字"); 复制代码
三、变量和常量：
var 变量名=值; const 常量名=值;
四、数据类型：
1、原始、基本、值类型： +Number/String/Boolean/Undefined/Null； 2、引用/对象类型：11个对象有很多很多的属性方法等待我们以后学习。 xx.xx; xx.xx();
五、运算符：
1.算术运算
注意：NaN：Not A Number，不是一个数字，他确实是数字类型，不在三界之中，不是一个有效的数字 全是缺点： 1、参与任何算术运算结果仍为NaN 2、参与任何比较运算结果都是false
2比较/关系：> < >= <= == != === !==
注意：布尔值 1、隐式转换：默认左右两边转为数字，再比较，如果参与比较的左右两边都是字符串的时候，按位PK每个字符串unicode号（ascii码） 数字<大写<小写<汉字 汉字的第一个字：一 - 4e00（19968） 龥 - 9fa5（40869） 2、参与任何比较运算结果都是false，我们不能使用普通的比较运算去判断x是不是NaN，解决： var bool=!isNaN(x); true=>是一个有效数字；false=>是一个NaN 3、undefined==null;//true 解决：undefined===null ===：全等：数值相同并且数据类型也要相同，不在带有隐式转换了 4、赋值运算、逻辑运算、自增和自减 其中： 单独使用，前++和后++没有区别 但是如果参与了别的表达式，变量中的值都会+1，返回不同 前++，返回的是新值 后++，返回的是旧值 var i = 1 var g = i++ + ++i + i++ + ++i; console.log(i) 5 console.log(g) 12
day2
1.分支结构
1、顺序结构 - 默认：从上向下依次执行每一句话 2、分支结构 - 通过条件判断，选择部分代码执行 3、循环结构 - 通过条件判断，选择要不要重复执行某块代码
if....else
1、else...if这句话想写多少，由程序员自己决定 2、else这句话可以省略不写，但是不推荐，如果不写，条件都不满足的情况，则什么事儿都不会发生 3、分支走了一条路，就不会再走别的路 让用户输入他的工资，计算应缴纳的税为多少 var user = prompt('请输入你的工资')
2、switch...case 分支
特殊：问题：默认只要一个case满足后，会将后续所有的操作全部做完 解决：break; 建议：每一个case的操作后面都跟上一个break 有的地方也可以不加break： 1、最后一个操作default可以省略break 2、如果中间多个条件，做的操作是一样的，可以省略掉中间部分 3、case在做比较的时候是不带有隐式转换的 4、default可以省略不写的，但是不推荐，如果不写，条件都不满足的情况，则什么事儿都不会发生
面试题：if vs switch的区别？
1、switch...case： 优点：执行效率较高，速度快（他比较时，case做的不是范围查找，而是等值比较） 缺点：必须要知道最后的结果是什么才可以使用 2、if...else...： 优点：可以做范围判断 缺点：执行效率较慢，速度慢（他做的是范围查找）
*****页面上一切数据js获取到后都是字符串类型
强制(显示)数据类型转换：
转字符串：2种方法
1、var str=x.toString();//x不能undefined和null，会报错，undefined和null不能使用.做任何操作，因为他们不是对象
2、var str=String(x);//万能的，任何人都可以转为字符串，但是绝对不要手动使用，完全等效于隐式转换，还不如+""
转数字：3种方法
1.parseInt(str/num); - parse解析 Int整型 - 专门用于将【字符串转为整数】 2.parseFloat(str); - parse解析 Float浮点型 - 专门用于将【字符串转为小数】
转布尔
Boolean(x);//万能的，任何人都可以转为布尔，但是绝对不要手动使用，完全等效于隐式转换，还不如 !!x 只有6个为false：0,"",undefined,NaN,null,false，其余全部都是true。 我们绝对不会手动使用，但是再分支或循环的条件之中，不管以后代老师写什么，他都会悄悄的转为一个布尔值，自带此方法 不管写什么，你只需要判断为不为这六个，不为这六个就是true，为这六个就是false
三目运算：简化分支的
day4
自定义函数Function
1.【声明方式】创建函数 function 函数名(形参列表){操作;return 返回值/结果;}
2.【直接量方式】创建函数 var 函数名=function(形参列表){ 操作; return 返回值/结果;} var 接住返回的结果=函数名(实参列表); 注意： //其实return的本意是退出函数，但是如果return后面跟着一个数据 //顺便将数据返回到函数作用域的外部，但是return只负责返回，不负责保存，所以调用函数时要自己拿个变量来接住他 //就算省略return，默认也有，会return一个undefined //*具体需不需要得到函数的结果，看你自己：如果有一天你在全局希望拿着函数的结果去做别的操作，那么记得加return //前辈们提供给你的方法，大部分基本上都加了return
作用域
1.全局作用域 2.函数作用域：局部变量 和 局部函数，在【当前函数调用时，内部可用】 带来了变量的使用规则：优先使用局部的，局部没有找全局要，全局也没有那就会报错 特殊点： 缺点：
1、千万不要再函数中对着未声明的变量直接赋值 - 全局污染：全局本身没有这个东西，但是被函数作用域给添加上了 2、局部可以使用全局的，但是全局不能使用局部的
声明提前： - 只会出现在鄙视之中
规则：在程序正式执行之前，将var声明的变量（轻）和function声明的函数（重），都会悄悄的集中定义在当前作用域的顶部，但是赋值留在原地 强调： 声明方式创建的函数会完整的提前（第一种） 直接量方式创建的函数不会完整提前，只有变量名部分会提前（第二种） 何时使用：永远不会自己使用，干扰我们判断的 - 只会在笔试中遇到，为什么平时开发不会遇到呢？ 只要你遵守以下规则：1、变量名和函数名尽量不要重复 2、先创建后使用
重载：相同的函数名，根据传入的实参的不同，自动选择对应的函数去执行，但是JS不支持，函数名如果重复了，后面的肯定会覆盖掉前面的
解决：在【函数内部】自带一个arguments的对象（类似数组对象）：不需要我们去创建 - 哪怕没有写任何形参，他也可以接受住所有实参，所以默认你看他length长度为0
固定套路：
1、通过下标去获取传入的某一个实参：arguments[i] - i从0开始 2、通过length去获取到底传入了几个实参：arguments.length 通过判断传入的实参的不同，在内部去写判断，从而变相的实现重载
数组
***每个元素都有一个自己的位置，称之为叫做下标，下标都是从0开始的，到最大长度-1结束 1、创建数组：2种 1、*直接量方式：var arr=[];//空数组 var arr=[数据1,...]; 2、构造函数方式：var arr=new Array();//空数组 var arr=new Array(数据1,...); 3.获取数组之中的元素 数组名[i] 4.后续添加/替换元素： 数组名[i]=新数据; 如果下标处没人则为添加，如果下标处有人则为替换
数组具有三大不限制
1、不限制元素的类型 2、不限制元素的长度 3、不限制下标越界 - 不是一个好东西
注意：
1.如果获取元素时，下标越界，返回的是一个undefined 2.如果添加元素时，下标越界，会得到一个稀疏数组，如果我们搭配上我们学过循环去遍历获取每个元素，那么你会得到很多很多undefined
问题：自己数下标，难免会数错，导致我们下标越界
数组中有一个唯一的属性：length 语法：数组名.length 作用：获取到数组的长度，长度是从1开始的
三个固定套路：
1、向末尾添加元素：arr[arr.length]=新数据; 2、获取数组的倒数第n个元素：arr[arr.length-n]; 3、缩容：删除倒数n个元素：arr.length-=n;
遍历数组：固定公式： for(var i=0;i<arr.length;i++){arr[i];//当前次元素}；
day5
1.*DOM：Document Object Model：文档对象模型：专门用于操作HTML文档的，提供了一些方法给你
DOM树概念
DOM将我们的HTML看作了是一个倒挂的树状结构，但是树根不是html标签，而是document的对象 document对象：不需要我们程序员创建，由浏览器的js解释器自动创建，一个页面只有一个document树根 作用：可以通过树根找到我们想要的任何一个DOM元素/节点/对象（属性和方法） DOM会将页面上的每个元素、属性、文本、注释等等都会被视为一个DOM元素/节点/对象
3、查找元素：两大方面：
1.直接通过HTML的特点去查找元素
1、通过 ID 查找元素：
var elem=document.getElementById("id值"); 特殊： 1、返回值，找到了返回当前找到DOM元素，没找到返回的一个null 2、如果出现多个相同id，只会找到第一个 3、记住控制台输出的样子，这个样子才叫做一个DOM元素/节点/对象，才可以下午去做操作 4、忘记此方法，不允许使用，id不好用，一次只能找一个元素。id留给后端用 5、其实根本不用查找，id直接可用
2、*通过 标签名 查找元素：
3、*通过 class 查找元素：
2、*通过关系去获取元素：前提条件：必须先找到一个元素才可以使用关系
父元素：elem.parentNode; - 单个元素 子元素：elem.children; - 集合 第一个子元素：elem.firstElementChild; - 单个元素 最后一个子元素：elem.lastElementChild; - 单个元素 前一个兄弟：elem.previousElementSibling; - 单个元素 后一个兄弟：elem.nextElementSibling; - 单个元素
4、操作元素：前提：先找到元素，才能操作元素，3方面
1、内容：
1、*elem.innerHTML - 获取和设置开始标签到结束标签之间的内容，支持识别标签的
获取：elem.innerHTML;
设置：elem.innerHTML="新内容";
2、elem.innerText - 获取和设置开始标签到结束标签之间的纯文本，不识别标签的
获取：elem.innerText;
设置：elem.innerText="新内容";
以上两个属性都是专门为双标签准备，而有一个单标签也是可以写内容，叫做<input />，我们如何获取？
3、input.value - 专门获取/设置input里的内容
获取：input.value;
设置：input.value="新内容";
2、属性： 获取属性值：elem.getAttribute("属性名"); 设置属性值：elem.setAttribute("属性名","属性值");
简化版：
获取属性值：elem.属性名;
设置属性值：elem.属性名="属性值";
简化版的缺点：
1、class必须写为className - ES6(2015年)class变成了一个关键字
2、不能操作自定义属性
3、样式： 使用样式的方式：3种 1、*内联样式 2、内部样式表 3、外部样式表 - 一阶段做开发用的都是外部样式表
二阶段我们就要用js来操作【内联样式】
1、不会牵一发动全身
2、优先级最高
获取样式：elem.style.css属性名;
设置样式：elem.style.css属性名="css属性值";
特殊点：
1、css属性名，有横线的地方，去掉横线，变为小驼峰命名法
border-radius ----- borderRadius
2、小缺陷：获取时，我们只能获取到内联样式，因为我们目前学的就是内联样式的操作
4、绑定事件： elem.on事件名=function(){ 操作; *****关键字this - 这个 如果单个元素绑定事件，this->这个元素 如果多个元素绑定事件，this->当前触发事件元素
一切的获取，往往都是为了判断 一切的设置，可以说是添加也可以说是修改
选项卡的题思路： 1.先建立4个li标签。4个div.(在一开始设置的时候，将div先关闭，给每个Li设置0，1，2，3的自定义下标） 2.遍历循环所有的li标签（集合） 3.用集合的名称【i】绑定点击事件 4.开启循环清楚所有的div和li上面的class(这里需要再次开启遍历循环） 5.给当前点击的li设置class为active 6.获取li上面提前准备好的自定义下标 7.给divs集合搭配上下表就能找到对应的。（注意className）写法。
表格的隔行变色。 思路： 1.首先建立表格 2.找到所有的行 3.找到一个对应的计算器， 4.给按钮进行绑定事件（每次点击计数+1）j++; 5.判断奇数次还是偶数次 6.如果是奇数次，所有行都在变色，奇数行变粉色，偶数行变透明色 7.如果是偶数次，同理，所有行都在变色，奇数行、偶数行都在变
购物车的案例： 思路： 1.遍历得到每一个按钮， 2.为其绑定点击事件 3.判断当前点击的是加号还是减号， 4.如果是加号：找到数量， 5将数量用一个变量保存起来，然后再重新上树再将数量+1； 6.找到单价，取出文字。 7.单价*数量， 8.减法反之。 9.求每一行的小计，找到tbody里面的每一行， 10.遍历每一行，找到每一行最后一个的，再累加起来。
