随笔分类 - 前端基础知识
前端的基础知识
摘要：使用动态import来分割代码 使用动态import来“懒加载”代码，如果你没办法直接减少应用的体积，那么不妨尝试把应用从单个 bundle 拆分成单个 bundle + 多份动态代码的形式。 方法一：使用动态import import("./math").then(math => { consol
阅读全文
摘要：就我个人而言，性能优化分为三大主要部分，构建工具优化，网络请求优化，渲染优化。 当前前端最常使用的工具是webpack，所以我们要做的第一步就是提高他的构建效率 构建工具优化 多进程构建 webpack 是单线程的，就算此刻存在多个任务，你也只能排队一个接一个地等待处理。这是 webpack 的缺点
阅读全文
摘要：DNS解析流程分为递归查询和迭代查询，递归查询是以本地名称服务器为中心查询， 递归查询是默认方式，迭代查询是以DNS客户端，也就是客户机器为中心查询。其实DNS客户端和本地名称服务器是递归，而本地名称服务器和其他名称服务器之间是迭代。 在递归查找中，DNS服务器执行递归并继续查询其他DNS服务器，直
阅读全文
摘要：定义 模块化开发是一种管理方式，是一种生产方式，一种解决问题的方案，一个模块就是实现特定功能的文件，有了模块，我们就可以更方便地使用别人的代码，想要什么功能，就加载什么模块。 规范 AMD(依赖前置) CMD(依赖就近) CommonJS ES6的模块化 AMD规范（异步模块定义） AMD依赖前置，
阅读全文
摘要：首先，三者第一个参数都为this指向 区别 bind返回的是一个函数体 call和apply会直接执行，但是call参数需要一个一个进行传递，apply的第二个参数是一个数组 实现 bind 简单实现 Function.prototype.myBind = function(context){ se
阅读全文
摘要：使用async和await 1 var fn = async function(promiseArr) { 2 for(let i = 0,len = arr.length; i<len; i++) { 3 currentPromise = (promiseArr[i] instanceOf Pro
阅读全文
摘要：核心 构造函数核心 维护状态变量，只能由pending变为resolve或者reject 维护一个存储结果的变量 维护一个回调数组，执行到then，如果我们传入的立即执行函数没有立即执行resolve或者reject，所以promise的状态还是pending，这时要把then里面的回调函数保存起来
阅读全文
摘要：核心 设置最大请求数量，当前请求数量，待执行队列 调用时，创建一个新任务，然后判断是否达到最大请求数量，若达到则将任务追加到待执行队列，否则，则直接执行该任务。并返回Promise 创建任务时，需要返回一个函数，当该任务开始执行则当前数量加一。当任务执行完毕时使用finally，当前数量减一，并从待
阅读全文
摘要：注意点 入参一般是个由Promise实例组成的数组，但是也可以不是数组，但必须具有 Iterator 接口，且返回的每个成员都是 Promise 实例。若参数如果不是 Promise 实例，就会先调用Promise.resolve()方法，将参数转为 Promise 实例，再进一步处理。 返回值是个
阅读全文
摘要：其实数组去重的实现就分为两大类 利用语法自身键不可重复性 利用循环(递归)和数组方法使用不同的api来处理。 注意⚠️：下列封装成方法的要在函数开始增加类型检测，为了让去重的实现代码更加简单易懂，封装时我会省略类型检测 function noRepeat(){ if (!Array.isArray(
阅读全文
摘要：定义 协程（coroutine）是一种程序运行的方式，可以理解成“协作的线程”或“协作的函数”。协程是一组序列化的子过程，然后用户能像指挥家一样调度交叉执行。协程既可以用单线程实现，也可以用多线程实现。前者是一种特殊的子例程，后者是一种特殊的线程。 协程与子例程的差异 传统的“子例程”（subrou
阅读全文
摘要：下面是五种实现斐波那契数列的方法 循环 function fibonacci(n){ var res1 = 1; var res2 = 1; var sum = res2; for(var i = 1;i < n;i ++){ sum = res1 + res2; res1 = res2; res2
阅读全文
摘要：typeof typeof 123; // number typeof 'test'; // string typeof true; // boolean typeof [1,2,3]; // object typeof {name:'wenzi', age:25}; // object typeo
阅读全文
摘要：产生原因 为什么会产生跨域呢，因为浏览器为了安全采用了一系列的安全机制，其中有一个是同源策略。何为同源策略（same-origin policy）。简单来讲同源策略就是浏览器为了保证用户信息的安全，防止恶意的网站窃取数据，禁止不同域之间的JS进行交互。对于浏览器而言只要域名、协议、端口其中一个不同就
阅读全文
摘要：常见数组方法如下 判断是否是数组: isArray() 添加修改数组： push() pop() shift() unshift() slice() splice() sort() reverse() 是否包含某元素： indexOf() includes() 转换： toString() join
阅读全文
摘要：日常中我们可能会遇到将多维数组转换为一维数组的需求，让我们来看看如何实现 toString()方法 let array = [1, [2], [3, [4, [5]]]] function flat(arr) { return arr.toString().split(',').map(val =>
阅读全文
摘要：基本数据类型和引用数据类型 JS数据分为基本数据类型和引用数据类型。基本数据类型的变量存储在栈中，引用数据类型则存储在堆中，引用数据类型的存储地址则保存在栈中。 下面来看一个小例子🌰 // 基本数据类型 let intType = 1; console.log('初始intType:' + int
阅读全文
摘要：定义 队列是一种特殊的线性表，特殊之处在于它只允许在表的前端（front）进行删除操作，而在表的后端（rear）进行插入操作，和栈一样，队列是一种操作受限制的线性表。进行插入操作的端称为队尾，进行删除操作的端称为队头。队列的数据元素又称为队列元素。在队列中插入一个队列元素称为入队，从队列中删除一个队
阅读全文
摘要：事件 HTML中与javascript交互是通过事件驱动来实现的，例如鼠标点击事件、页面的滚动事件onscroll等等，可以向文档或者文档中的元素添加事件侦听器来预订事件。想要知道这些事件是在什么时候进行调用的，就需要了解一下“事件流”的概念。 事件流 事件流描述的就是从页面中接收事件的顺序。而早期
阅读全文
摘要：遍历有如下几种方式 数组方法 map forEach filter find findIndex every some reduce reduceRight 其他方法 for for in for of 数组方法 map 核心 创建一个新数组，其结果是该数组中的每个元素都调用一个提供的函数后返回的结
阅读全文
