- 博客(23)
- 收藏
- 关注
RSS订阅原创 路由懒加载
使用vue开发已经有一段时间了，在后来的工作中，做的一些项目越来越大。vue打包后的js文件也越来越大，这会是影响加载时间的重要因素。当构建的项目比较大的时候，懒加载可以分割代码块，提高页面的初始加载效率。这里我汇总了常见的几种vue中路由懒加载的方法。方法一 resolve这一种方法较常见。它主要是使用了resolve的异步机制，用require代替了import,实现按需加载，下面是代码示...
2019-12-21 00:19:59
207
原创 页面导入样式时，使用link和@import有什么区别？
有 4 种方式可以在 HTML 中引入 CSS。1.内联式内联方式指的是直接在 HTML 标签中的 style 属性中添加 CSS。示例：这通常是个很糟糕的书写方式，它只能改变当前标签的样式，如果想要多个拥有相同的样式，你不得不重复地为每个添加相同的样式，如果想要修改一种样式，又不得不修改所有的 style 中的代码。很显然，内联方式引入 CSS 代码会导致 HTML 代码变得冗长，且...
2019-12-16 11:43:36
403
原创 浏览器输入网址回车发生了什么
简洁回答：DNS 解析:将域名解析成 IP 地址TCP 连接：TCP 三次握手发送 HTTP 请求服务器处理请求并返回 HTTP 报文浏览器解析渲染页面断开连接：TCP 四次挥手三次握手：第一次握手： 建立连接时，客户端发送syn包（syn=j）到服务器，并进入SYN_SENT状态，等待服务器确认；第二次握手： 服务器收到syn包，必须确认客户的SYN（ack=j+1），同时...
2019-12-12 10:07:08
168
原创 手写promise封装ajax
其实，axios本身就是基于Promise进行封装的，我们之所以进行二次封装，主要是为了能够对错误信息进行一个集中的处理，根据不同的错误信息，需要给用户不同的提示，以便于给用户一个良好的操作体验。封装方法有很多种，基于class类的，基于构造函数的，也可以直接封装一个函数。具体按照个人习惯，最主要的还是要对后端给我们返回的状态码或者状态值进行判断，如果成功，则直接resolve数据，否则的话，...
2019-12-12 10:02:47
386
原创 vue-router导航守卫（钩子函数）
一、全局导航守卫router.beforeEach 全局前置守卫 当一个当行出发时，前置守卫最先触发一般在这个守卫方法中进行全局拦截，比如必须满足某种条件（用户登录等）才能进入路由的情况router.beforeEach((to, from, next) => { console.log('全局前置守卫：beforeEach -- next需要调用') next(...
2019-12-11 09:17:35
571
原创 解决跨域的方法
什么是跨域？跨域指的是浏览器不能执行其他网站的脚本，它是由浏览器的同源策略造成的，是浏览器对javascript施加的安全限制同源策略： 是指协议、域名、端口都相同，其中有一个不同都会产生跨域ps: 跨域限制访问，其实就是浏览器的限制解决跨域的方法一. JSONP:Jsonp实现原理：< script >标签不收浏览器同源策略的影响，允许跨域引用资源，因此可以通过动态常见s...
2019-12-10 19:15:31
189
原创 数组的方法
数组的方法 包括（es6）arr.push() 从后面添加元素，返回值为添加完后的数组的长度let arr = [1,2,3,4,5]console.log(arr.push(5)) // 6console.log(arr) // [1,2,3,4,5,5]arr.pop() 从后面删除元素，只能是一个，返回值是删除的元素let arr = [1,2,3,4,5]con...
2019-12-10 11:18:22
178
原创 简述 readyonly 与 disabled 的区别
ReadOnly 和 Disabled 的作用是使用户不能够更改表单域中的内容.但是二者还是有着一些区别的：1、Readonly 只针对 input(text/password)和 textarea 有效，而 disabled 对于所有的表单元素有效，包括 select,radio,checkbox,button 等。2、在表单元素使用了 disabled 后，我们将表单以 POST 或者...
2019-12-09 08:26:15
794
原创 JavaScript中callee和caller的作用
callee是函数arguments对象内的指针，它指向当前的函数，使得在函数内部递归调用当前函数时，不需要调用函数名称，减少函数内部对于函数名的依赖function test() {console.log(arguments.callee);}test();caller是函数的一个属性，它指向调用当前函数的函数，如果当前函数在其他函数内被调用，则返回调用它的那个函数，如果是在全局环...
2019-12-09 01:19:34
381
原创 在JavaScript中什么是伪数组？如何将伪数组转化为标准数组
什么是伪数组？定义： obj instanceof Array ===false 但是有length属性伪数组就是一个含有length属性的json对象。它是按照索引的方式存储数据。它并不具有数组的一些方法，只能通过Array.prototype.slice转换为真正的数组，并且带有length属性的对象。常见的伪数组------argumentsNodeList（querySelec...
2019-12-09 00:56:54
292
原创 函数柯里化
首先我们要明白什么是函数柯里化柯里化（Currying）是把接受多个参数的函数变换成接受一个单一参数(最初函数的第一个参数)的函数，并且返回接受余下的参数且返回结果的新函数的技术。（百度百科搜一下就有）。从一个普通函数得到一个柯里化函数的过程叫做函数的柯里化，返回的函数称为经过柯里化的函数。函数柯里化的技术来自于一种编程思想，就是一个复杂的问题可以通过分步的方式来求解，分步可以保证代码逻辑的...
2019-12-09 00:24:49
323
1
原创 cookie、session 和 token有什么区别？
Cookie的内容是保存一小段文本信息，这些文本信息组成一份通行证。它是客户端对于无状态协议的一种解决方案。Cookie的原理（1）客户端第一次请求时，发送数据到服务器。（2）服务器返回响应信息的同时，还会传回一个cookie（cookie S-001）（3）客户端接收服务器的响应之后，浏览器会将cookie存放在一个统一的位置。（4）客户端再次向服务器发送请求的时候，会把Cookie ...
2019-12-09 00:16:42
227
1
原创 前端优化
前端优化这本身是一个综合性的问题。从用户角度而言，优化能够让页面加载得更快、对用户的操作响应得更及时，能够给用户提供更为友好的体验；从服务商角度而言，优化能够减少页面请求数、或者减小请求所占带宽，能够节省可观的资源没有标准答案，如果要非常全面，能写一本书只关注核心点，针对面试主要思想减少http请求减少DOM操作...
2019-12-09 00:00:05
86
原创 IOS和Android常见兼容问题
1.IOS下input默认样式（圆角、阴影）解决方案input { -webkit-appearance: none; border-radius: 0; border: 1px #ccc solid;}2.在IOS下页面滑动卡顿，Andoid没问题结局方案 body {-webkit-overflow-scrolling:touch; overflow-scrollin...
2019-12-08 23:55:16
314
原创 typeof和instanceof相同点与不同点
相同点： JavaScript 中 typeof 和 instanceof 常用来判断一个变量是否为空， 或者是什么类型的。不同点:typeof:1.返回值是一个字符串， 用来说明变量的数据类型。2.typeof 一般只能返回如下几个结果： number, boolean, string, function, object, undefined。 var a = null; ...
2019-12-08 20:51:56
182
原创 Event Loop
在实践的过程中，你是否遇到过以下场景，为什么 setTimeout 会比 Promise 后执行，明明代码写在 Promise 之前。这其实涉及到了 Event Loop 相关的知识，这一篇文章我们会来详细地了解 Event Loop 相关知识，这也是面试经常会问的一个问题。首先我们要知道Event-Loop 是什么 ？主线程从“任务列表”中读取执行事件，这个过程是循环不断地，这个机制被称为j...
2019-12-03 11:07:33
117
原创 线程与进程的区别
什么是进程？ 什么是线程？进程是系统中正在运行的一个程序，程序一旦运行就是进程进程可以看成程序执行的一个实例。进程是系统资源分配的独立实体，每个进程都拥有独立的地址空间。 一个进程无法访问另一个进程的变量和数据结构，如果想让一个进程访问另一个进程的资源，需要使用进程间通信，比如管道，文件，套接字等。一个进程可以拥有多个线程，每个线程使用其所属进程的站空间。进程与进程的一个主要区别是，统一进程...
2019-12-02 09:17:30
231
原创 哪些操作会造成浏览器的内存泄漏
首先我们要了解什么是内存泄漏内存泄漏是指一块被分配的内存既不能使用，又不能回收，直到浏览器进程结束。在C++中，因为是手动管理内存，内存泄漏是经常出现的事情。而现在流行的C#和Java等语言采用了自动垃圾回收方法管理内存，正常使用的情况下几乎不会发生内存泄漏。浏览器中也是采用自动垃圾回收方法管理内存，但由于浏览器垃圾回收方法有bug，因此会产生内存泄漏哪些操作会造成浏览器的内存泄漏意外的全...
2019-12-02 08:28:48
555
原创 call,apply,bind 方法的作用及区别
首先我们要先明白三兄弟的作用apply, call, bind 都是为了改变函数运行时上下文（this指向）而存在的。其次我们在来说说三兄弟的区别相同点：三兄弟接收到的第一个参数都是要绑定的this要指向的对象都可以利用后续参数来进行传参不同点：apply的第二个参数是一个参数输出，call 和 bind 的第二个及之后的参数作为函数实参按顺序传入bind不会立即调用，其他两...
2019-12-02 00:19:38
664
原创 浏览器是如何渲染页面
首先我们先简要概述下浏览器渲染页面的步骤处理HTML标记并构建DOM树处理CSS标记并构建CSSOM树（CSSOM和DOM是独立的数据结构）如果遇到JS,阻塞DOM树及CSSOM树的构建，有限加载JS文件，加载完毕，在继续构建DOM树及CSSOM树将DOM与CSSOM合并成一个渲染树根据渲染树来布局，将各个节点渲染到屏幕上页面渲染完成后，若JS操作了DOM节点。则根据JS对DOM操作...
2019-12-01 23:27:50
143
原创 原生JS的onload与Jquery的$(document).ready()有什么不同
首先 原生js中的window.onload和jQuery中的$(document).ready(function(){}) 都是表示DOM结构绘制完毕，即在window.onload和ready(）函数里都可以获取DOM对象了。 但是他们也都有各自的不同之处一：执行时间不同window.onload必须等待页面内包括图片（url）的所有元素加载完毕后才能执行$(document).read...
2019-11-20 01:03:17
249
原创 函数防抖和函数节流
说到 函数防抖 和 函数节流 ，他们的概念其实是非常相似的标题那么 我们就先来说说什么情况下使用函数防抖和函数节流前端开发过程中，有一些事件或者函数，会被频繁地触发（短时间按内多次触发），最常见的例如，onresize，scroll，mousemove ,mousehover 等，这些事件的触发频率很高，不做限制的话，有可能一秒之内执行几十次、几百次，如果在这些函数内部执行了其他函数，尤其是执...
2019-11-20 00:13:40
105
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人