原型链继承
原型链继承关键：子类构造函数的原型为父类构造函数的实例对象缺点：
子类构造函数无法向父类构造函数传参。
所有的子类实例共享着一个原型对象，一旦原型对象的属性发生改变，所有子类的实例对象都会收影响
如果要给子类的原型上添加方法，必须放在 Son.prototype = new Father()语句后面
123456789101112131415161718192021 function Father(name) { this.name = name } Father.prototype.showName = function () { console.log(this.name); } function Son(age) { this.age = 20 } // 原型链继承,将子函数的原型绑定到父函数的实例上,子函数可以通过原型链查找到复函数的原型,实现继承 Son.prototype = new Father() // 将Son原型的构造函 ...
尾递归优化斐波拉契数列
尾递归优化斐波拉契数列正常的斐波拉契数列js实现方式12345678const Fibonacci = (n) => { if (n <= 1) return 1; return Fibonacci(n - 1) + Fibonacci(n - 2);}Fibonacci(10) // 89Fibonacci(40) // 165580141 计算缓慢有延迟了Fibonacci(100) // 栈溢出，无法得到结果
使用尾递归优化该方法12345678const Fibonacci = (n, sum1 = 1, sum2 = 1) => { if (n <= 1) return sum2; return Fibonacci(n - 1, sum2, sum1 + sum2)}Fibonacci(10) // 89Fibonacci(100) // 573147844013817200000 速度依旧很快Fibonacci(1000) // 7.0330367711422765e+208 还 ...
八大数据结构
八大数据结构
1. 栈
栈是一个后进先出的数据结构。JavaScript中没有栈，但是可以用Array实现栈的所有功能。
1234567891011// 数组实现栈数据结构const stack = []// 入栈stack.push(0)stack.push(1)stack.push(2)// 出栈const popVal = stack.pop() // popVal 为 2
使用场景
场景一：十进制转二进制场景二：有效括号场景三：函数调用堆栈
2. 队列
队列是一个先进先出的数据结构。JavaScript中没有队列，但是可以用Array实现队列的所有功能。
1234567891011// 数组实现队列数据结构const queue = []// 入队stack.push(0)stack.push(1)stack.push(2)// 出队const shiftVal = stack.shift() // shiftVal 为 0
使用场景
场景一：日常测核酸排队场景二：JS异步中的任务队列场景三：计算最近请求次数
3. 链表
链表是多个元素组成的列表，元素存储不连续， ...
算法基础
算法基础算法简介
1959年Shell发明，第一个突破O(n2)的排序算法，是简单插入排序的改进版。它与插入排序的不同之处在于，它会优先比较距离较远的元素。希尔排序又叫缩小增量排序。
时间&空间复杂度
复杂度是数量级（方便记忆、推广），不是具体数字。常见复杂度大小比较：O(n^2) > O(nlogn) > O(n) > O(logn) > O(1)
1.1 时间复杂度常见时间复杂度对应关系：
O(n^2)：2层循环（嵌套循环）
O(nlogn)：快速排序（循环 + 二分）
O(n)：1层循环
O(logn)：二分
1.2 空间复杂度 常见空间复杂度对应关系：
O(n)：传入一个数组，处理过程生成一个新的数组大小与传入数组一致
三种数组去重的方法
三种数组去重的方法
用filter123456789function unique(arr) { return arr.filter(function(item, index, arr) { //当前元素，在原始数组中的第一个索引==当前索引值，否则返回当前元素 return arr.indexOf(item, 0) === index; });}var arr = [1,1,'true','true',true,true,15,15,false,false, undefined,undefined, null,null, NaN, NaN,'NaN', 0, 0, 'a', 'a',{},{}]; console.log(unique(arr))
利用ES6 Set去重（ES6中最常用）1234567function unique (arr) { return Array ...
提取出url 里的参数并转成对象
提取出url 里的参数并转成对象
123456789101112131415function getUrlParams(url){ let reg = /([^?&=]+)=([^?&=]+)/g let obj = { } url.replace(reg, function(){ obj[arguments[1]] = arguments[2] }) // 或者 const search = window.location.search search.replace(/([^&=?]+)=([^&]+)/g, (m, $1, $2)=>{obj[$1] = decodeURIComponent($2)}) return obj}let url = 'https://www.junjin.cn?a=1&b=2'console.log(getUrlParams(url)) // { a: 1, b: 2 ...
实现 jsonp
实现 jsonp
123456789101112131415// 动态的加载js文件function addScript(src) { const script = document.createElement('script'); script.src = src; script.type = "text/javascript"; document.body.appendChild(script);}addScript("http://xxx.xxx.com/xxx.js?callback=handleRes");// 设置一个全局的callback函数来接收回调结果function handleRes(res) { console.log(res);}// 接口返回的数据格式handleRes({a: 1, b: 2});
使用setInterval实现setTimeout
使用setInterval实现setTimeout
实现思路是使用递归函数，不断地去执行 setTimeout 从而达到 setInterval 的效果
1234567891011function mySetInterval(fn, t) { const timer = setInterval(() => { clearInterval(timer) fn() }, t) mySetInterval(() => { console.log('hoho'); }, 1000)}
使用 setTimeout 实现 setInterval
使用 setTimeout 实现 setInterval
实现思路是使用递归函数，不断地去执行 setTimeout 从而达到 setInterval 的效果
123456789101112131415161718function mySetInterval(fn, timeout) { // 控制器，控制定时器是否继续执行 var timer = { flag: true }; // 设置递归函数，模拟定时器执行。 function interval() { if (timer.flag) { fn(); setTimeout(interval, timeout); } } // 启动定时器 setTimeout(interval, timeout); // 返回控制器 return timer;}
实现路由(简易版)
实现路由(简易版)
123456789101112131415161718192021222324// hash路由class Route{ constructor(){ // 路由存储对象 this.routes = {} // 当前hash this.currentHash = '' // 绑定this，避免监听时this指向改变 this.freshRoute = this.freshRoute.bind(this) // 监听 window.addEventListener('load', this.freshRoute, false) window.addEventListener('hashchange', this.freshRoute, false) } // 存储 storeRoute (path, cb) { this.routes[path] = cb || function ( ...
