总结
文章平均质量分 58
BYE&
这个作者很懒,什么都没留下…
展开
-
到底是什么this?(上下文)
到底什么是this?假设我们有一个对象小明,我们要求他三科成绩的总和。var xiaomin={ shuxue : 50, yuwen : 89, yingyu : 20}function sum(o){ return o.shuxue+o.yuwen+o.yingyu}var a = sum(xiaomin);console.log(a); //159东西很简单,但是有一个问题,这里的函数和对象是一个什么关系。不用很复杂。这里的对象是作为参数传入函数的,那么问题来了。那么有原创 2020-10-09 19:55:27 · 530 阅读 · 0 评论 -
CSS复习总结
CSS盒模型就是用来装页面上的元素的矩形区域。CSS中的盒子模型包括IE盒子模型和标准的W3C盒子模型。box-sizing(有3个值):border-box,padding-box,content-box。从图中我们可以看出,这两种盒子模型最主要的区别就是width的包含范围,在标准的盒子模型中,width指content部分的宽度,在IE盒子模型,width表示content+padding+border这三个部分的宽度,故这使得在计算整个盒子的 宽度时存在着差异:标准盒子模型的盒子宽度:bor原创 2020-10-08 17:36:38 · 213 阅读 · 0 评论 -
React的调和过程(Reconcilliation)
Reconciliation 是实现UI更新的一个过程。目的就是在用户无感知的情况下降数据的更新体现到UI上。触发调和的方式ReactDom.render() 函数 和 ReactNativeRender.render()函数setState()函数forceUpdate()函数的调用comopnentWillMount 和 componentWillReceiveProp 中直接修改了state(地址)hooks中的useReducer 和 useState 返回的钩子函数virtual转载 2020-10-05 19:22:33 · 995 阅读 · 0 评论 -
react的理解
react的简单在于,它的核心API其实非常少。所以我们会看到很多地方在说react其实是一个UI库,并不是一个完整的框架,他告诉我们如何创建组件以及如何进行数据传递。甚至于创建组件的方式正是使用ES6的class语法因此在开发中react的使用对于ES6的语法依赖非常高。因此react自身本来就没有多少强限制的语法。我们只需要掌握组件里的props,state,ref,生命周期,就好像没有过多的额外知识,如果想要在jsx模板来遍历渲染,还得使用原生的map方法。而react的告诫组件,理解之后发现,其实原创 2020-10-04 23:03:28 · 526 阅读 · 0 评论 -
React Component 和 Element
React 和React Element到底是什么?React 是一个构建视图层的类库。不管React本身如何复杂,不管其他生态多么庞大,构建视图始终是他的核心。React Element简单的说,React Element 描述了“你想”在屏幕上看到的事物。抽象的说,React Element 元素是一个描述了Dom Node的对象。因为 React Element并不是你在屏幕上看见的真实事物。相反的它是一个描述真实事物的集合。Javascript 对象很轻量。用对象来作为 React E转载 2020-10-04 21:00:46 · 1095 阅读 · 0 评论 -
HTML/浏览器(三)
200 和 304 的区别200 ok 代表请求成功,一般用 GET 和 POST 请求304 代表资源未修改,一般在协商缓存中使用。这个不会返回任何资源。客户端通常会缓存访问过的资源,通过提供一个头信息支出客户端希望只返回在指定日期之后修改的资源。post和get区别GET - 从指定的资源请求数据。POST - 向指定的资源提交要被处理的数据两个都是 基于TCP数据包。对于GET方式的请求,浏览器会吧http header和data一并发送出去,服务器响应200(返回数据);而对于PO原创 2020-09-28 19:11:15 · 114 阅读 · 0 评论 -
setState简易理解
setState,这个问题来源于一个疑惑,在使用redux的时候dispath一个action,为什么可以导致视图的更新?猜想是store改变后,redux在某处调用了setState,通知了react原创 2020-09-28 18:20:41 · 702 阅读 · 0 评论 -
入门React的内部机制(render->JSX->createElement->virtualDom))
JSX的原理我们常常吧这个叫做 “转译”,其实用“汇编”来描述更为正确。React官方推荐使用一种混合HTML和javascript的语法,即JSX来编写自己的组件。但浏览器对JSX及其语法并不理解。浏览器只理解Javascript ,所以JSX必须转化为javascript。下面是JSX的代码,一个与class和一些内容的div<div className="cn"> Content!</div>//转化为javascript只需要调用以下函数React.creat转载 2020-09-27 18:46:16 · 192 阅读 · 0 评论 -
react 对 diffing 算法应用的准备
React 提供的声明式 API 让开发者可以在对 React 的底层实现没有具体了解的情况下编写应用.在开发者编写应用时虽然保持相对简单的心智,但开发者无法了解内部的实现机制.本文描述了在实现 React 的 “diffing” 算法中我们做出的设计决策以保证组件满足更新具有课预测性,以及在复杂业务下依然保持应用的高性能性.设计动力在某一时间节点调用 React 的 render() 方法,...原创 2020-09-27 18:43:10 · 105 阅读 · 0 评论 -
前端复习二(http和缓存)
(1)常用http请求头平时在后端中常用的请求头此为node,其他语言请自行设置字段 res.header("Access-Control-Allow-Origin", "*"); //常用的解决同源策略的解决方法 res.header("Access-Control-Allow-Headers", "X-Requested-With,Authorization");//用于与检测请求 res.header("Access-Control-Allow-Methods","PUT,POST,G原创 2020-09-24 21:04:01 · 97 阅读 · 0 评论 -
浏览器中输入url,到页面呈现出来,到底发生了什么
输入url然后DNS解析首先需要找到这个url域名的服务器ip,即dns解析。是浏览器首先会寻找缓存,查看缓存中是否有记录,缓存的查找记录的顺序是浏览器缓存->系统缓存->路由器缓存,缓存中没有就查找系统的hosts文件中是否有记录,如果没有就查找DNS服务器,得到服务器ip地址后。建立TCP连接tcp的三次握手很详细https://blog.csdn.net/qq_44786519/article/details/108709553浏览器根据这个ip以及相应的端口号,构造http请求原创 2020-09-24 21:02:04 · 192 阅读 · 0 评论 -
前端性能优化
基本问题http层面的优化DNS预解析:DNS实现域名到IP的映射。通过域名访问站点,每次请求都要做DNS解析。每次DNS解析在200ms以下,一般采用DNS Prefetch的一种DNS预解析技术,当浏览网页时,会在加载网页的过程中对域名进行解析缓存,这样在单击当前页面中的i链接时就无需进行DNS解析,减少用户等待时间,提高用户体验 <LInk rel="dns-prefetch" href="www.baidu.com" /> //只有部分浏览器支持TCP连接采用ht转载 2020-09-22 20:22:07 · 108 阅读 · 0 评论 -
HTTP强缓存和协商缓存
强缓存和协商缓存都是属于浏览器缓存浏览器缓存浏览器缓存是浏览器在本地磁盘对用户最近请求过的文档进行存储,当访问者再次访问同一页面时,浏览器就可以直接从本地磁盘加载文档。浏览器缓存的有什么优点:1.减少冗余的数据传递2.减少服务器负担3.加快客户端加载页面的速度Web性能优化的重要方式,浏览器缓存的过程究竟是怎么样?浏览器第一次发起请求时,本地无缓存,向web服务器发送请求,服务端响应的请求,浏览器端缓存。过程浏览器第一次请求发生后,再次发送请求时:浏览器请求某一资源时,会先获取该资源转载 2020-09-21 12:56:09 · 117 阅读 · 0 评论 -
前端系统复习(一)(HTTP/HTML/浏览器)
一、http和https都是运行在传输层http(超文本传输协议),是客户端和服务端请求和应答的标准(TCP),用于从web服务器传输超文本到本地浏览器的传输协议,使浏览器更加高效,让网络传输减少。https:以安全为目标的HTTP通道,再http下加入SSL层,主要作用就是建立信息安全通道确保数据的传输。区别:1.http传输的是明文,https传输的是ssl协议加密传输和身份认证的网络协议。2.https协议需要ca协议,费用较高。3.连接方式不同http:80端口,https:443端口原创 2020-09-19 18:47:07 · 348 阅读 · 0 评论 -
WEB安全(客户端XSS和会话注入)(前端面试)
WEB基本攻击大致可以分为三大类—— “资源枚举”、“参数操纵” 和 “其它攻击”。资源枚举日常开发中都会用约定俗称的去做某件事,文件命名就是这样,比如用骆驼命名来命名函数名,目的是为了团队开发工作更加规范.但是成为习惯的文件命名方式,也更容易让其他人更方便的找他想找的文件参数操纵对于客户端的攻击就是XXS和会话劫持XSS(跨域脚本攻击)也是最常见的web攻击重点就是客户端执行.举个例子,在搜索框搜索东西的时候在搜索框搜索内容,填入,点击搜索.如果前端页面没有对返回的数据进行过滤,直接显示转载 2020-09-15 20:10:47 · 265 阅读 · 0 评论 -
Web Worker和异步的对比(浏览器线程,任务队列)
1.浏览器的主要线程UI线程(用于渲染页面)javascript引擎线程(用于处理js)GUI事件触发线程(用于交互)还有HTTP传输线程和定时触发线程(定时器)(1)UI线程和javascript引擎线程互斥因为 javascript 可以操作页面的DOM,所以两个线程不互斥的话,ui线程在页面渲染的同时,js进行DOM修改,最终会造成DOM不一致的现象,所以js引擎运行的时候,ui渲染处于冻结状态。(2)js引擎和GUI事件触发线程(用于交互)异步浏览器开启事件触发线程,等待用户动作,事原创 2020-09-15 17:04:49 · 878 阅读 · 0 评论 -
前端文件流的一些简单处理(前端下载文件的方式)(接口正常,图片显示不出来?)
图片上的显示问题比较少,大部分都是直接antd组件,人家处理好了,所以不用担心.主要是下载文件怎么处理先说图片的显示问题吧.文件流都是二进制.相信大多数人和我一样笨笨的,旧直接 ajax 或者 axios 请求了.但是发现请求一切正常,但是就是没有文件被下载下来.文件传输都是二进制,原始的xmlhttprequest 1版本,ajax不支持文件流,jquery也一样.所以默认处理二进制就直接文本乱码显示了,也不会当作附件下载下来.当然xmlhttprequest 2 标准中支持文件流.并且用xhr.原创 2020-09-14 21:50:42 · 1562 阅读 · 0 评论