- 博客(171)
- 收藏
- 关注
RSS订阅
原创 React飞行日记(五) - 重构React渲染函数React.createElement与ReactDOM.render
为什么在JS文件中用那么几行神奇的代码, 就能够把虚拟DOM转换成真实DOM?并且还实实在在的插入了页面中?为了搞明白这一切, 我自己写了两个方法, 也就是对React.createElementReactDOM.render方法的重构, 来揭露其到底是怎么实现的!方法实现实现ReactDOM.render/** * 简单实现 React.createElement(type, props, ...children) 方法 * 该方法会创建一个虚拟DOM树, 通过ReactDOM.ren
2020-06-24 00:55:21
946
原创 React飞行日记(三) - JSX语法的渲染流程
Jsx的渲染流程在React.js中, 其为我们提供了一种JSX语法, 能够直接在JS文件中进行虚拟DOM代码的编写, 并在编译后转换成真实DOM渲染到页面中, 那么React是怎么把JSX的虚拟DOM转换成真实的DOM?主要靠两个API : React.createElement | ReactDOM.render实验代码显示效果渲染步骤需要借助babel来帮我们编译JSX语法的代码babel网址用法如下↓↓↓↓↓↓↓↓jsx语法转换成编译后, <div><
2020-06-22 17:33:15
278
原创 工具 : 请求头|响应头转换josn对象
以下是我自己封装的一个小工具:把网页中的原始 请求头|响应头 => 转换成Json文件# !/usr/bin/env python# _*_ coding:utf-8 _*_# author:Andermi 2019/1/15 20:42""" header2Json.py =>把一个txt文件【请求头|响应头 字符串形式】转换成json文件【请求头|响应头 键值对形式】 文件A.txt : content-type: text/css ..
2020-06-13 20:05:40
1143
1
原创 异步之 async 与 await
asyncreturn 的返回值为 PromisePromise对象的结果由async函数执行的返回值决定语法// 定义async函数async function name([参数1, 参数2...]) { 函数体 }描述使用async定义函数，函数内部可以使用await关键字，并且该异步函数会返回一个Promise状态为 resolved => return普通值 | 成功的Promise状态为 rejected => 函数内部错误 | 失败的Prom
2020-06-02 20:41:43
191
原创 JS正则表达式(5) => 正则的捕获方法
正则的捕获方法正则捕获实现正则捕获的方法 ( RegExp.prototype )exectest字符串支持正则的方法 ( String.prototype )splitreplacematch…正则的懒惰性execlet str = 'aaa111bbb222ccc333'// 正则进行捕获的前提: 正则表达式能匹配当前字符串, 不匹配结果为null...
2020-04-29 00:27:06
584
原创 Ajax(7) => 跨域请求方案
7.跨域请求三种跨域方案：JSONP模拟ajax请求CORS跨域请求让服务端作为客户端的代理进行请求ajax请求限制Ajax只能自己的服务器发送请求，也就是只能发送同源请求（判断两个请求是否同源：相同http/https协议，域名，端口），比如现在有A和B两个网站，A网站中的HTML文件只能向A服务器获取数据，B网站…获取数据，A只能向A服务器发送Ajax请求，而A如果向B发送请求...
2020-04-29 00:15:26
125
1
原创 Ajax(3) => url的组成
3.url的组成URL/URN/URIURI = URL + URNURI：统一资源标识符，就是URLURL：统一资源定位符URN：统一资源名称URL的组成【http】: //【www.myweb.cn】:【80】【/me/book/index.html】?name=xxx&id=yyy#myself【传输协议】：用来传输客户端和服务器端交互信息的HTTP：超文本传...
2020-04-28 23:59:48
474
原创 JavaScript基本数据类型（8）- JS栈内存和堆内存详解
栈内存：拥有作用域，代码执行空间，存储基本值和变量提供一个供 JavaScript 代码自上而下执行的 window 全局栈内存（代码都是在栈中执行的）基本数据类型会直接在栈内存中存放的，引用数据类型会开辟一个堆内存类存放，并且用指针指向其地址堆内存：引用值存储空间存储引用类型值的（对象：键值对形式，函数：字符串形式）=> 当前堆内存如果释放，那么这个引用空间就会彻底销毁，...
2019-12-17 16:59:30
554
原创 JavaScript基本数据类型（7）- JS的底层执行流程（栈堆）
JS的执行流程JavaScript语言本身是没法运行代码的，必须有解释器，也就是浏览器的内核，才能帮我们解析代码那么浏览器是如何执行JS代码的？首先从电脑中开辟出一块全局栈内存（电脑内存8G/16G/32G），用来执行代码（栈内存 => Stack）然后全局栈内存中有一个主线程，用来自上而下执行JavaScript代码栈内存里面有三个东西：变量存储空间，值存储空间，代码执行...
2019-12-17 16:52:21
233
原创 CSS 每日一练:EverydayCss
如果缓存过期，浏览器则会发送一个请求给服务器，服务器拿到请求后会根据请求头中的几个字段来判断对比服务器上的资和浏览器上的缓存是否一致，若一致则浏览器可以继续使用本地的缓存，这就是命中了协商缓存，其结果就是给浏览器返回 304 状态码，告知该资源未发生变动，可以继续使用本地缓存。浏览器发送请求之前，会先查看本地是否缓存，如果命中本地缓存，则无需向服务器发送请求，直接用本地缓存中的数据。使用缓存能提高浏览器的二次渲染的时间，以及减少用户的流量消耗。2️⃣ 协商缓存（与服务器协商是否命中本都缓存）
2022-10-22 11:35:51
228
1
原创 浏览器工作原理(4):浏览器缓存机制
使用缓存能直接从本地读取数据，减少向服务器请求数据，缓解服务器压力。使用缓存能提高浏览器的二次渲染的时间，以及减少用户的流量消耗。
2022-10-08 17:54:12
620
原创 浏览器工作原理(3):HTTP请求流程
连接会有限制，比如谷歌浏览器，一个域名最多只能建立6个TCP连接，如果超过这个数，只能进入TCP队列等待之前的连接完成。，这个服务的作用就是把域名和IP地址一一映射，使得不用输入形如 http:// 10.152.66.4。发起请求前，浏览器会查看该资源是否命中强缓存，如果没命中则进行协商缓存的请求。浏览器二次请求该域名 -> 本地有DNS缓存 -> 使用浏览器本身的。浏览器首次请求该域名 -> 本地无DNS缓存 -> 请求网络中的。浏览器使用域名访问服务器，那浏览器是如何知道服务器的。
2022-10-08 17:51:27
1039
原创 浏览器工作原理(2):TCP/IP协议
这是因为HTTP底层是依靠TCP/IP协议进行传输数据的,TCP/IP协议在客户端与服务器之间建立了稳定的连接，并能再丢包之后进行数据包重传，虽然牺牲了时间，但是带来的收益却是很值得的。如果TCP客户端发送完最后一个TCP确认报文之后马上关闭，期间发生了该TCP确认报文因为丢失的原因并没有发送到TCP服务端上，会导致TCP服务端会一直发送TCP释放连接的报文，但是此时TCP客户端已经关闭了，根本不会应答TCP服务端，白白让费TCP服务端上的资源。（TCP规定，在连接建立后所有的TCP报文段的。
2022-10-08 17:50:24
1384
原创 git使用
为什么GitHub需要SSH Key呢？因为GitHub需要识别出你推送的提交确实是你推送的，而不是别人冒充的，而Git支持SSH协议，所以，GitHub只要知道了你的公钥，就可以确认只有你自己才能推送。然后，点“Add SSH Key”，填上任意Title，在Key文本框里粘贴。在用户主目录，也就时我们生成公钥秘钥的那个文件里，两个文件，这两个就是SSH Key的秘钥对，如果一切顺利的话，可以在用户主目录里找到。是公钥，可以放心地告诉任何人。在项目中添加git管理。是私钥，不能泄露出去，
2022-09-17 11:43:23
229
原创 javascript性能优化之防抖和节流【附源码】
防抖debounce连续的多次动作内，只执行最后一次动作⭐️ 设想下面场景：有一个提交按钮，每次点击提交之后，就会向后台发起ajax请求这样设计会有问题：用户在一定时间内多次点击提交，按钮就会像多次向后台发送请求！！这时候，防抖就非常有用：用户在一定时间内无论多点击多少次提交，按钮只会提交一次???? 防抖有两种执行模式：在一定动作内执行最后一次动作在一定动作内只执行首次动作流程图地址：https://processon.com/diagraming/616
2021-10-11 21:45:37
324
原创 git clone速度慢【换源操作】
使用换源提升git clone的速度，Github国内镜像网站有github.com.cnpmjs.org和git.sdut.me# 正常git clonegit clone https://github.com/username/xxx.git# 换源1 -> [github.com.cnpmjs.org]git clone https://github.com.cnpmjs.org/username/xxx.git# 换源2 -> [github.com.cnpmjs.or.
2021-06-28 13:33:46
2760
原创 sql草稿
SELECT `a`.`f_qtn_uuid` AS `f_qtn_uuid`, `a`.`f_qtn_no` AS `f_qtn_no`, `a`.`f_qtn_date` AS `f_qtn_date`, `b`.`f_emp_dsp` AS `f_operator`, `a`.`f_quotation_number` AS `f_quotation_number`, `c`.`f_emp_dsp` AS `f_cus_no`, `d`.`f_pol_dsp` AS `f_pol
2021-06-23 10:46:27
141
原创 mysql外联多表查询
???? 外联查询，就是把两张表按照某个条件合并成一张新表比如说：学生数据，课程数据，班级数据，这些数据不可能全部写在同一张表里面，肯定是分成三张表，每张表只存对应的数据，当需要的时候，使用外联查询把这些数据串成一张某些字段我们需要的表案例：⭕️ 首先有下面三张表学生表c_s_uuid：学生唯一标识c_s_name: 学生姓名c_s_class: 所学课程的uuid2.课程表c_uuid: 课程唯一标识c_name: 课程名c_add: 上课地址唯一标识3.上课地点表c_
2021-05-15 11:06:54
1191
4
原创 MySQL（3）
文章目录一，修改表结构二，约束条件三，表关系一，修改表结构 1.1，修改表名 -alter table 表名 rename to 新表名； 1.2，修改字段名和类型 -alter table 表名 change 旧字段 新字段 数据类型； 1.3，修改字段数据类型 -alter table 表名 modify 字段 数据类型； 1.4，增加字段 -alter table 表名 add 字段 数据类型； 1.5，删除字段 -alter table 表名 d
2021-05-10 17:45:48
122
原创 MySQL（2）查询条件，分组查询，外联，子查询
文章目录一，筛选条件二，聚合与分组（重点和难点）三，子查询（了解）四，连接查询一，筛选条件 1.1，比较运算符等于：=（注意！不是==）大于等于：>=空: is NULL不等于：！=或<>小于：<非空: is NOT NULL大于：>小于等于：<= 1.2，逻辑运算符 与：and 或：or 非：not 1.3，排序 正序（降序）:order by 字段 相反（降序）:order by
2021-05-10 17:42:25
347
原创 js小黄书笔记一：闭包和作用域
???? ：本书所有知识点均可在《你不知道的JavaScript（上）》中找到出入点，如果想要进阶原生js的同学，推荐你去把《你不知道的JavaScript》上中两册精读一遍，我相信你能收获很多东西的???? 以下的内容是我结合上中两册总结出来的笔记，文笔有限，随缘更新一，闭包和作用域0. 作用域什么是作用域：用来存储变量，存储变量的值，变量的增删改查对接的地方【也就是变量能访问到的范围较作用域】栈内存和堆内存函数执行形成栈内存，所有的变量都是在栈内存中存储的，也就是所谓的作用域【基本数
2021-04-26 12:59:41
366
原创 React实现todoList【react的组件通信】
最终效果：代码目录结构github地址：https://github.com/Adermi/-react-todoList
2021-04-24 21:50:47
144
原创 typora导出pdf失败解决方法
在使用typora的时候，我们经常会进行md文件向pad文件转换的操作，但是有时候就是导出pdf失败，下面是解决这种问题的方法在键盘上按 window + r ，输入 services.msc，回车找到 Print Spooler 服务，并开启该服务重启 typora ，重新在 typora 中导出 pdf...
2021-04-13 13:19:02
8558
1
原创 钉钉视频回放下载【史上最全！！全干货！！！】
钉钉视频下载准备工作在下载视频前，我们首先需要准备以下的软件钉钉【万恶之源】：https://page.dingtalk.com/wow/dingtalk/act/download?spm=a213l2.13146415.4929779444.98.7f1521c9azB3YtFiddler【抓包工具】：http://www.downza.cn/soft/234727.htmlm3u8下载工具【NB的工具，冲鸭！】：百度云：https://pan.baidu.com/s/1S5jP7JaP
2021-03-05 21:32:46
56140
26
原创 在windows下vscode终端里无法运行脚本解决方案
windows下使用vscode中的终端运行脚本出现以下的问题解决方案：以管理员身份打开vscode，任意打开一个终端在终端中输入get-ExecutionPolicy，若返回Restricted，说明现在是vscode是被禁止运行脚本输入set-ExecutionPolicy RemoteSigned 这段命令再看看现在的状态，输入 get-ExecutionPolicy就可以运行脚本了~！...
2021-01-25 21:46:59
2656
4
原创 使用magicNumber判断图片类型
magic Number起因：做项目时需要对图片的类型进行判断，但是有些图片后缀名是jpg，但是里面的内容是png的形式；里面是gif，后缀确实显示jpg等等…，为了能够准确的拿捏图片真正的数据格式，我们可以使用magic Number来对图片的二进制数据进行判断一句话形容magic Number就是：文件的唯一标识常见的图片一些比较常见的图片及其magic number:图片类型扩展名magic number（以其开头）GIF format.gif47 49 46 38
2020-12-13 17:59:55
1755
原创 JavaScript模块
1.模块模式在没有模块规范出现之前，使用闭包创建命名空间是常用的手段使用闭包创建命名空间（模块模式）：var MyNameSpace = (function (global) { const name = 'xyb', age = 20, hobby = ['吃', '睡', 'coding'] const getHobby = () => { return hobby } return { name, age,
2020-11-21 19:25:27
374
原创 React飞行日记(九) - 复合组件交互
-父子组件交互1.状态和方法React中父子组件的交互有两种方式（除去redux）第一种是靠（状态|属性）完成父传子：（父组件把其状态，作为子组件属性传入，父状态改变子组件重渲染）【父->子】子传父：（父组件把其方法，作为子组件属性传入，子组件调用方法影响父组件）【子->父】2.context上下文第二种是靠（状态|上下文context）完成上下文和属性的不同点：父组件定义上下文，所有后代组件都能使用。（属性只停留在父子组件层面）每个后代组件中的上下文都是独立
2020-10-11 20:18:07
228
原创 React飞行日记(八) - React钩子函数
-钩子函数钩子函数，也称生命周期函数，是描述一个组件从创建到销毁的全部过程。基于钩子函数，在组件执行的过程中（创建前|创建后|二次渲染前|组件销毁…）可以加入我们自己的逻辑和操作【组件渲染的基本流程触发的钩子】constructor 创建组件（构造函数）componentWillMount 组件第一次渲染前在这个钩子函数中的this.setState会变成同步操作render
2020-10-11 20:11:44
479
原创 React飞行日记(四) - 如何编写JSX代码
Jsx语法的编写React的灵魂之一就是这个JSX语法了， JSX就是（JavaScript+XML），他的语法很奇特，也很有趣其中 {} 是JSX语法的核心（“小胡子”），在JSX中用他来向视图中展示数据，用 {} 编写JSX代码的时候需要遵循以下的规则正确写法{} 是 JSX 语法，在 {} 中的内容皆会被识别成 JavaScript 代码若没用 {} 包裹，则标签之间的 会被当成字符串处理{} 中使用有返回值的 js 表达式【如: 三元，立即执行函数，闭包，基本数据类型，数组
2020-07-17 01:04:59
231
原创 React飞行日记(七) - 在React中使用DOM操作
×在React中使用DOM操作React中很少直接用到DOM操作, 因为所有的功能都可以基于数据驱动来完成, DOM是框架帮我们做的事情, 但是也有些喜欢用DOM操作的开发者, 那么看看如何在React中使用DOM操作通过ref进行DOM操作1. refsReact中提供通过操作DOM来实现需求的方式, 那就是refs, it是一个对象, 存储了当前被渲染组件中的非受控组件有两种方法挂载非受控组件ref常规操作 : 挂载到this.refs上特殊操作 : 挂在到this实例上效
2020-06-30 21:59:02
389
原创 React飞行日记(六) - React组件
不管是任何框架, React|Vue|angular也好, 设计之初都是希望我们按照 组件|模块 的方式来构建程序, 也就是把一个程序划分成多个组件, 写好后渲染到页面即可优点:利于多人开发, 每个人只需要管理自己的组件组件能够被重复利用减少代码冗余…-创建组件组件存放位置为 项目根目录/src/component1.函数声明式首先在src/component下创建组件 导航栏组件Header.js编写组件代码import React from
2020-06-29 22:44:49
173
原创 Class中的实例方法用箭头函数写, 内部的this指向对象本身问题
最近在学习React框架的时候，发现在组件中直接写箭头函数, 作为组件实例的方法, 其内部的this是直接指向组件的，由此知识点为导火索，点燃了我知识盲区的炸药桶，因为以前并没有注意到这个知识点，例如:es6中的类定义class A { constructor(name, age) { this.name = name this.age = age } logThis= () => { console.log(this) // 指向实例 }}new A('张三',
2020-06-29 20:27:30
1239
原创 React飞行日记(二) -邂逅React
-React渐进式框架:最流行的框架设计思想我们在使用一个框架的时候, 如果只想使用其中几个功能, 但是需要引入一个庞大的框架, 过于臃肿, 这时候渐进式框架的特点就来了特点: 能够把各个功能进行拆分, 让用户自己组合功能, 想要什么功能就拿什么全家桶渐进式框架N多种部分的组合比如Vue全家桶: Vue/Vue-router/vuex/axios(fetch)/vue element(vant)React全家桶: react/react-dom/react-router/axi
2020-06-22 16:58:20
150
原创 React飞行日记(一)- 脚手架的基本使用(create-react-app)
基础使用React是FaceBook公司研发的一款JS框架(MVC)【React的脚手架】简介配置webpack是一个比较复杂的工作, 需要自己安装许多的包, 还要写复杂的配置文件, 使用脚手架能帮我们快速的构建一套自动化工程项目结构, 有助于提高开发效率(自动配置开发前所有的依赖和设置)【CREATE-REACT-APP】 的使用安装npm install create-react-app -g // 安装在全局使用create-react-app [项目名称]/
2020-06-22 16:54:31
224
原创 IPython的使用(看这篇就够了)
一，IPython特点提供用户一个更加友好的界面提供代码补全，对象检查，系统调用，获取输入历史等等实用的功能可嵌入程序用作解释器，这一特性可以用于排除bug，交互式处理，分析数据允许快速画图，IPython支持GTK，Qt，WX等GUI程序美化代码，对对象的输出格式进行调整能够嵌入别的程序中二，自动补全IPython可以通过Tab键，搜索命名空间里面的对象(包括定义的变量名，内建函数名，关键字等)访问私有属性或者私有方法，输入点后，输入下划线Tab[外链图片转存失败,源站可能有
2020-06-14 15:01:21
2581
原创 画图工具：Matplotlib（3）
表格样式的创建'''表格视觉样式：Dataframe.style → 返回pandas.Styler对象的属性，具有格式化和显示Dataframe的有用方法样式创建：① Styler.applymap：elementwise → 按元素方式处理Dataframe② Styler.apply：column- / row- / table-wise → 按行/列处理Dataframe '''样式df.styledf = pd.DataFrame(np.random.randn(1
2020-06-14 14:44:22
200
原创 画图工具：Matplotlib（2）
一，基本图标的绘制图标类型：线形图，柱状图，密度图，以横坐标两个维度为主同时可以延伸出多种其他图标样式plt.plot(kind='line', ax=None, figsize=None, use_index=True, title=None, grid=None, legend=False, style=None, logx=False, logy=False, loglog=False, xticks=None, yticks=None, xlim=None, ylim=None, rot
2020-06-14 14:31:31
471
1
原创 python高级编程(10) - 协程和异步io
协程和异步io一，并发，并行，同步，异步，阻塞，非阻塞并发 ：并发是指一个时间段内，有几个程序在同一个 cpu 上运行，但是任意时刻是由一个程序运行（在io等待的时间去运行别的程序）并行 ：并行是指任意时刻点上，有多个程序同时运行在多个 cpu 上同步 ：代码调用 I/O 操作时，必须等待 I/O 操作完成才返回的调用方式异步 ：代码调用 I/O 操作时，不必等待 I/O 操作完成就返回调用方式阻塞 ：调用函数时候当前线程被挂起非租塞 ：调用函数时候当前线程不会被挂起，而是立即返回二，C10
2020-06-14 13:53:04
189
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人