09 2022 档案
摘要：前端性能优化分为两类， 一类是文件加载更快， 另一类是文件渲染更快。 一、加载更快的方法： 1.让传输的数据包更小 1）（压缩文件/图片）： 图片压缩和文件压缩 2）减少网络请求的次数： 雪碧图/精灵图、节流防抖 3）减少渲染的次数： 缓存（HTTP缓存、本地缓存、Vue的keep-alive缓存等
阅读全文
摘要：区别： vue是双向绑定的，采用template； react是单向的，采用jsx。 Vue的优缺点： 简单、快速、强大、对模块友好，但不支持IE8。 React的优缺点： 速度快、跨浏览器兼容、模块化； 但学习曲线陡峭，需要深入的知识来构建应用程序。 react和vue的区别 监听数据变化的实现原
阅读全文
摘要：块级作用域 => 关键字let，常量const 对象字面量的属性赋值简写 let name = 'test'; let person = {name;} console.log(person);// {name:'test'} 赋值解构 let [a,b,c] = [1,2,3]; let [foo
阅读全文
摘要：区别 伪数组的类型不是Array，而是Object，而数组类型是Array。 伪数组可以使用的length属性查看长度，也可以使用[index]获取某个元素，但是不能使用数组的其他方法，也不能改变长度，遍历使用for in方法。 伪数组的常见场景： 函数的参数arguments 原生js获取DOM：
阅读全文
摘要：CSS盒模型定义了盒的每个部分包含 margin, border, padding, content 。 根据盒子大小的计算方式不同盒模型分成了两种， 标准盒模型和怪异盒模型。 标准模型， 给盒设置 `width` 和 `height`，实际设置的是 content box。`padding` 和
阅读全文
摘要：组件的生命周期可分成三个状态： Mounting(挂载)：已插入真实 DOM Updating(更新)：正在被重新渲染 Unmounting(卸载)：已移出真实 DOM 挂载 当组件实例被创建并插入 DOM 中时，其生命周期调用顺序如下： constructor(): 在 React 组件挂载之前，
阅读全文
摘要：输入地址，浏览器查找域名的 IP 地址。 浏览器向 该 IP 地址的web 服务器发送一个 HTTP 请求， 在发送请求之前浏览器和服务器建立TCP的三次握手，判断是否是HTTP缓存， 如果是强制缓存且在有效期内，不再向服务器发请求， 如果是HTTP协商缓存向后端发送请求且和后端服务器对比，在有效期
阅读全文
摘要：能。 token一般是用来判断用户是否登录的， 它内部包含的信息有： uid(用户唯一的身份标识)、 time(当前时间的时间戳)、 sign（签名，token 的前几位以哈希算法压缩成的一定长度的十六进制字符串） `token`可以存放在`Cookie`中，`token` 是否过期，应该由后端来判
阅读全文
摘要：new关键字会进行如下的操作： 1. 创建一个空的简单JavaScript对象（即`{}`）； 2. 为步骤1新创建的对象添加属性`__proto__`，将该属性链接至构造函数的原型对象 ； 3. 将步骤1新创建的对象作为`this`的上下文 ； 4. 如果该函数没有返回对象，则返回`this`。
阅读全文
摘要：浏览器拿到HTML， 先将HTML转换成dom树， 再将CSS样式转换成stylesheet， 根据dom树和stylesheet创建布局树， 对布局树进行分层， 为每个图层生成绘制列表， 再将图层分成图块， 紧接着光栅化将图块转换成位图， 最后合成绘制生成页面。 分层的目的： 避免整个页面渲染，把
阅读全文
摘要：浏览器会立即加载JS文件并执行指定的脚本，“立即”指的是在渲染该 script 标签之下的文档元素之前，也就是说不等待后续载入的文档元素，读到就加载并执行 加上async属性，加载JS文档和渲染文档可以同时进行（异步），当JS加载完成，JS代码立即执行，会阻塞HTML渲染。 加上defer，加载后续
阅读全文
摘要：XSS是跨站脚本攻击(Cross Site Scripting)，不写为CSS是为了避免和层叠样式表（Cascading Style Sheets）的缩写混淆，所以将跨站脚本攻击写为XSS。 攻击者可以通过向Web页面里面插入script代码，当用户浏览这个页面时，就会运行被插入的script代码，
阅读全文
摘要：CSRF跨站点请求伪造（Cross Site Request Forgery）和XSS攻击一样，有巨大的危害性，就是攻击者盗用了用户的身份，以用户的身份发送恶意请求，但是对服务器来说这个请求是合理的，这样就完成了攻击者的目标。 CSRF攻击的过程原理是： 用户打开浏览器，访问目标网站A，输入用户名和
阅读全文
摘要：浏览器垃圾回收机制根据数据的存储方式分为栈垃圾回收和堆垃圾回收。 栈垃圾回收的方式非常简便，当一个函数执行结束之后，JavaScript 引擎会通过向下移动 ESP 来销毁该函数保存在栈中的执行上下文，遵循先进后出的原则。 堆垃圾回收，当函数直接结束，栈空间处理完成了，但是堆空间的数据虽然没有被引用
阅读全文
摘要：px：pixel像素的缩写，绝对长度单位，它的大小取决于屏幕的分辨率，是开发网页中常常使用的单位。 em：相对长度单位，在 `font-size` 中使用是相对于父元素的字体大小，在其他属性中使用是相对于自身的字体大小，如 width。如当前元素的字体尺寸未设置，由于字体大小可继承的原因，可逐级向上
阅读全文
摘要：箭头函数相当于匿名函数，简化了函数定义。 箭头函数有两种写法，当函数体是单条语句的时候可以省略{}和return。 另一种是包含多条语句，不可以省略{}和return。 特点 箭头函数最大的特点就是没有this，所以this是从外部获取，就是继承外部的执行上下文中的this，由于没有this关键字所
阅读全文
摘要：undefind 是全局对象的一个属性，当一个变量没有被赋值或者一个函数没有返回值或者某个对象不存在某个属性却去访问或者函数定义了形参但没有传递实参，这时候都是undefined。 undefined通过typeof判断类型是'undefined'。undefined == undefined un
阅读全文
摘要：所有异步任务都是在同步任务执行结束之后，从任务队列中依次取出执行。 回调函数是异步操作最基本的方法，比如AJAX回调，回调函数的优点是简单、容易理解和实现，缺点是不利于代码的阅读和维护，各个部分之间高度耦合，使得程序结构混乱、流程难以追踪（尤其是多个回调函数嵌套的情况），而且每个任务只能指定一个回调
阅读全文
摘要：CSS样式的优先级应该分成四大类 第一类`!important`，无论引入方式是什么，选择器是什么，它的优先级都是最高的。 第二类引入方式，行内样式的优先级要高于嵌入和外链，嵌入和外链如果使用的选择器相同就看他们在页面中插入的顺序，在后面插入的会覆盖前面的。 第三类选择器，选择器优先级：id选择器>
阅读全文
摘要：JavaScript有4种方法判断变量的类型，分别是typeof、instanceof、Object.prototype.toString.call()（对象原型链判断方法）、 constructor (用于引用数据类型) typeof：常用于判断基本数据类型，对于引用数据类型除了function返
阅读全文
摘要：Promise的作用： Promise是异步微任务，解决了异步多层嵌套回调的问题，让代码的可读性更高，更容易维护。 Promise如何使用： Promise是ES6提供的一个构造函数，可以使用Promise构造函数new一个实例，Promise构造函数接收一个函数作为参数，这个函数有两个参数，分别是
阅读全文
摘要：闭包 一个函数和词法环境的引用捆绑在一起，这样的组合就是闭包（closure）。 一般就是一个函数A，return其内部的函数B，被return出去的B函数能够在外部访问A函数内部的变量，这时候就形成了一个B函数的变量背包，A函数执行结束后这个变量背包也不会被销毁，并且这个变量背包在A函数外部只能通
阅读全文
摘要：JS数据类型分为两类： 一类是基本数据类型，也叫简单数据类型，包含7种类型，分别是Number 、String、Boolean、BigInt、Symbol、Null、Undefined。 另一类是引用数据类型也叫复杂数据类型，通常用Object代表，普通对象，数组，正则，日期，Math数学函数都属于
阅读全文
摘要：什么是webpack? 本质上,webpack 是一个现代 JavaScript 应用程序的静态模块打包器(module bundler)。当 webpack 处理应用程序时,它会递归地构建一个依赖关系图(dependency graph),其中包含应用程序需要的每个模块,然后将所有这些模块打包成一
阅读全文
摘要：1.sessionStorage:临时的会话存储 只要当前的会话窗口未关闭，存储的信息就不会丢失，即便刷新了页面，或者在编辑器中更改了代码，存储的会话信息也不会丢失。 2.localStorage:永久存储 会一直将数据存储在客户端的储存方式，即使关闭了浏览器，下次打开的时候仍然可以看到之前存储的未
阅读全文
摘要：一：HTTP 与 HTTPS 有哪些区别？（1）HTTP 是超文本传输协议，信息是明文传输，存在安全风险的问题。HTTPS 则解决 HTTP 不安全的缺陷，在 TCP 和 HTTP 网络层之间加入了 SSL/TLS 安全协议，使得报文能够加密传输。（2）HTTP 连接建立相对简单， TCP 三次握手
阅读全文
摘要：1.TCP的三次握手（Three-Way Handshake）的详解 所谓的三次握手即TCP连接的建立。这个连接必须是一方主动打开，另一方被动打开的。以下为客户端主动发起连接的图解： 握手之前主动打开连接的客户端结束CLOSED阶段，被动打开的服务器端也结束CLOSED阶段，并进入LISTEN阶段。
阅读全文
摘要：从输入URL到渲染出整个页面的过程包括三个部分： 1、DNS解析URL的过程 2、浏览器发送请求与服务器交互的过程 3、浏览器对接收到的html页面渲染的过程 一、DNS解析URL的过程 DNS解析的过程就是寻找哪个服务器上有请求的资源。因为ip地址不容易记忆，一般会使用URL域名（如www.bai
阅读全文
