- 博客(37)
- 收藏
- 关注
原创 可观察对象如何与模态框协作
在具体组件内部,调用可观察对象的next()产生流事件,使PriceAlertModal感知到内容变化。以组件PriceAlertModal为例,观察Modal与可观察对象的结合使用。,这个对象可以被多个具体组件接受以及发送事件,也就是说这个模态框也是一种单例。在钩子中调用可观察对象的.subscribe()来定义"如何响应流事件"希望使用此组件时,在外层创建可观察对象。组件期待接受一个可观察对象。
2022-10-21 15:02:27 170
原创 前端学习笔记-React原理笔记
标记与数据结构初次渲染与更新ReactDOM.render触发初次,setState、forceUpdate、Hooks均可触发更新;Fiber双缓存在内存中构建 并直接替换的技术 叫做双缓存(强调它并不会 先清除上一状态 再更新这一个状态,而是直接替换)React使用“双缓存”来完成Fiber树的构建与替换——对应着DOM树的创建与更新。当前屏幕上显示内容对应的称为current Fiber树,在内存中构建的称为workInProgress Fiber树。...
2021-09-20 19:48:50 132
原创 代码片段-LC简单中等题
1846. Maximum Element After Decreasing and Rearranging关注的是"数组元素的取值" 若存在断层 则要全部下沉 届时顶端元素即为所求最大元素;因为要求相邻元素不差过1,因此调整后取值最大不超过n,如果全部下沉压缩 空取值元素 以及重复的那些取值元素 会使顶端元素远小于n,那么我们要使重复取值元素 分散到空取值处 填补断层,使下沉尽量少发生 顶端元素接近于n;// https://leetcode-cn.com/problems/maximum-el
2021-09-15 14:50:04 219
原创 前端学习笔记:关于JS几种继承的解读
老笔记了,存在电脑里忘记发组合式继承组合 就是两方面都各做一次,缺点是 所谓"两次执行"父类的构造函数第一次是new实例化 用于创建子类的原型对象 目的是共享方法第二次是单纯执行 用于将父类的属性赋予子类的实例 目的是拥有属性父类构造函数 可想象为 形如this.key = val,let parent = function(name) { // 父类型的自有属性 this.name = name; this.hobbies = ['tennis','mus
2021-09-03 17:47:33 118
原创 拼多多二面凉经
怎么就这么巧,我在国际机票实习,他在国内机票干过,于是问了好多ctrip的问题,还想看看我有没有读过内部框架代码,痛苦的几十分钟啊 =。=问题基本都是让我尽可能多说实现方法 但我就是说不出他要的那一个前端动画实现方式setTimeout、setInterval、requestAnimationFrame;CSS Animation、Transition;webGL;// 面试官想让我说出来webGL // 我真不信谁的loading动画是webGL做的前端异常监控重写console.e
2021-09-02 18:28:24 214
原创 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 350
原创 前端学习笔记-内容交付网络 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 605
原创 前端学习笔记-性能相关知识
建议直接阅读谷歌原文: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 259
原创 代码片段-LC简单题:大整数字符串加法等
415. 字符串相加维护临时工作变量carry负责收集每一位的和,carry的个位添入res,十位参与下一个位置的加法;下标索引i, j各自从两个字符串尾部向前遍历取出字符,记得各自判断是否到头了// https://leetcode-cn.com/problems/add-strings/const addStrings = function (num1, num2) { let [res, carry, i, j] = [[], 0, num1.length - 1, num2.leng
2021-08-05 10:55:30 201
原创 代码片段-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 520
原创 代码片段-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 206
原创 前端学习笔记-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 231 1
原创 前端学习笔记-Webpack学习笔记-1
没整理好/s/1pGqWNIbwTIqmmyOz_PB6mg 提取码: brcu工作流程读取由开发者定义的 webpack.config.js 配置文件 或者从 shell 语句中获得必要的参数;实例化所需plugins,webpack 事件流上挂载插件Hook;在构建过程中 插件具备改动产出结果的能力 ,事件流即使用了发布订阅模式。同时根据配置所定义的入口,以入口文件(可以不止有一个)为起始 进行依赖收集 :对所依赖的文件进行编译。不同类型文件根据开发者定义的不同 loader 进
2021-07-27 13:21:47 171
原创 前端学习笔记-RxJS与Redux-Observable (一)
文章目录RxJS可观察对象Observable观察者Observers多播的Subjects操作符OperatorsRedux-ObservableEpic承接前文提到的异步Action话题,中间件redux-thunk易于编写和理解,但它也存在实践上的不足:你最终可能会回调地狱,特别是在发出API请求时,需要使用业务逻辑填充回调函数 或reducer函数去整理数据(数据格式不总是完美的,特别是使用第三方API时)不利于测试(必须使用Spy方法来检查是否使用正确的对象进行dispatch)然后
2021-07-21 16:59:30 1365 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 344
原创 前端学习笔记-React Hooks-解释辨析
区分命名类似的apiuseMemo() (hook):缓存计算的结果;也可模拟useCallback;React.memo(FC, checkPropsEqualFn):为函数式组件添加浅比较缓存功能,对标继承了PureComponent的类组件;以上两者均提供缓存功能以减少不必要的重渲染,提升性能;useRef() (hook):在多次渲染之间共享数据;也可以存储组件实例引用;React.createRef():获得组件实例的引用;使用 useRef 保存的数据一般是和 UI 的渲染无
2021-07-19 18:54:09 227
原创 前端学习笔记-React Hooks-自定义Hooks
自定义HooksHooks 两个核心优点:方便逻辑复用;帮助关注分离。理论形式上,要求名字以use开头的函数;语义上,内部使用了其他的hooks;实操上,当作普通函数,该传参传参,该返回返回;把现有的逻辑提取出来,以方便使逻辑可被重用,一方面也能让代码语义化 易于理解维护。实例1发起异步请求 获取数据并显示在界面上。关注点有3:请求正确返回时,UI 会如何展现数据;Loading 状态 UI 与交互的差异;处理请求出错时,UI 会如何展现错误;流程梳理4:创建 data,loa
2021-07-19 14:41:40 383
原创 前端实习小记2
1.大前提D为真时,T才可能为真 A为真时,T为真;A为假时,T 但B与A同时为真时,T为假 不管AB,C条件为真时,T为真T = D && (!(A && B) || C )T = D && ((A && !B) || C ) 应该是这个才对2.const T = (A && B) || C ? D : E;条件判断超过两层或者比较复杂的话就不要用三目运算了,不好维护const...
2021-07-06 10:59:41 92
原创 前端相关缓存知识结构
补充:1.对于对比缓存,使用 Ctrl+F5强制刷新就可以使得缓存失效。但是强制缓存,在未过期时,必须更新资源路径才能发起新的请求(常用技巧)2.浏览器本地缓存 5 种,localStorage, sessionStorage, cookie, indexedDB, WebSQL。前两种H5 WebStorage差别仅在session和作用域。...
2021-07-05 14:51:31 66
原创 前端实习小记1
单元测试时为模拟用户看到视觉内容出现,会尽量使用className去检查元素,而不是data-testid;编写组件时如需参考其他元素的信息,会尽量使用Ref获取某个组件或元素的React语境下的引用,而不是依赖于DOM选择器(如className)获取DOM语境下的引用;(如果get其他地方的Element 此组件的单元测试过程也取不到因此会测不过)...
2021-06-29 13:21:30 119
原创 [JS] 区分Boolean()与 == 类型转换
区分Boolean()与 == 类型转换在if(condition){...}时,condition的值来自于Boolean(condition)的计算,Boolean()它只会在以下6种情况为false:NaN, 0, '' , undefined, null, false,其余情况再离谱也是true!这段儿内容可以独立存在,不被归为隐式类型转换之列。在使用A == B进行比较时,由于要同时考虑操作数AB双方的类型,又要最终返回布尔值类型,因此会发生隐式类型转换:==操作的目的 往往是判
2021-02-17 07:32:09 268 1
原创 关于babel的几点注意
1. Typo错误:拼写babel检查一下是否打成了bable或者bebel什么的;2. 弱智错误:创建config.js或.babelrc等配置文件检查一下是否放在了项目外层的目录;3. 大胆删除node_modules目录也没事,依赖包信息早在安装时已存在了package.js中,直接npm i一下就装回来了;4. 借此↑特性,可以删除modules文件夹,然后修改(dev)dependencies中的版本或包名,再npm i以达到版本替换、批量修改的目的。5. 在webpack.config
2020-08-20 01:04:07 170
原创 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 134
原创 conda更新被中断,conda命令丢失,一切anaconda相关程序无法启动
故事背景就不多说了,状况就是conda更新的过程被打断了 在Anaconda3\Scripts文件夹下的文件缺失,这样conda命令也失效了、jupyter notebook也无法启动。可是我已经建立好的虚拟环境和装过那么多的包还是不想丢弃,于是设法不重新安装Anaconda;既然我已经把问题定位在Script文件夹,那么安装另一套Anaconda把它的Script复制过来覆盖可以吗?...
2020-04-01 02:22:42 3828 5
原创 cuda安装报错toolkit installation failed using unsupported compiler
Error: unsupported compiler: 7.5.0. Use --override to override this check.============ Summary ============Toolkit: Installation Failed. Using unsupported Compiler.其实已经给出了提示,在使用sudo sh cuda...
2020-02-22 00:07:19 3643
原创 conda报错NotWritableError: The current user does not have write permissions
刚刚安装完Anaconda准备conda create创建环境的时候,遇到了下面的错误NotWritableError: The current user does not have write permissions to a required path. path: /home/NAME/.conda/envs/.conda_envs_dir_test uid: 1000 g...
2020-02-20 23:23:39 7391 2
原创 190724-提速PyCharm启动,换源pip、conda
PyCharm启动提速找到PyCharm安装目录 \bin文件夹 pycharm.exe.vmoptions文件修改-Xms128m-Xmx512m为-Xms256m-Xmx1024m之后启动PC确实快了一倍pip换源提速默认设置成清华源:pip install pip -Upip config set global.index-url htt...
2019-07-24 14:53:02 768
原创 190722-内积与外积(Inner/Outer/Interior/Exterior)Product
内积Inner Product中学时所学的向量乘法、点乘、数量积,例如线性代数中一行乘一列得到的一个数Interior product在光滑流形上的 微分形式的 外部代数上的 度 -1 (?)外积Outer Product张量积,例如线性代数中一列乘一行得到的一个矩阵或者Exterior product解析几何中的叉乘,例如求两向量的法向量...
2019-07-22 18:55:43 650
原创 190712-Python备忘
Python中没有 x++ 和 x-- 的操作符。Python也有内置的长整型和复杂数字类型Python实现的布尔逻辑,用的是英语,而不是我们习惯的操作符(比如&&和||等)如果想要在循环体内访问每个元素的指针,可以在in后使用内置的enumerate(枚举)list0 = [‘cat’, ‘dog’, ‘monkey’]for index, item i...
2019-07-12 14:07:16 94
原创 190710-关于Numpy.tile()函数
np中的tile(Array,Shape)函数正如单词tile“贴瓷砖”的含义一样,将数组Array作为瓷砖一块一块地贴入了一个矩阵框架之中在第二个参数处使用元组(i,j) 表示得到ixj的框架 最终会贴i*j个arr,若使用整型n 表示仅有n行默认1列 最终会贴n个arr注:输入的是数组,输出的是矩阵#INPUT:arr0 = [[11,12,13,14,], [...
2019-07-10 11:32:22 114
原创 190601-PaddlePaddle安装遇到的问题
今天正准备阅读胡晓曼(Charlotte77)老师的【深度学习系列】PaddlePaddle之手写数字识别,遇到了点儿麻烦。之前听同学说PaddlePaddle只能安装在专业版windows系统上,我想暂且抱着侥幸的心态用装机自带的家庭版win10斗胆一试吧。网上都说paddle只能通过docker安装,老师博客中说直接pip install也可以,我就是在这儿遇到了一堆错误信息。首先...
2019-06-01 15:54:16 1056
原创 201902-DFS入门失败
对于代码编写不太有帮助的图解就不放了,模板暂且放在这里,思考几个问题void dfs(状态x)//参数用来表示状态 { if(到达终点) { ...//根据题意添加 return; } if(不合法) return; if(特殊状态)//剪枝 return ;...
2019-03-02 21:58:28 236
原创 190113-首次接触git
windows上安装git可使用官网提供的安装程序,或者国内镜像https://pan.baidu.com/s/1kU5OCOB得到:安装完成后进入Git Bash,进行初始化设置$ git config --global user.name "Your Name"$ git config --global user.email "email@example.com"...
2019-01-13 22:36:10 135
转载 181216-向数据库中导入csv文件,日期格式不符的问题
使用postgreSQL时,用\COPY <table> FROM '<path>' WITH CSV HEADER;命令导入带表头的csv原始数据,导入成功,但查询数据时显示语法错误;后发现,是之前使用EXCEL打开过此CSV文件,导致日期格式被更改原本未显示的日期格式实际为-分割,在EXCEL中被显示为/分割,最终导致导入数据库语法错误(所以一定点D...
2018-12-06 21:26:59 11445
原创 180228-关于二级排序、运算符重载
参考资料:算法基础(北京大学)av10046345,王道机试指南在枚举例题—讨厌的青蛙中为了优化枚举顺序,对plant结构体数组先进行了一次sort()排序,由于plant表示坐标含有x,y两个分量,我们希望定义一个比较的规则:先比较x,若x相等则比较y。其中一种方法是,使用(arg,arg+n)两个参数的sort函数,然后重载操作符“小于号”:bool operator &l...
2018-02-28 09:28:18 264
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人