- 博客(65)
- 收藏
- 关注
RSS订阅原创 【读书笔记】vue.js设计与实现--初识渲染器
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document&l.
2022-04-07 22:35:34
541
原创 【读书笔记】--浏览器工作原理与实践（使用Promise告别回调函数）
promise解决了什么问题？解决了异步编码风格的问题。第一是嵌套调用，下面的任务依赖上个任务的请求结果，并且在上个任务的回调函数内部执行新的业务逻辑，这样嵌套层次多了以后，代码可读性变差第二是任务的不确定性，执行每个任务都可能有两种结果，所以体现在代码中就需要对每个任务的执行结果做两次判断，这种对每个任务都需要进行一次额外的错误处理的方式，增加了代码的混乱程度promise消灭了嵌套调用，合并了多个任务的错误处理。多个promise嵌套，可以在最后一个promise里面进行异常捕获，这是因
2022-03-10 19:55:45
282
原创 【读书笔记】--浏览器工作原理与实践（变量提升：JavaScript代码是按顺序执行的吗）
一、编译阶段变量提升：是指的JavaScript代码执行过程中，JavaScript引擎会把变量的定义和函数的声明部分提升到代码开头的位置。变量提升以后，会给变量赋值undefined，函数则会完整的声明。变量提升意味着变量和函数的声明会在物理层面上移动到代码的最前面。但是这不是准确的，实际上，函数的声明和变量的声明的位置是不会改变的，而是编译阶段，JavaScript引擎会把他们放到内存中。换句话说，JavaScript代码在执行前是需要被编译的，编译完成以后才会进行执行阶段。总结下，
2022-02-22 22:50:35
464
原创 【读书笔记】--浏览器工作原理与实践（浏览器渲染流程）
回顾上一节内容：在HTML页面内容被提交给渲染引擎之后，渲染引擎首先将HTML数据解析为浏览器能理解的DOM，然后根据CSS样式表，计算出DOM所有节点的样式，然后计算出每个DOM元素的位置，并将这些保存到布局树上。一、分层浏览器的页面实际上被分成了很多图层，这些图层叠加后合成了最终的页面。通常情况下，并不是所有布局树的每个节点都包含一个图层，如果一个节点没有对应的图层，呢么这个节点就从属于父节点的图层。什么情况下，渲染引擎为节点创建新的图层？满足下面两个条件之一，就会被提升为单独的一个图层
2022-02-21 22:51:44
275
原创 【读书笔记】--浏览器工作原理与实践（浏览器渲染流程）
整个过程大概分为以下几个流程：建DOM树、样式计算、布局阶段、分层、绘制、分块、光栅化和合成一、构建DOM树简单的说就是HTML经由HTML解析器解析，最终输出的树状结构，就是DOM树二、样式计算样式计算的目的是为了计算出DOM节点中每个元素的样式，大概有三个步骤1）把CSS转换为计算机能够理解的结构（简单的说就是解析css）css主要的来源有三个：通过link标签引入；<style>标签内的css；元素的style属性内嵌的样式浏览器是无法直接理解css的，
2022-02-21 22:50:30
161
原创 【读书笔记】--浏览器工作原理与实践（从输入URL到页面展示，这中间发生了什么）
一、用户输入：浏览器判断输入的是关键词还是URL,如果是关键词，会使用默认搜索引擎合成带有搜索关键字的URL如果是URL，或者是符合url规则的的内容，会带上协议合成完整的URL,二、URL请求过程：浏览器进程会将url通过ipc传输给网络进程，网络进程拿到url后会发起url请求流程，过程如下：1）网络进程会先查看本地的缓存有没有这个请求的资源。如果有这个资源，会直接返回资源给浏览器进程；如果没有该资源，那么会直接进入网络请求流程。这请求前的第一步是dns解析，如果是https请求
2022-02-21 20:30:27
318
原创 【浏览器】重排重绘
有个概念叫做关键渲染路径（Critical Rendering Path），他是这么定义的浏览器将html，css，JavaScript代码转换成屏幕上能看到的像素，这期间经历的一系列步骤就是关键渲染路径。大概的流程就是构建对象模型，构建渲染树，布局渲染。浏览器渲染过程是这样的，解析html生成dom树，解析css生成cssom规则树，将dom树和cssom规则树合并在一起生成渲染树。遍历渲染树开始布局，计算每个节点的位置大小信息，将渲染树的每个节点绘制到屏幕上。dom元素的位置和大小发生改变时，浏览器
2022-02-16 08:46:41
86
转载 【JavaScript】手写apply
Function.prototype.apply = function(context, rest) { if(!context) { context = typeof window === 'undefined' ? global : window } context.fn = this let result; if(rest === undefined || rest === null) { result = context.fn(rest) } els..
2022-01-19 22:27:53
66
转载 【JavaScript】手写call
Function.prototype.call = function(context) { // 判断传入的context是不是null或者undefined，如果是的话，将context设置为全局对象 if(!context) { context = typeof window === 'undefined' ? global : window; } context.fn = this// this是指向当前函数 let res = [...arguments].sl.
2022-01-19 22:11:33
1008
1
转载 【JavaScript】手写节流
function throttle3(func, wait) { var args, context; var previous = 0; var timeout; var latter = function () { previous = +new Date() timeout = null func.apply(context, args) } var throttled = function () { var now = +new Dat.
2022-01-18 23:04:57
109
转载 【JavaScript】手写防抖
function debounce(func, wait, immediate) { // 增加立即执行参数 immediate // 增加返回值,当且只有在immediate为true的时候才会有返回值 var timeout, result; var debounced = function() { // 将this指向正确的对象 var context = this; // 接受event对象 var args = arguments; if(.
2022-01-17 22:37:01
180
原创 【JavaScript】 -- 闭包
MDN对闭包的定义为：闭包是指呢些能够访问自由变量的函数自由变量的定义是：自由变量是指在函数中使用的，但既不是函数参数也不是函数局部变量的变量。闭包大概就是：闭包 = 函数 + 函数能够访问的自由变量。闭包的最常见的形式是，在一个函数内部创建一个新的函数，这个函数能够访问外部函数的变量。闭包的作用：封装私有变量模仿块级作用域实现js的模块化ECMAScript中，闭包指...
2021-12-29 22:47:09
336
原创 【JavaScript】手写new
function _new(/* 构造函数 */ constructor, /* 构造函数参数 */ params) { // 将 arguments 对象转为数组 var args = [].slice.call(arguments); // 取出构造函数 var constructor = args.shift(); // 创建一个空对象，继承构造函数的 prototype 属性 var context = Object.create(constructor.prototype); /.
2021-12-23 15:29:21
290
原创 跟着瓶子君学前端 -- JavaScript数组（3）
const twoSum = function(nums, target) { let map = new Map() for(let i = 0; i < nums.length; i++) { let k = target - nums[i] if(map.has(k)) { return [map.get(k), i] } map.set(nums[i], i) } ret..
2021-11-04 19:43:42
243
原创 跟着瓶子君学前端 -- JavaScript数组（2）
合并两个有序数组 解题思路nums、nums2有序，吧nums2全部合并到nums1，则合并后的nums1长度为m+n从下标m+n-1的位置填充nums1，比较nums1[len1] 与nums2[len2]的大小，大值写入nums1[len[] 即 nums1[len1] >= nums2[len2] ,nums1[len--] = nums1[len1--],由于写入成功以后，下标自动减一，继续往前比较 否则num...
2021-11-02 21:21:07
391
原创 跟着瓶子君学前端 -- JavaScript数组（1）
引言堆是前端进阶必不可少的知识，也是面试的重难点，例如内存堆与垃圾回收、Top K 问题等，这篇文章将从基础开始梳理整个堆体系，按以下步骤来讲：什么是堆 怎样建堆 堆排序 内存堆与垃圾回收 Top K 问题 中位数问题 最后来一道leetcode题目，加深理解下面开始吧????一、堆满足下面两个条件的就是堆：堆是一个完全二叉树 堆上的任意节点值都必须大于等于（大顶堆）或小于等于（小顶堆）其左右子节点值如果堆上的任意节点都大于等于子节点值，则称为大顶堆如果堆上的任意节
2021-11-02 21:02:44
311
原创 VUE响应式原理-Watch类
class Watcher { constructor(vm, key, cb) { // 当前vue实例 this.vm = vm // 订阅的属性名 this.key = key // 数据变化后要执行的函数 this.cb = cb // 触发getter之前，要将当前订阅者实例存储在dep Dep.target = this // 记录下原来的值, 用于更新检测（导致了getter属性的触发） this.oldV.
2021-11-01 23:21:16
101
原创 VUE响应式原理-Dep类
class Dep{ constructor() { // 存储订阅者 this.subs = [] } // 添加订阅者 addSub(sub){ if(sub && sub.update) { this.subs.push(sub) } } // 通知订阅者 notify() { // 变量订阅者，执行更新 this.subs.forEach(item => item.update()) .
2021-10-24 22:34:49
289
原创 VUE响应式原理-Observer类
class Observer{ // 接受传入的对象，将这个对象转换为getter/setter constructor(data) { this.data = data // 遍历数据 this.walk(data) } // 封装用于数据遍历的方法 walk(data) { // 将遍历后的数据都转换成getter/setter Object.keys(data).forEach(key => { this.conver.
2021-10-18 22:26:16
354
原创 VUE响应式原理-vue类
class Vue{ constructor(options) { // 1 存储数据 // 存储属性 如果没有传入参数，即当做eventBus来使用时，给options传入一个空对象 this.$options = options || {} this.$data = options.data || {} // 判断el的值的类型，并进行存储 const {el} = options this.$el = typeof el === "str.
2021-10-17 14:40:20
87
原创 vue响应式原理
发布订阅模式 消息中心DEP 订阅者subscribe 发布者publisher 发布订阅模式 由发布者订阅者和消息中心组成，适合消息事件更复杂的场景使用 特性：特殊事件发生后，有发布者向消息中心发布指令，消息中心会根据指令向不同的订阅者发布信息 观察者模式 观察者模式是由观察者和被观察者组成，适合组件内部使用 特性：特殊事件发生后，观察目标统一通知所有观察者 vue响应式模式流程vue 目标：将data注入vue实例，方便方法内操..
2021-10-13 22:58:27
58
转载 学习笔记 （卷积神经网络）
import torch'''卷积神经网络 卷积神经网络尝试解决两个问题 卷积神经网络保留了输入形状，使图形的像素在高和宽两个方向上的相关性均可能被有效识别 卷积层通过滑动窗口将同一卷积核与不同位置的输入重复计算，从而避免参数尺寸过大 卷积神经网络就是含有卷积层的网络 手写数字图像的卷积神经网络 LeNet展示了通过梯度下降训练，卷积神经⽹络可以达到⼿写数字识别在当时最先进的结果 LENET模型 LENE.
2020-06-02 16:11:40
1017
转载 学习笔记 池化层
import torch'''池化层 在5.1节里面介绍的图像物体边缘检测应用中，我们构造卷积核从而精确的找到了像素变化位置。设任意二维数组 x的i行j列的元素为x[i,j]。如果我们构造的卷积核输出Y[i,j]=1,呢么说明输入中x[i,j]和x[i,j+1]数值不一样 这可能意味着物体边缘通过这两个元素之间。但实际图像里，我们感兴趣的物体不会总出现在固定位置：即使我们连续 拍摄同一个物体也可能会出现像素位置上的偏移。这会导致同一个边缘对应的输出可能出现在卷积输出Y.
2020-05-28 14:30:34
622
转载 学习笔记 填充和步幅
import torchfrom pprint import pprintfrom torch import nn'''填充和步幅 之前，我们使用高和宽为3的输入与高和宽为2的卷积核得到高和宽为2的输出。一般来说，我们假设 输入形状是n(h,w),卷积核窗口的形状是k(h,w)，那么输出的形状将会是 (n(h,)-k(h,)+1)*(n(,w)-k(,w)+1) 所以卷积层的输出形状由输入形状和卷积核窗口形状决定。填充和步幅可以对给定形状的.
2020-05-24 12:00:58
542
转载 fastapi Query参数 & 字符串验证
from fastapi import FastAPI, Query'''FastAPI 允许您声明其他信息并验证参数'''app = FastAPI()@app.get("/items/")async def read_items(q: str = None): ''' query 的参数q是一个字符串，默认为None，说明这个参数是可选参数 :param q: :return: ''' result = {"items": [{"it.
2020-05-15 17:51:48
2549
原创 过拟合及应对方法
训练误差和泛化误差 训练误差 模型在训练数据集上表现的误差 泛化误差 模型在任意一个测试数据样本上表现的误差期望，常常通过测试数据集上的误差来近似 计算训练误差和泛化误差可以使用损失函数（loss），线性回归使用平方误差损失函数 softmax回归使用交叉熵损失函数模型选择 从严格意义上讲，测试集只能在所有超参数和模型参数选定后...
2020-04-21 23:05:24
418
原创 softmax多分类学习
'''softmax回归从零开始实现'''import torchimport torchvisionimport numpy as npimport syssys.path.append('..')import d2lzh_pytorch as d2l'''获取数据'''batch_size = 256train_iter, test_iter = d2l.load...
2020-04-11 18:41:54
518
转载 Word2vec模型的常用方法枚举
'''Word2vec模型的常用方法枚举1 model.wv.vectors.shape 词向量的维度 (631, 50) 模型有631个不重复的词汇，维度为502 model.wv.most_similar(positive=['文本挖掘', '汽车'], negative=['内容'], topn=20) 获取词汇相关的前n个词语，当positive和nega...
2020-03-29 13:37:30
4121
1
原创 gensim.models.word2vec
1 min_count 用于修剪内部字典（Prune the Internal Dictionary） 用于忽略在语料库里面出现次数过低的词汇（错别字，噪音信息）2 size gensim Word2Vec将词汇映射到的N维空间的维度数量（N） 较大的size需要更多的训练数据，但是可以产生更好的更准确的模型 一般是介于几十到几百之间 拥有的数据较少...
2020-03-28 22:33:44
371
原创 事务
事务控制语句： BEGIN 或 START TRANSACTION 显式地开启一个事务； COMMIT 也可以使用 COMMIT WORK，不过二者是等价的。COMMIT 会提交事务，并使已对数据库进行的所有修改成为永久性的； ROLLBACK 也可以使用 ROLLBACK WORK，不过二者是等价的。回滚会结束用户的事务，并撤销正在进行的所有未提交的修改； S...
2020-01-17 16:10:50
93
原创 cuda的安装
经过好几天的折腾我这个垃圾机器终于安装上了cuda，美滋滋的用上了传说中的人工智能。下面是我安装时候遇到的坑，及大家要注意的问题第一个坑chrome_elf.dll拒绝访问，这个需要卸载英伟达相关产品重启机器（只重启机器也可以）第二个坑各种安装失败，这个是真的坑 每次都去找各种论坛挨个去排查，然后一生气，直接卸载全部英伟达，然后重启机器完美解决。这是遇到的坑我是1650的机器，按照...
2020-01-02 17:03:11
679
1
原创 mysql 练习
CREATE TABLE tb_score ( id smallint unsigned auto_increment primary key,name varchar(20) NOT NULL, chinese int(11) , maths int(11) ) ENGINE=InnoDB DEFAULT CHARSET=utf8;INSERT into tb_score (...
2019-12-31 17:46:02
146
1
原创 数据特征分析-正太分布 （QQ图）
qq图通过把测试样本数据的分位数与已知分布进行比较，从而检验数据的分布情况。qq图是一种散点图，对应于正态分布的qq图，就是有标准正态分布的分位数（分为点即分位数）为横坐标、样本值为纵坐标的散点图。分位点是指将一个随机变量的概率分布范围分为几个等份的数值点，常用的有中位数（即二分位数）、四分位数、百分位数等参考直线：四分之一分位点和四分之三分位点，看散点是否落在这条线附近。qq图绘...
2019-12-17 22:11:53
7264
原创 头条的编码 解决方案
方案1page_info = re.findall("content: '([\s\S]+?);'",response.text)[0][6:-5]print(page_info.encode('unicode-escape').replace(b'\\\\',b'\\').decode('unicode-escape'))方案二select = Selector(text=resp...
2019-09-12 16:29:40
215
原创 Docker 踩得坑（docker root dir 默认路径占用过多）
系统文件 100%了 经过排查后 发现是docker的问题通过docker info 命令看到Docker Root Dir 进去发现/var/lib/docker这个文件占用过多然后去百度了下怎么解决具体步骤如下1cd /homemkdir docker2 修改docker.service文件vim /usr/lib/systemd/system/do...
2019-08-26 16:15:43
3366
原创 Docker 踩得坑（waiting for lo to become free. Usage count = 1）
waiting for lo to become free. Usage count = 1最近使用splash 需要使用docker 但是使用过程中出现这个异常Message from syslogd@dzyq-3-59 at Aug 22 10:06:54 ... kernel:unregister_netdevice: waiting for lo to become f...
2019-08-22 10:20:16
5119
转载 安卓的网络通信库
Android网络通信浅析我们做爬虫的在搞App逆向时，大部分时候其实就是在和App中的网络通信打交道。我们先聊一下Android的网络通信可能从什么地儿发出，以Python类比，Python原生的网络请求库是urllib和urllib2，它们可以很方便的实现http服务的调用，而Python的第三方库Requests库是基于 urllib的封装，它更加方便和优雅。我们按照远近亲疏，缕一缕...
2019-07-26 15:54:06
621
转载 js混淆
这个是咸鱼大佬找到的混淆，我拿到网站自己搞了一波，网页下方的中属性是数据加密的地方，这种加密一般都是在前端完成的，后端给出一个加密后的密文，前端拿到密文后进行解析，展示。谷歌浏览器 f12 然后看下这个位置，发现是展示在id="equip_desc_panel"的地方，根据老方法搜关键词，直接搜id的内容会看到这个id被调用渲染传参的js函数然后根据这个函数的调用得到这串密文...
2019-07-17 16:18:37
3045
原创 跟着 Jerryning复习js---电信登录（仅供学习）
以下仅供学习目标网站https://login.189.cn/web/login第一步搜索关键词password第二步下断点第三步调试（略）代码如下var CryptoJS = CryptoJS ||function(o, e) {var h = {},g = h.lib = {},z = function() {},y = g.Base = { ...
2019-07-09 16:08:06
263
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人