这几天电脑有点问题，始终在弄，而且论文也迫近了也在工夫弄那个 ，后面node有一个大我的项目，曾经做完了，我当初是筹备把上次温习断下的持续温习始终到这个我的项目，而后就开始vue了。
1.
首先是函数的一个进阶，要明确函数也是对象，所以是能够通过new的办法来创立实例的。
而后是调用函数的三个办法：call能够扭转this加调用、apply能够扭转this然而传的参数是数组也能够调用、bind能够扭转this传的参数也跟第一个call一样然而就是不会本人调用。
2.
明天的主打内容
闭包首先要晓得严格模式，use srict放在部分或者全局作用域都能够，而后有哪些变动，变量必须申明赋值啊、this一般函数为undefined啊、函数形参不能重名啊、函数生命必须在顶层啊等等、
高阶函数：就是函数外面嵌套一个函数或者return为一个函数
而后就是闭包，什么事闭包？
闭包就是一个可能拜访函数局部变量的函数，两个留神点，一个是函数，一个是拜访局部变量。
还是跟以前一样传一些我第二次做有些感想的案例吧，就不全副传上来了。第一个是点击li打印索引号通过闭包来做
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> <ul> <li>1</li> <li>2</li> <li>3</li> <li>4</li> <li>5</li> </ul> <script> /* let ul = document.querySelector('ul') for(var i = 0; i < ul.children.length; i++) { ul.children[i].setAttribute('data-index',i) ul.children[i].onclick = function() { console.log(this.getAttribute('data-index')); } } */ // 这里我本人做了一下没有用到闭包来实现，如果规定不能增加本人的属性呢 // 这个时候你只能用i 然而当你一点击就打印出i的值那必定是最初一个i退出循环的值，为什么，因为这里for是主栈道上的代码，会先执行完， // 才会去执行事件外面的异步工作也就是回调函数，所以这里能够先用一个立刻执行函数，一执行到这个i就先把这个i保存起来有几个循环就有几个立刻执行函数， // 当你一点击就把函数外面存着的i给到他 两个函数 两个作用域 用到了局部变量 所以闭包产生 let ul = document.querySelector('ul') for(var i = 0; i < ul.children.length; i++) { /* ul.children[i].onclick = function() { console.log(i); } */ (function(i) { ul.children[i].onclick = function() { console.log(i); } })(i) } </script></body></html>而后是闭包算价格这个，看得出来还有点没有齐全吃透闭包的原理
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> <!-- 打车起步价13(3公里内), 之后每多一公里减少 5块钱. 用户输出公里数就能够计算打车价格如果有拥挤状况,总价格多收取10块钱拥挤费 --><script> function getMoney() { let total = 13 let price = 0 return { price : function(n) { // console.log(total, mile); if(n > 3) { price = total + Math.ceil(n - 3) * 5 } else { price = total } return price }, congestionPrice : function(n,congestion) { this.price(n) if (congestion) { price += 10 } else { price = total } return price } } } console.log(getMoney().price(1)); console.log(getMoney().congestionPrice(1,true)); console.log(getMoney().price(4)); console.log(getMoney().congestionPrice(4, true));</script></body></html>3.
递归
递归就是在函数外部在调用本身，相似于循环，通过return来完结。递归有几个经典案例我感觉能够看一下，这次做还是纯熟了好多
第一个求阶乘
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> <script> // 利用递归函数求1~n的阶乘 1 * 2 * 3 * 4 * ..n function getResult(n) { if (n == 1) { return 1 } return n * getResult(n - 1) } console.log(getResult(3)); </script></body></html>而后斐波拉起亚数列
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> <script> /* 利用递归函数求斐波那契数列(兔子序列) 1、1、2、3、5、8、13、21...// 用户输出一个数字 n 就能够求出 这个数字对应的兔子序列值// 咱们只须要晓得用户输出的n 的后面两项(n-1 n-2)就能够计算出n 对应的序列值 */ function getResult(n) { if (n == 1 || n == 2) { return 1 } return getResult(n - 1) + getResult(n - 2) } console.log(getResult(5)); </script></body></html>这个有一点问题，我明说我没执行进去，然而我真的很想晓得我错在哪里了，原理都摆在这里是没问题的，代码也没问题，求大神指教
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> <script> /* 咱们想要做输出id号,就能够返回的数据对象*/ var data = [{ id: 1, name: '家电', goods: [{ id: 11, gname: '冰箱', goods: [{ id: 111, gname: '海尔' }, { id: 112, gname: '美的' }, ] }, { id: 12, gname: '洗衣机' }] }, { id: 2, name: '服饰'}]; var o = {} function getData(arr, id) { arr.forEach(function(item) { if (item.id == id) { o = item return o } else if(item.goods && item.goods.length > 0) { getData(item.goods, id) } }) } console.log(getData(data, 1)); console.log(getData(data, 11)); </script></body></html>说到了递归就顺便说一下浅拷贝和深拷贝。
浅拷贝就是只拷贝外表的一层，深层次的货色就拷贝援用，就是不论你改哪边的数据，单方都会受影响
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> <script> // 浅拷贝只拷贝一层 更深层次只拷贝援用 也就是你改或者他改值单方都受影响 var obj = { id: 1, name: 'andy', msg: { age: 18 } } var o = {} for (k in obj) { o[k] = obj[k] } console.log(o); console.log('------------------') // es6疾速浅拷贝语法 Object.assign(obj, o) console.log(o); </script></body></html>而后就是深拷贝，深拷贝就是能够独自开拓空间，各管各的，互不影响，深拷贝的函数用到了递归，这个还是要记一下的
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> <script> // 深拷贝就是更深层的数据 也会独自开拓空间 比方数组、函数等 var obj = { id: 1, name: 'andy', msg: { age: 18 }, color: ['pink', 'red'] } let o = {} function getCopy(usedCopy, useCopy) { for (k in usedCopy) { if (usedCopy[k] instanceof Array) { useCopy[k] = [] getCopy(usedCopy[k], useCopy[k]) } else if (usedCopy[k] instanceof Object) { useCopy[k] = {} getCopy(usedCopy[k], useCopy[k]) } else { useCopy[k] = usedCopy[k] } } } getCopy(obj, o) console.log(o); </script></body></html>4.
接下来是正则表达式。
这个其实各种语法我就不多说了，参考mdn、菜鸟教程这些多得很，我说一下明天的案例有一个替换敏感字符嘛，正则外面的规定是中文的话不必写引号，间接写进去就是，一个案例邮箱提取，说一下exec这个办法怎么来屡次调用
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> <script> /* 将字符串'小明：大神么么哒，正好是我想要的，我的邮箱是[email protected]小红：我老公最爱看这个了，我想给他一个惊喜，么么么哒， 邮箱是[email protected]我：坏蛋毕生安全，邮箱是[email protected]'中所有的邮箱号码提取进去 */// 留神 要应用exec进行屡次匹配不仅正则要增加全局匹配 而且还有用一个while循环 let str = `小明：大神么么哒，正好是我想要的，我的邮箱是[email protected]小红：我老公最爱看这个了，我想给他一个惊喜，么么么哒， 邮箱是[email protected]我：坏蛋毕生安全，邮箱是[email protected]` let reg = /\[email protected]\w+.[a-zA-z]+/g var result = reg.exec(str) while(result!== null) { console.log(result[0]); result = reg.exec(str) } </script></body></html>正则差不多就这样了
5.
而后是一些es6语法：let、const、解构赋值、箭头函数。
其实我始终搞不懂let这个块级作用域到底是限度在哪里，我感觉作用域范畴跟var一样哪里都能够用，所以我前面根本都用let申明的变量。当然我这个是错误思想哈，我是想当前缓缓通过实例来理解。
而后残余参数也就是扩大运算符三个点，而后就是array新增的一些办法、form能够将维数组或者对象转为数组，第二个参数能够循环对每一个进来的值做操作，arr.find能够找满足第一个条件的值，没有就返回undefined，参数也是写item\而后对应的findindex就是找
满足第一个条件的参数的下标，还有就是查找数组外面有没有蕴含这个值.includes
而后就是模板字符串。
string页新增了一些办法：str.strtwith endstith看这个字符有没有在这个字符串的结尾或结尾。
.repeat能够将字符创反复n次返回一个新数组。
最初就是set数据结构因为跟数组类似，通过new 外面的参数能够传数组，又因为本身的没有反复值的特点所以给数组起到一个去重的操作
而后他的一个属性.size能够查看set数据结构有多少值
add办法连式编程的模式新增数据
delete办法删除返回的是布尔值
has查看有无返回布尔值
clear清空数据结构
最初set也能够用forEach进行一个遍历操作