- 博客(142)
- 资源 (3)
- 收藏
- 关注
RSS订阅
原创 JavaScript进阶学习汇总
前端缓存可分为两大类：http缓存(l浏览器的网页缓存)和浏览器缓存（应用程序的本地缓存）http缓存:网络互联网:一个计算机互联的网络web：www万维网，只是互联网上分享信息的方式之一。使用超文本链接把一个文件链接到另一个文件，以这种方式实现一个网络。web技术的持续发展是由万维网联盟W3C监管。网络是怎样连接的_笔记HTTP缓存，不可靠，难以指定的。离线应用需要依赖.manifest文件统一说明项目的文件的缓存方式浏览器缓存机制：HTTP强缓存与协商缓存、缓存位置service work
2021-09-10 19:36:11
534
原创 JavaScript基础语法的学习汇总（自用）
基础重点JavaScript数据类型、引用类型、操作符、语句判断JavaScript中的数据类型typeof、instanceof、 constructor、 prototypejavaScrpt存取属性的语法：点语法+中括号JavaScript正则表达式弱映射与弱集合及其私有、垃圾回收方面应用私有变量这里不太懂JavaScript有关XML、JSONJavaScript API待补充和仔细研究jQuery梳理总结相比原生JavaScript，jQuery等库在DOM操作上的性能一定是有所
2021-04-30 01:09:23
439
3
原创 前端CSS的学习梳理（自用）
JavaScript基础语法JavaScript数据类型、引用类型、操作符、语句JavaScript正则表达式函数相关JavaScript作用域、闭包及其应用作用域中this手写bind函数JavaScript内存相关初了解：堆栈、引擎对象相关有关prototype和__proto__JavaScript扩展JavaScript函数式编程...
2021-04-27 12:49:11
232
原创 授人以渔command not found: ***
配置环境变量是每个开发人员绕不开的初级本领。搜了一下大多数博客都是列出自己系统配置的步骤，授人以鱼不如授人以渔，今天记录一下自己配置验证的方法过程，方便初学者配置。本文围绕——我在macOS配置http-server的探究验证过程
2023-02-24 13:46:36
557
1
原创 graphQL科普介绍篇
graphQL科普介绍篇restful 风格与graphQL了解graphQL纯个人理解学习记录，不含教程（这部分肯定是官方最靠谱啦）graphQL与react都是由Facebook设计，react为构建用户界面提供了一种声明式方案，类似地graphQL为API通信提供声明式方案，对想要的数据的声明式描述。例如并行发起数据请求时，我们希望能同时获得所需的全部数据，graphQL可以去帮我们处理多个数据请求，我们只需要关心我们想要的数据。此外graphQL也衍生扩展了很多功能，我们常说的分层网络协议，
2022-04-10 15:03:17
897
原创 Type ‘string‘ is not assignable to type ‘“xx1“ | “xx2“ | undefined
新手常遇typescript类型约束报错，是宽泛的字符串约束和具体值的类型约束的问题，使用as const 解决。原理详细如下https://blog.csdn.net/weixin_43263355/article/details/120943605
2022-02-17 10:49:04
3484
原创 常见概念学习记录
默认值多值的默认值，对象解构的默认值语法单值a=a||"default";let a=[x=>x*x,20];a[0](a[1]);
2021-09-11 12:04:49
172
原创 HTML5特性汇总（待补充）
离线-存储Application cacheLocal StorageIndexed DB在线/离线事件连接Web SocketsServer-sent事件文件访问File APIFile SystemFile WriterProgressEvents语义新元素、新属性国际化form类型microdata音频视频VideoWeb AudioWebRTCVideo track3D和图形Canvas 2D3D CSS变换WebGLSVG展示CSS3 2D
2021-09-11 11:35:41
78
原创 浏览器内核相关学习
浏览器想要在各设备上运行涉及到对操作系统的适配IEFirefoxchromeSafariwindows是是是是(5.1.7之前)Mac OS否是是是Linux否是是否Android否是是否iOS否否是是window是浏览器内核：Trident：IEGecko：FirefoxWebKit：safari 、chrome、 android、 webOS渲染引擎...
2021-09-06 22:48:41
585
2
原创 VUE基本了解
VUE渐进式增量框架，整体上遵循MVVM架构，视图与数据之间是独立的，M：Model（服务器上的业务逻辑操作）V：View（页面）VM：ViewModel（Model与View之间核心枢纽，比如Vue.js）一个响应式的数据系统，能通过轻量级的虚拟DOM引擎和最少的优化工作来自动更新用户界面。灵活的视图声明，友好的HTML模板、JSX（在JavaScript中编写HTML的技术）以及hyperscript渲染函数（完全使用JavaScript）由可维护、可复用组件组成的组件化用户界面。官方的
2021-09-05 14:06:48
127
1
原创 leetcode刷题笔记javascript
加油呀1两数之和2两数相加_链表操作1两数之和给定一个整数数组 nums 和一个整数目标值 target，请你在该数组中找出 和为目标值 的那 两个 整数，并返回它们的数组下标。对比两种方法感受：哈希表节约时间，花销空间哈希表的主干:存储位置 = f(关键字)，所以哈希表的时间复杂度就是常数阶O(1)。var twoSum = function(nums, target) { if(!nums) return []; const m=new Map(); for(let
2021-09-05 14:06:04
223
2
原创 JavaScript定型数组TypedArray
实际上JavaScript并没有TypedArray类型，实质是一种特殊的包含数值类型的数组。早期，希望在浏览器中安装用于渲染复杂图形的编程平台，无需安装插件。出现了webGL，是基于OpenGL ES2.0的JavaScript API。早期版本中，JavaScript数组与原生数组之间不匹配，出现性能问题。图形驱动程序API不需要以JavaScript默认的双精度浮点格式（js数组存储在内存中的格式）传递给它们的数值。所以提出了定型数组它不继承自普通数组（Array）；定型数组中只能存固定类型（数
2021-09-05 14:04:44
485
原创 关于前端框架、工具学习的总结
ReactReact函数式组件Hooks开发TypeScript是JavaScript的一个超集，除了支持ES6所有的功能外，还提供了静态类型检查。将其用于大型开发项目，就会凸显出他的优点。大型项目一般会有多个模块，在对接不同的模块时候，静态类型模块会在编译阶段找出可能存在的问题。Flow类似TS，但是更为灵活Flow是一个类型检查工具,TypescriptReact+Bootstrap构建一个联系人管理器（TypeScript+IndexedDB）VUE实现一个Markdown笔记本框
2021-09-05 14:02:10
162
原创 后端技术了解
微服务：一种架构风格，服务的作用域很严格，且服务之间松散耦合。由此推进：可独立部署，并且严格关注业务功能。微服务可以托管在Docker容器里面容器：一个运行实例，接受运行应用程序所需的各个软件部分。通过使用卷和端口，可以对其他容器、宿主操作系统甚至外部系统开放优点：易于设置和创建，并且可以快速停止和启动端口：同os，是连接到外界的udp、tcp端口卷：类似共享文件夹容器是从镜像构建的，我们可以自己构建镜像，或者从一个集中的Docker数据库下载镜像。镜像：是一种文件存储形式，是冗余的一
2021-09-05 14:01:12
166
原创 TypeScript进阶实战学习记录
高级类型-Partialtype Partial<T> = { [properties in keyof T]?: T[properties];};
2021-09-05 13:53:27
125
原创 CSS学习记录
伪类与伪元素伪类是选择器的一种，选择处于特定状态的元素li:last-child { // 是最后一个孩子的li元素 background-color: lime;}:first-child:nth-child:only-childem:last-of-type 子元素列表中，最后一个em元素input:invalid 表示任意内容未通过验证的 <input> 或其他 <form> 元素 :hover——上面提到过，只会在用户将指针挪到元素上的时候才会激活，
2021-08-27 10:18:20
92
原创 React学习进阶记录
React Fiber（v16)在现有React中，更新过程是同步的，这可能会导致性能问题。React决定要加载或者更新组件树时，会做很多事，比如调用各个组件的生命周期函数，计算和比对Virtual DOM，最后更新DOM树，这整个过程是同步进行的。表面上看，这样的设计也是挺合理的，因为更新过程不会有任何I/O操作，但是，当组件树比较庞大的时候，问题就来了。假如更新一个组件需要1毫秒，如果有200个组件要更新，那就需要200毫秒，在这200毫秒的更新过程中，浏览器那个唯一的主线程都在专心运行更新操作，
2021-08-08 22:27:01
154
原创 前端网络安全：SQL 注入、XSS、CSRF
SQL 注入某网站登录验证的查询句：strSQL = "SELECT * FROM users WHERE (name = '" + userName + "') and (pw = '"+ passWord +"');"而恶意用户输入的参数为：userName = “1’ OR ‘1’='1”;passWord = “1’ OR ‘1’='1”;直接做拼接：strSQL = "SELECT * FROM users WHERE (name = '1' OR '1'='1') and (
2021-08-03 00:40:58
409
原创 webpack实战总结2.0
Babel JavaScript编译器，从项目根目录下的. babelrc中读取配置下载插件以及对应依赖模块，一个plugin接入，preset列出使用的新语法ES6的class用ES5的prototype实现为新的API注入polyfill，例如fetch API全局安装typescript 之后，携带安装编译器tsctsc h.ts命令编译出. js文件和js.map文件tsconfig. json集成到webpack（方法之一）loader（module）extensions增加ts
2021-08-01 00:01:34
212
原创 JavaScript算法与数据结构
数据结构注意结合使用场景思考操作性能，e.g:队列的插入和删除链表与数组，分别更易于删除与插入双向链表，删除与插入的复杂度是 O(1)有序数组的二分查找，但是有序数组的插入和删除缓慢散列表的读取和插入的复杂度是 O(1)，但是它不保持顺序。所以二叉树：插入O(logN)散列表去重优化算法散列表，读取和插入的复杂度是 O(1)function hasDuplicate(array){ let existingValues= {}; for(let i=0;i<array
2021-07-17 15:04:48
177
原创 React函数式组件Hooks开发
组件预编译会带来巨大的潜力使用 class 组件会无意中鼓励开发者使用一些让优化措施无效的方案，而且class 也给目前的工具带来了一些问题。e.g：class 不能很好的压缩，并且会使热重载出现不稳定的情况。因此，推荐函数式函数式组件没有实例的概念，函数通过执行去渲染//函数组件1.0const Example = (props) => { // 你可以在这使用 Hook return <div />;}//函数组件2.0function MyFunctional
2021-07-11 03:25:20
1628
1
原创 react初级学习
学习整理React官方文档整理如下https://react.docschina.org/docs/getting-started.htmlJSXJSX 防止注入攻击,可以安全地在 JSX 当中插入用户输入内容React DOM 在渲染所有输入内容之前，默认会进行转义。它可以确保在你的应用中，永远不会注入那些并非自己明确编写的内容。所有的内容在渲染之前都被转换成了字符串。这样可以有效地防止 XSS（cross-site-scripting, 跨站脚本）攻击。const title = respon
2021-05-31 01:48:14
249
原创 TypeScript
ES6是下一代JavaScript的标准，在语言层面为JavaScript引入很多新语法和API规范模块化Class语法let、const箭头函数async函数Set、MapTypeScript是JavaScript的一个超集，有微软开发并开源除了支持所有ES6的功能，还提供了静态类型检查。使用typescript编写的代码可以被编译成为符合ES5、ES6标准的JavaScript。注意： TypeScript未经编译无法直接运行在浏览器和node环境。TypeScript的优点”静
2021-05-23 22:57:33
455
10
原创 二叉树相关JavaScript实现：中序、先序、后序、层次遍历
先序和后序采用递归即可先序var preorderTraversal = function(root) { let arr = []; if(!root) {return arr} let traver = (root) => { arr.push(root.val); if(root.left){ traver(root.left) }; if(root.right){ traver(root.right) };
2021-05-15 16:02:02
135
原创 Axios
Axios 是一个基于 promise 的 HTTP 库，可以用在浏览器和 node.js 中。从浏览器中创建 XMLHttpRequests从 node.js 创建 http 请求支持 Promise API拦截请求和响应转换请求数据和响应数据取消请求自动转换 JSON 数据客户端支持防御 XSRF...
2021-05-13 21:24:17
85
原创 vue实例方法、全局API、内置组件
实例方法是将方法挂载到Vue的原型上，而全局API是直接在Vue上挂载方法。实例方法事件相关在eventsMixin函数中挂载到Vue原型上的vm.$on和emit发布订阅模式vm.$on( event, callback )vm.$on('test', function (msg) { console.log(msg)})vm.$emit('test', 'hi')//该方法接收的第一个参数是要触发的事件名，之后的附加参数都会传给被触发事件的回调函数。所有绑定在这个实例上的事件
2021-05-04 15:22:26
430
原创 vue的虚拟DOM、patch即DOM-Diff算法
过去jQuery声明式操作DOM现在Angular、React、Vue三大框架都是声明式操作DOMDOM操作的执行速度远不及JavaScript的运算速度虚拟DOM:用JavaScript模拟DOM树，并渲染这个DOM树。比较新老DOM树，只渲染差异部分。Angular脏检查、React虚拟DOM、Vue变化侦测粒度更细的虚拟DOM通过模板来描述状态与视图的映射关系，会将模板先编译成渲染函数，然后执行渲染函数生成虚拟节点。中等级别，通知到组件创建HTML在vue中创建HTML，可以通过渲
2021-05-03 17:20:13
727
2
原创 vue响应式：变化侦测、相关实例方法、on/off发布订阅者模式、watch与computed
响应式当一个 Vue 实例被创建时，除了创建HTML，它将 data 对象中的所有的 property 加入到 Vue 的响应式系统中。当这些 property 的值发生改变时，视图将会产生“响应”，即匹配更新为新的值。Object.freeze()，这会阻止修改现有的 property，也意味着响应系统无法再追踪变化。值得注意的是只有当实例被创建时就已经存在于 data 中的 property 才是响应式的。如果后来添加一个新的 property，不是响应式在页面显示seconds，计时va
2021-05-03 14:28:49
450
1
原创 跨域问题
跨域问题MDN Web Docs 中定义跨域，当一个资源从与该资源本身所在的服务器不同的域或端口不同的域或不同的端口请求一个资源时，资源会发起一个跨域 HTTP 请求。即访问了一个网站，然后在这个网站返回的资源里面，请求了B网站/端口的资源。跨域这个情况只会出现在浏览器页面里，因为实际上是浏览器由于安全原因限制了这些请求的访问。CSRF攻击，如果前端可以跨域，那:用户访问A,生成cookie存储在本地，点击弹窗广告进入地址B,B网站可以在自己的页面中获取A的cookie,然后模拟用户登录同源
2021-05-02 15:13:18
359
原创 innerHTML与XSS攻击
HTML5为所有元素提供了一个innerHTML属性，既能获取对象的内容又能向对象插入内容属性值：HTML标签/文本浏览器会将属性值解析为相应的DOM树HTML解析器在浏览器中是底层代码比JavaScript方法快很多，同时意味着替换元素上的关联事件处理程序和JavaScript对象需要手动删除。插入script和style元素的时候需要看具体的浏览器XSS攻击outerHTML==innerHTML定义的DOM树+自身元素innerText与outerHTML:innerText:后代
2021-04-30 00:53:40
3853
原创 有关cookie：验证_token、CSRF攻击、保存信息_cookie与本地存储、indexDB、
localStorage和sessionStorage都具有相同的操作方法，例如setItem、getItem和removeItem等localStorage和sessionStorage的key和length属性实现遍历IndexedDB 就是浏览器提供的本地数据库，它可以被网页脚本创建和操作。IndexedDB 允许储存大量数据，提供查找接口，还能建立索引。var db = null;var request = window.indexedDB.open("MyTestDatabase");r
2021-04-28 11:20:59
1047
原创 函数防抖和节流的代码
函数防抖： 多次接近的（相隔不超过时间设置）操作合并为一次操作进行,。只在最后一次事件后才触发一次函数，事件持续被触发使用需谨慎。适用于滚动页面、resize实现：维护一个定时器，返回一个推迟执行的函数//防抖debounce function debounce(fn) { var timer = null; //维护一个计时器，创建一个标记存放定时器的返回值 console.log("1节流"); console.log(timer); return functio
2021-04-28 10:39:01
360
原创 display属性理解： inline ， block， inline-block+BFC格式上下文、盒模型
display的常用的属性值，inline ， block， inline-block块级元素总是从新行开始width、height、margin、padding都可以控制宽度默认是页面的100%可以容纳内联元素和其他块元素<h1></h1><h2></h2><h3></h3><h4></h4><h5></h5><h6></h6><di
2021-04-28 00:44:39
557
contact_manager.rar
2021-06-20
markdown_vue.rar
2021-05-16
KEIL调试J-link驱动安装包
2020-11-15
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人