学js的第一周

day1-day5：

0、输出方式： 1、在控制台输出：console.log(); 2、在页面上输出：document.write();//绑定事件函数里面写了document.write()把页面上原来的HTML全部替换 3、在警告看输出：alert();//卡主整个页面

1、变量和常量 var 变量名=值;

const 常量名=值;

2、算术运算符：+ - * / % 特殊：%：模，取余

3、数据类型： 原始类型：5个，Number、String、Boolean、Undefined、Null

引用类型：11个，Array、Function

4、数据类型转换： 隐式转换： 算术运算符具有隐式转换： 默认，转为数字，在运算 true->1 false->0 undefined->NaN null->0 特殊：1、+运算碰上了字符串，则变为拼接 2、-*/%：字符串也能转为数字，纯数字组成的才行，包含非数字字符，则为NaN "1000"->1000 "100x0"->NaN

	NaN：不是一个数字，但是确实是数字类型
		缺点：
		  1、参与任何算术运算结果仍为NaN
		  2、参与任何比较运算结果都为NaN - 无法使用普通的比较运算判断x是不是NaN
			解决：!isNaN(x)
	     
强制转换：
	转字符串：xx.toString();//页面上一切的数据都是字符串，所以此方法几乎很少使用
				//undefined和null不能使用，因为他们不能使用.操作

	转数字：3个
		parseInt/Float(str);//从左向右依次读取每个字符，碰到非数字字符就停止，Int不认识小数点，Float认识第一个小数点

		Number(x);//完全等效于隐式转换，不会手动使用，还不如*1 /1 -0

5、Function：需要提前创建好的，以后可以反复使用的代码段 - 时机：要么程序员调用几次就执行几次，要么用户触发几次就执行几次 何时：1、不希望打开页面立刻执行 2、希望可以反复执行 3、独立的功能体 - 每一个作业（轮播、选项卡、购物车、正则验证、数据渲染...） 如何： 1、创建函数 function 函数名(形参,...){ 函数体; }

2、调用函数
	函数名(实参,...);

要不要带参数的函数具体看你自己：
	如果函数体是固定的，则不用
	如果函数体需要根据实参的不同，进行略微不同的操作，则需要带参数的函数

6、分支结构： 比较运算符：> < >= <= == != 逻辑运算符： &&：全部满足，才满足 一个不满足，则不满足

	||：全部不满足，才不满足
	    一个满足，则满足

	 !：颠倒布尔值

以上的所有的运算符结果都是布尔值

if(){}
if(){}else{}
if(){}else if(){}else{}

7、循环：反复执行 相同 或 相似的代码 - 时机：程序员写好的，而且几乎就一瞬间做完了，其实一次一次执行的，只不过速度很快 var 变量=几 while(条件){ 操作; 变量变化 }

for(var 变量=几;条件;变量变化){ 操作 }

死循环：while(true){} for(;;){}

退出循环：break;

8、数组：一个内存空间，可以保存多个数据 如何： 1、创建： var arr=[]; var arr=new Array();

2、访问：arr[i]; - 下标越界：undefined

3、添加：arr[i]=新值; - 下标越界：稀疏数组，下标不连续，遍历的时候就会得到很多很多的undefined

4、arr.length：获取数组的长度
	三个固定套路：
		末尾添加：arr[arr.length]=新值;
		获取末尾第n个元素：arr[arr.length-n];
		缩容：arr.length-=n;

5、数组三大不限制：类型、长度、下标越界（缺点）

6、遍历数组：
	for(var i=0;i<arr.length;i++){
		arr[i];//当前元素
	}

ECMAScript - 核心语法

DOM：Document Object Model - 文档对象模型，专门用于操作文档（HTML）

DOM树：DOM将HTML看做了是一个倒挂的树状结构，树根：document对象，不需要创建 DOM将每一个【元素】、文本、属性、注释，都看为是一个DOM节点/元素/对象 树根作用：找到任何元素，找到元素后就可以操作元素

1、查找元素： 1、通过 HTML 特性： id：单个元素 - 没找到返回null

	标签/class名：var elems=document/parent.getElementsByTag/ClassName("标签/class名");
		特殊：1、DOM集合 - 不允许直接做操作的，要么加下标拿到某个，要么加遍历拿到所有
		      2、parent：你之前已经找到的某个父元素
		      3、没找到：[]

2、通过 关系：至少要找到一个人，才能使用关系网
	父元素：elem.parentNode;
	子元素：elem.children; - 集合
	第一个儿子：elem.firstElementChild;
	最后一个儿子：elem.lastElementChild;
	前一个兄弟：elem.previousElementSibling;
	后一个兄弟：elem.nextElementSibling;

2、操作元素： 1、内容：innerHTML(能识别标签)/innerText(纯文本)/value(专门为input准备的) 获取：elem.xxxx 设置：elem.xxxx="新内容"

2、属性：
   获取属性值：elem.getAttribute("属性名") -> elem.属性名
   设置属性值：elem.setAttribute("属性名","属性值") -> elem.属性名="属性值"

   简化版有缺陷：
	1、class写为className
	2、自定义属性不能操作到

3、样式：内联样式
   获取：elem.style.css属性名
   设置：elem.style.css属性名="css属性值";

   特殊：1、css属性名有横线去掉横线变成小驼峰命名法
	 2、只能访问内联

3、绑定事件： 单个元素：elem.onclick=function(){}

多个元素：for(var i=0;i<elems.length;i++){
		elems[i].onclick=function(){}
	  }

this关键字：目前只能在【事件】中使用
	单个元素绑定事件this->这个元素：绑定事件的这个元素

	多个元素绑定事件this->当前元素：当前触发事件的元素

day6： 1、***数据类型转换 1、强制转换：3类 1、转字符串： 1、x.toString();//x不能是undefined和null - undefined和null不能. 2、String(x);//万能的，任何人都可以转为字符串，不重要 不重要的原因： 1、页面上一切的数据都是字符串 2、String(); 完全相当于隐式转换 - 还不如+""

   2、*转数字：
	1、*parseInt/Float(str);//专门为字符串转数字准备的
		原理：从左向右依次读取每个字符，碰到非数字字符就停止，如果一来就不认则为NaN，
		      Int不认识小数点，Float认识第一个小数点

	2、Number(x);//万能的，任何人都可以转为数字，不重要 - 完全相当于隐式转换 - 还不如-0 *1 /1

   3、转布尔：
	   Boolean(x);//万能的，任何人都可以转为布尔，不会手动使用的，还不如：!!x
	   ***只有6个会为false：0,"",undefined,null,NaN,false，其余都为true
	   在分支、循环的条件之中，以后不管代老师写的是什么，他都会悄悄的隐式转换为布尔值，你只需要考虑为true还是为false

2、隐式转换：都是出现在运算符之中

2、****运算符和表达式： 1、算术运算符：+ - * / % 特殊：1、%：取余，判断奇偶性 2、隐式转换：默认转为数字，在运算 true->1 false->0 undefined->NaN null->0 特殊：1、+运算，碰到字符串，拼接 2、-/%：字符串可以转为数字，但是纯数字组成才行，但凡包含一个非数字字符，则为NaN

2、*比较运算符：> < >= <= == != === !==
	  结果：布尔值
      隐式转换：默认，转为数字，再比较大小
	  特殊：1、如果参与比较的左右两边都是字符串，则是按位PK每个字符的十六进制unicode号（十进制ascii码）
			0-9<A-Z<a-z<汉字：常识：汉字的第一个字：一：unicode：4E00 - ascii：19968
						    最后一个字：龥：unicode：9FA5 - ascii：40869

		2、NaN参与任何比较运算结果都是false，所以没有办法用普通的比较运算判断是不是NaN
			!isNaN(x);

		3、undefined==null;//true
		   区分：undefined===null;
		   === !==：不带隐式转换的等值比较和不等比较，要求数值相同，并且数据类型也要相同

		function String(x){
			if(x===undefined){
				return "undefined";
			}else if(x===null){
				return "null";
			}else{
				return x.toString();
			}
		}


3、*逻辑运算：
	&&：全部满足，才true	
            一个不满足，则false

	||：全部不满足，才false
	    一个不满足，则true

	 !：颠倒布尔值

	特殊：短路逻辑：如果前一个条件，已经能够得出最后结论了，则不看后续
		&&短路：如果前一个条件满足，才执行后续操作，如果前一个条件不满足，则不管后续操作
		  目的：简化【简单的】分支：1、一个条件一件事满足就做，不满足就不做 if(){}	  2、操作只能有一句话
			条件&&(操作);
		  举例：原来：if(money>=500){money*=0.8};
			现在：money>=500&&(money*=0.8);