day04:
自定义函数:
一、创建
1.声明方式 创建函数
function 函数名(形参1,形参2,..){
函数体;
return 返回值;
}
2.直接量方式 创建函数
var fn=function(形参1,形参2,..){
函数体;
return 返回值;
}
注意：函数名不要重复,否则函数会被覆盖成最后一个同名的函数。
return:
①本意是退出函数,但如果return后跟了一个值则表示返回该值。
②return只负责返回值不负责保存值,所以放我们调用的函数有返回值时,需要去创建一个变量去保存返回的。
③return后不跟值时实际上也会有一个返回值,默认为undefined,而undefined对于我们来说是无用的,所以在写代码的时候,如果return没写返回值时我们就不创建变量去保存函数返回的undefined。
④如果在全局变量需要使用到局部变量,则需要return去返回函数里创建的局部变量。
二、调用
函数名(实参1,实参2,..);
三、作用域
1.全局作用域:全局变量、全局函数,在任意一个地方都可以使用。
2.局部作用域:局部变量、局部函数,只能在函数调用时,函数内部使用。
变量的使用规则:有先使用局部变量,局部没有则使用全局变量,全局变量再没有直接报错。
特殊点(是缺点):
①局部可以使用全局的,但是全局不能使用局部的(可以解决,使用return来返回局部的)
②不能再局部里面对为声明的变量进行赋值,会造成全局污染,降低网页性能
比如：在局部里a=1;此时a不仅仅在局部能使用，在全局也能使用。
四、声明提前(实际开发基本不用,一般出现在面试题里)
原理:在程序正式执行之前会将var声明的变量(轻)和function声明的函数(重)提前到当前作用域的顶部，但是赋值留在原地
强调：
声明方式创建的函数会整个提前，直接量方式声明的函数只会将var 函数名 部分提前。
五、重载
同一作用域内的几个函数名字相同但形参列表不同。
目的:减轻程序员书写代码的压力
方法:在函数的内部自带一个arguments对象(类数组对象:就是格式与数组结构类似,拥有length属性,并且可以通过索引来访问或设置里面的元素,但是不能使用数组的方法),其作用就是没有任何形参，但是能接住所有的实参。
固定套路：
通过固定下标去获取传入的某一个实参;
通过length去获取到数组的长度。
Attay 数组的基础
创建一个变量保存多个数据。
数组都是线性排列的，出了第一个元素以外的所有元素都有唯一的前驱元素，出了最后一个元素以外都有唯一的后继元素。
每一个元素都一个自己的位置,称之为下标,下标是从0开始到最大长度-1(.length-1)。
创建数组:2种
直接量方式 var arr=[];//空数组
var arr=[数据1,数据2,数据3,...]
构造函数方式 var arr=new Array();//空数组
var arr=new Array(数据1,数据2,数据3,...)
获取数组中的元素
数组名[index] index为元素下标
后续添加/替换元素
数组名[index]=新数据;
下标签没有数据则为添加,下标处有数据则为替换
数组具有三大不限制
不限制元素的类型
不限制元素的长度
不限制下标越界
如果获取元素时,下标越界则返回undefined
如果添加元素时,下标越界,会得到一个稀疏数组
三个固定套路
在数据末尾添加元素 arr[arr.length]=新数据;
获取数组的倒数第n位元素 arr[arr.length-n]
缩容(将数组的长度变小)删除倒数第n个元素 arr.length -= n;
遍历数组
for(var i = 0;i<arr.length;i++){}
day05
DOM Document Object Model 文档对象模型，提供了一些方法用于操作HTML文档
DOM树
概念：DOM将html看做一个倒挂的树状结构，树根为document
document对象：不需要程序员创建，由浏览器的js解释器自动创建，一个页面只有一个document树根
作用：可以通过树根对象找到我们想要的任何一个DOM元素/节点/对象
查找元素：两大方面
1.直接通过HTML的特点去查找属性
①通过ID去查找元素
var elem = document.getElementById("id值");
特殊：
找到了就返回当前找到的DOM元素，没找到就返回一个null
如果出现了多个相同id，只会找第一个
一个DOM元素 -> <elem 属性="属性值">内容</elem>
id不用查找，直接就可以使用
②通过标签名去查找元素
var elem = document.getElementsByTagName("标签名");
特殊:
找到了返回一个类数组DOM集合，没找到返回一个空集合
js只能直接操作DOM元素，不能直接操作DOM集合，要么通过下标拿到某一个，要么通过遍历拿到每一个
通过document会找到所有的该元素，如果想要某一个元素下的该元素，则可以先找到该元素的父元素，通过父元素再找到该元素
③通过class名去查找元素
var elem = document.getElementsByClassName("class名");
特殊：
找到了返回一个类数组DOM集合，没找到返回一个空集合
js只能直接操作DOM元素，不能直接操作DOM集合，要么通过下标拿到某一个，要么通过遍历拿到每一个
通过document会找到所有的该元素，如果想要某一个元素下的该元素，则可以先找到该元素的父元素，通过父元素再找到该元素
2.通过元素之间的关系去查找元素
1.父元素 elem.parentNode;
2.子元素 elem.childrem;
3.第一个子元素 elem.firstElementChild;
4.最后一个子元素 elem.lastElementChild;
5.前一个兄弟元素 elem.previousElementSibling;
6.后一个兄弟元素 elem.nextElementSibling;
操作元素 先找到元素，才能操作元素
1. 内容
elem.innerHtml 获取/设置开始标签到结束标签之间的内容，识别标签
获取：elem.innerHTML
设置：elem.innerHTML = "新内容"
elem.innerText 获取/设置开始标签到结束标签之间的纯文本，不识别标签
获取：elem.innerText
设置：elem.innerText = "新内容"
2.属性
获取属性值 elem.getAttribute("属性名");
设置属性值 elem.getAttribute("属性名","属性值")
简化：
获取： elem.属性名
设置： elem.属性名="属性值"
两个缺陷：
class必须写成className
不能操作自定义属性
3.样式
获取：elem.style.css属性名；
设置：elem.style.css属性名="属性值"；
特殊：
css属性有-的地方改为小驼峰命名法
只能获取到内联样式
一切的获取都是为了做判断，一切的设置是为了修改
绑定事件
elem.on事件名 = function(){
操作；
}
关键字this
绑定单个事件 --> this表示这个元素
绑定多个时间 --> this表示当前触发事件的元素
day06
数据的基础
面试题：按值传递 var a = x; var b = a;问如果改变a b是否会变，改变b a是否会变？
如果传递的是原始类型则两者互不影响
如果传递的是引用类型则改变一个另一个会跟着改变
面试题：如何释放引用类型
先看引用类型被引用了几次，要释放该引用类型则需要将所以【引用了】【该引用类型】的变量全部释放
hash数组
索引数组的下标无具体意思，不便于查找
如何使用：
创建空数组： var arr=[];
为数字添加下标且赋值 arr["下标名"]="新值"
访问 arr["自定义下标"]
强调 hash数组的length失效 永远为0
利用for in来遍历
for(var i in hash数组名){
数组名[i];
}
数组的API
1.arr转str
var str = arr.join("自定义连接符")
固定套路
①arr.join("") 无缝连接为一句话
②将数组拼接为DOM页面元素（数据渲染页面）
selects[1].innerHTML ="<option>"+capital[index].join("</option><option>")+"</option>"
2.拼接数组
var 数组 = arr.concat(新值...)
特殊
1.不修改原来的数组，会返回一个新的数组
2.concat支持传入数组
3.截取子数组
var 数组 = arr.slice(i,p) i表示开始下标 p表示结束下标
特殊：
不修改原来的数组，返回一个新数组
含头不含尾
p可以不写，表示从开始下标到结尾
开始下标和结束下标都可以不写，此操作成为深拷贝
也支持负数，-1表示倒数第一个
4.删插替
var del = arr.splice(i,n) i表示开始下标 n表示几个
特殊：直接修改数据，有返回值，返回的是被删的数据组成的新数组
var del =arr.splice(i,0,新数据) i表示开始下标
特殊：原来开始下标的位置的元素以及后续元素都会向后移动
尽量不要插入数组
var del = arr.splice(i,n,新数据) i开始下标 n删除个数
特殊 删除的个数和插入的个数可以不同
5.翻转数组
arr.reverse();
select专属事件 onchange 选中项发生改变的时候
select专属属性 selectedIndex 获取选中项的下标
day07
6.数组排序
arr.sort();默认将数组里的元素转为字符串后,按位进行比较每个字符的Unicode号
解决：
升序
arr.sort(function(a,b){
return a-b;
})；
a-b>0 前一个数大于后一个数;a-b<0 前一个数小于后一个数;a-b==0 前一个数等于后一个数;
降序
arr.sort(function(a,b){
return b-a;
});
强调:网页有排序功能，说明底层一定是一个数组，因为js之中只有数组可以排序
生成随机数 Math.random(max-min+1)+min 带有小数的随机数
栈和队列：添加元素和删除元素的新方式
栈：其实就是数组，只不过一端封闭了，只能从一端进出
开头进：arr.unshift(新值,..)向前添加 缺点:导致其他元素下标发生改变
开头出：arr.shift()向前删除，一次删除一个，有返回值，返回被删除的元素，缺点：导致其他元素下标发生改变
结尾进：arr.push(新值,..)向后添加
结尾出：arr.pop()向后删除，一次删除一个，有返回值，返回被删除的数据
队列：其实也是数组，一端进，另一端出
开头进：arr.unshift(新值,..)向前添加 缺点:导致其他元素下标发生改变
结尾出：arr.pop()向后删除，一次删除一个，有返回值，返回被删除的数据
结尾进：arr.push(新值,..)向后添加
开头出：arr.shift()向前删除，一次删除一个，有返回值，返回被删除的元素，缺点：导致其他元素下标发生改变
鼠标移入：elem.onmouseover=function(){}
鼠标移出：elem.onmouseout=function(){}
周期性定时器：
开始 timer = setInterval(function(){操作;},间隔毫秒)
停止 clearInterval(timer);
ES5提供的3组（6个）新的API
1.判断 2个 结果为一个布尔值
every：每一个，要求所有的元素都满足条件才为true，主要有一个不满足则为false,类似于&&
var bool = arr.every(funciton(val,i,arr){
//val 当前的值
//i 当前值的下标
//arr 数组本身
return 判断条件;
})
some：有一些，要求只要有一个元素满足条件就为true,全部不满足条件才为false，类似于||
var bool = arr.some(funciton(val,i,arr){
//val 当前的值
//i 当前值的下标
//arr 数组本身
return 判断条件;
})
2.遍历，拿到数组中的每一个元素做相同或相似操作
forEach---直接修改原数组
arr.forEach(function(val,i,arr){
操作;
})
map---不会修改原数组，返回一个新数组
var newArr = arr.map(function(val,i,arr){
操作;
})
3.过滤和汇总
过滤：筛选出需要的部分，不会修改原数组
var newArr = arr.filter(function(val,i,arr){
return 判断条件;
})
汇总：
var result = arr.reduce(function(prev.val,i,arr){
//prev 当前数据的前一个数据
return prev+val;
})
ES6箭头函数，专门简化一切匿名回调函数
简写公示 function去掉，()和{}之间添加=>如果形参只有一个name()省略，如果函数体只有一句话，那么{}省略，如果函数体只有一句话且是return，那么{}和return都省略;
二维数组:数组的元素，又引用着另一个数组
何时使用:在一个数组，希望再次细分每一个数组
创建：
var arr=[
[],
[],
[]
];
访问：数组名[行下标][列下标]
特殊：面试题
列下标越界，返回undefined
行下标越界，得到一个把报错，因为行下标越界后得到一个undefined，undefined没有资格加[]做操作
遍历二维数组，必然两层循环
for(var r=0;r<arr.length;r++){
for(var c=0;c<arr[i].length;c++){
arr[r][c];
}
}
day 08
String的概念
什么是字符串：多个字符组成的【只读】字符【数组】
和数组的相同点
1.字符串中的个数 str.length
2.获取某个字符 str[i]
3.遍历
4.所有不修改原数组的数组API，字符串也有使用（concat,slice）
不同点
所有直接修改原数组的数组API，字符串都不可以使用
字符串也有很多自己的API
1.转移字符：\
作用：
①将字符串和程序冲突的转为原文
" \"把双引号转为""\" " 不转程序会报错
②包含特殊功能的符号
换行：\n
制表符：\
③输出Unicode编码的字符 \u
汉字的第一个字 \u4e00 ascii码 19968
汉字的最后一个字 \u9fa5 ascii码 40869
2.***大小写转换
when：程序不区分大小写，就要【先统一】的转为大写小写，再比较
how: var 大写 = str.toUpperCase();
var 小写 = str.toLowerCase();
3.获取字符串中指定位置的字符
str.charAt(i) === str[i]
4.***获取字符串中指定位置字符的ASCII码
var acsii = str.charCodeAt(i);
通过ascii码传回原文
var str = String.fromCharCode(ascii码)
5.***检索字符串 获取关键字的下标
var i= str.indenxOf("关键字"，starti)
从starti位置开始，查找右侧第一个关键字的第一个字符的位置
starti可以不写，表示从开始位置开始查找
返回值：
找到了则返回关键字的第一个字符的下标，没找到则返回 -1
作用：判断在字符串中有没有关键字
数组也有该方法，但是老IE（ie8以下）没有该方法
面试题：获取某个字符串中所有关键字的下标
var str = "no zuo no die why you try"
var index = -1;
while((index = str.indexOf("no",index+1))!=-1){
console.log(index);
}
6.拼接字符串
var newArr = str.concat(新字符串,..) 不如+运算
7.***截取字符串
var subStr = str/arr.slice(starti,endi);
= str.substring(starti,endi);//不支持负数
= str.substr(starti,n); //n代表截取的个数
8.替换字符串
var newstr = str.replace("关键字","新内容");
9.切割/分割/分隔字符串
作用：将字符串切割为数组 str <=> arr
var arr = str.split("自定义切割符");
特殊：
切割后，切割符就不在了
如果你的切割符为""，切割每一个字符
10.去掉空白字符
str.trim()/str.trimStart/str.trimEnd()
