阅读笔记
文章平均质量分 67
科粒
这个作者很懒,什么都没留下…
展开
-
可观察对象如何与模态框协作
在具体组件内部,调用可观察对象的next()产生流事件,使PriceAlertModal感知到内容变化。以组件PriceAlertModal为例,观察Modal与可观察对象的结合使用。,这个对象可以被多个具体组件接受以及发送事件,也就是说这个模态框也是一种单例。在钩子中调用可观察对象的.subscribe()来定义"如何响应流事件"希望使用此组件时,在外层创建可观察对象。组件期待接受一个可观察对象。原创 2022-10-21 15:02:27 · 149 阅读 · 0 评论 -
前端学习笔记-React原理笔记
标记与数据结构初次渲染与更新ReactDOM.render触发初次,setState、forceUpdate、Hooks均可触发更新;Fiber双缓存在内存中构建 并直接替换的技术 叫做双缓存(强调它并不会 先清除上一状态 再更新这一个状态,而是直接替换)React使用“双缓存”来完成Fiber树的构建与替换——对应着DOM树的创建与更新。当前屏幕上显示内容对应的称为current Fiber树,在内存中构建的称为workInProgress Fiber树。...原创 2021-09-20 19:48:50 · 111 阅读 · 0 评论 -
前端学习笔记:关于JS几种继承的解读
老笔记了,存在电脑里忘记发组合式继承组合 就是两方面都各做一次,缺点是 所谓"两次执行"父类的构造函数第一次是new实例化 用于创建子类的原型对象 目的是共享方法第二次是单纯执行 用于将父类的属性赋予子类的实例 目的是拥有属性父类构造函数 可想象为 形如this.key = val,let parent = function(name) { // 父类型的自有属性 this.name = name; this.hobbies = ['tennis','mus原创 2021-09-03 17:47:33 · 95 阅读 · 0 评论 -
拼多多二面凉经
怎么就这么巧,我在国际机票实习,他在国内机票干过,于是问了好多ctrip的问题,还想看看我有没有读过内部框架代码,痛苦的几十分钟啊 =。=问题基本都是让我尽可能多说实现方法 但我就是说不出他要的那一个前端动画实现方式setTimeout、setInterval、requestAnimationFrame;CSS Animation、Transition;webGL;// 面试官想让我说出来webGL // 我真不信谁的loading动画是webGL做的前端异常监控重写console.e原创 2021-09-02 18:28:24 · 186 阅读 · 0 评论 -
9月末面试准备
如何实现一个串行Promise(Reduce)function runPrimiseInLine(pList) { pList.reduce( (prevP, currP) => prevP.then(() => currP()), Promise.resolve() );} es6提出的块级作用域是解决什么问题的,结合js调用栈说明;闭包的原理 和js调用栈的关系? 什么是AST?是做什么的? 如何编写loaders 和 plugins..原创 2021-09-01 11:22:07 · 318 阅读 · 0 评论 -
前端学习笔记-内容交付网络 Content delivery networks (CDNs)
文章主体来自 https://web.dev/content-delivery-networks/ 的节选及翻译文章目录资源交付 Resource delivery缓存 Caching向缓存添加资源从缓存删除资源cache evictionPurging性能特点 Performance features图像优化Minification数据压缩HTTP/2 和 HTTP/3TLS 1.3结论CDN通过使用分布式服务器网络向用户交付资源来提高站点性能。因为 CDN 减少了服务器负载,所以它们降低了服务.原创 2021-08-10 10:23:35 · 549 阅读 · 0 评论 -
前端学习笔记-性能相关知识
建议直接阅读谷歌原文:https://developers.google.cn/web/fundamentals/performance/rendering/?hl=zh-cnhttps://web.dev/rail/本站博客:https://blog.csdn.net/qweKelliy/article/details/107395628https://blog.csdn.net/csdnnews/article/details/95267307R响应:立即响应用户;在 100 毫秒以.原创 2021-08-09 18:39:12 · 242 阅读 · 0 评论 -
代码片段-Promise异步请求超时重连
本文不是Promise超时重试,而是XHR异步请求与Promise结合后的自动重连如何发现请求超时?依靠XHR自身就有的超时属性和事件var xhr = new XMLHttpRequest();xhr.open('GET', '/server', true);// 1. timeout属性:超时时间,单位是毫秒xhr.timeout = 2000; xhr.onload = function () { /* onload事件请求完成 */ };// 2. ontimeout事件回调原创 2021-08-04 10:09:55 · 491 阅读 · 0 评论 -
代码片段-Promise如何限制并发数
在真实场景中,我们可能要发起好多个网络请求: request.get(url1, data1).then(cb); request.post(url2, data2).then(cb); request.get... request.post...但是目前 需要有一个东西把它的数量限制住 又要允许它执行原本的任务,因此最终使用方法应该类似于: const LP = new LimitPromise(max = 10); LP.add(request.get原创 2021-07-31 22:31:50 · 181 阅读 · 0 评论 -
前端学习笔记-AJAX
首字母略缩词AJAX,全名Asynchronous Javascript And XML卖点当然是第一个词:Asynchronous,即异步;而最后一个词是XML,当然要谈到XMLHttpRequest这个对象,是发起AJAX的核心;文章目录流程5点xhr.readyState,表达的是request的状态:xhr.status,表达的是response的状态封装MDN:通过交互式网站和现代 Web 标准,AJAX正在逐渐被 JavaScript 框架中的函数和官方的 Fetch API 标准取代原创 2021-07-27 14:28:07 · 209 阅读 · 1 评论 -
前端学习笔记-Webpack学习笔记-1
没整理好/s/1pGqWNIbwTIqmmyOz_PB6mg 提取码: brcu工作流程读取由开发者定义的 webpack.config.js 配置文件 或者从 shell 语句中获得必要的参数;实例化所需plugins,webpack 事件流上挂载插件Hook;在构建过程中 插件具备改动产出结果的能力 ,事件流即使用了发布订阅模式。同时根据配置所定义的入口,以入口文件(可以不止有一个)为起始 进行依赖收集 :对所依赖的文件进行编译。不同类型文件根据开发者定义的不同 loader 进原创 2021-07-27 13:21:47 · 155 阅读 · 0 评论 -
前端学习笔记-RxJS与Redux-Observable (一)
文章目录RxJS可观察对象Observable观察者Observers多播的Subjects操作符OperatorsRedux-ObservableEpic承接前文提到的异步Action话题,中间件redux-thunk易于编写和理解,但它也存在实践上的不足:你最终可能会回调地狱,特别是在发出API请求时,需要使用业务逻辑填充回调函数 或reducer函数去整理数据(数据格式不总是完美的,特别是使用第三方API时)不利于测试(必须使用Spy方法来检查是否使用正确的对象进行dispatch)然后原创 2021-07-21 16:59:30 · 1329 阅读 · 2 评论 -
前端学习笔记-Redux与异步Action
文章目录Redux三原则Redux源文件Redux中间件异步 Action发送请求获取数据场景:Flux单向数据流Flux与Redux差别再次辨析HooksRedux三原则单一数据源一个App只能有一个存储state的store;State 只读唯一改变state的方式就是dispatch一个action;纯函数修改执行修改action的是叫做reducer的纯函数;Redux源文件真正有用的看起来也就5个applyMiddleware.js // 中间件bindActionCr原创 2021-07-20 16:36:16 · 325 阅读 · 0 评论 -
前端学习笔记-React Hooks-解释辨析
区分命名类似的apiuseMemo() (hook):缓存计算的结果;也可模拟useCallback;React.memo(FC, checkPropsEqualFn):为函数式组件添加浅比较缓存功能,对标继承了PureComponent的类组件;以上两者均提供缓存功能以减少不必要的重渲染,提升性能;useRef() (hook):在多次渲染之间共享数据;也可以存储组件实例引用;React.createRef():获得组件实例的引用;使用 useRef 保存的数据一般是和 UI 的渲染无原创 2021-07-19 18:54:09 · 208 阅读 · 0 评论 -
前端学习笔记-React Hooks-自定义Hooks
自定义HooksHooks 两个核心优点:方便逻辑复用;帮助关注分离。理论形式上,要求名字以use开头的函数;语义上,内部使用了其他的hooks;实操上,当作普通函数,该传参传参,该返回返回;把现有的逻辑提取出来,以方便使逻辑可被重用,一方面也能让代码语义化 易于理解维护。实例1发起异步请求 获取数据并显示在界面上。关注点有3:请求正确返回时,UI 会如何展现数据;Loading 状态 UI 与交互的差异;处理请求出错时,UI 会如何展现错误;流程梳理4:创建 data,loa原创 2021-07-19 14:41:40 · 361 阅读 · 0 评论 -
前端相关缓存知识结构
补充:1.对于对比缓存,使用 Ctrl+F5强制刷新就可以使得缓存失效。但是强制缓存,在未过期时,必须更新资源路径才能发起新的请求(常用技巧)2.浏览器本地缓存 5 种,localStorage, sessionStorage, cookie, indexedDB, WebSQL。前两种H5 WebStorage差别仅在session和作用域。...原创 2021-07-05 14:51:31 · 51 阅读 · 0 评论 -
DS&A in Python小记
首先这本书中文翻译一如既往地被人诟病,不过我也没能力去阅读英文原版,就硬着头皮去理解吧。与国内教材不同的是,虽然名字是《数据结构与算法》,但本书前70页涵盖了36页python语法+34页的面向对象编程,这些内容作为基础还是不要太着急,重视一下下python入门部分 对于我个人而言的新鲜内容:标识符(变量名)引用的对象(变量值)有人来有人走有人去有人留,其中有一些对象属于不可变的python内置类(比如bool int float tuple str)那么给a=1;a=2其实是换掉了容器a...原创 2020-07-12 00:51:15 · 119 阅读 · 0 评论