- 博客(189)
- 收藏
- 关注
RSS订阅原创 前端防扒代码片段
分享一段看到的挺有意思的代码只要打开了devtools, 由于有debugger的存在, 导致页面的交互失效了. 并且即使点了放开debugger, 后面的reload又会导致页面刷新. 这样的对于页面的需要二次交互的部分, 算是隐藏了, 因为触发不了页面的事件. 可以有效防止嫖代码, 或者在network上分析接口.对于正常使用的用户, 不打开devtools, 不会触发debugger浮层, setInterval也中断在了第一次执行时, 没影响.// 放在页面main.js之前插入这段scrip
2022-04-10 23:40:42
1307
原创 CSS rule @layer 介绍
CSS rule @layer 在chrome99已经发布了, 这个主要用来解决样式冲突问题, 特别对于大的组件库之类的感觉会很有用. 比如组件库的样式全都写到不同的@layer里, 这样用户自定义样式可以无感知覆盖.语法@layer <layer-name> { <stylesheet>}...
2022-03-29 16:10:37
637
原创 如何查看微信image/*.dat文件
背景: 起因我是想看看能不能获取的到撤回的图片, 于是在*\WeChat Files\*\FileStorage\Image这个文件下发现了聊天记录储存的文件, 却发现文件已被加密… 也就有了这篇文章…关于撤回的图片这个问题, 结论是获取不到, 聊天记录里加密的图片也删除了…, 不过该文章的方法可以获取到原来聊天记录的图片图片文件的每个字节 异或 机器随机的一个值, 对此进行的加密下图为普通JPG文件. JPG文件的文件头为 0xFF, 0xD8下图为image文件夹下某Dat文件, 文件头为
2022-01-14 21:39:25
12259
5
原创 2020/09-2020/11 读书摘录
德米安:一种认知宛如烈火, 顷刻燃烧我–人人拥有自己的"职责", 但没人能选择, 再造或任意掌管自己的"职责". 渴慕新神是虚妄的. 任何试图施予尘世的意愿, 都是彻底的虚妄. 一个觉醒的人, 只有一个任何义务也无法超越的义务; 寻找自我, 固化自我, 搜索自己的路前行, 无论去向何方. --这种认知深深撼动我, 它是我此番经历的果实. 我时常想象未来的图景, 梦想自己可能成为的人物: 诗人, 先知或画家? 这些都一无是处. 我来, 不为写诗, 不为预言, 不为作画. 不仅是我, 任何人都不为此而来. 成
2020-11-23 15:28:28
648
原创 Python学习笔记(四)
文章目录1. 进程1.1. 系统原生 OS 模块, 创建进程1.2. multiprocessing 模块1.2.1. Process 单进程1.2.2. Pool 进程池1.3. subprocess 模块 使用外部子进程1. 进程线程是最小的执行单元，而进程由至少一个线程组成这部分可能会多一些, 写JS写的比较多, 接触进程还是在上学搞java的时候.1.1. 系统原生 OS 模块, 创建进程fork函数是UNIX或类UNIX中的分叉函数，fork函数将运行着的程序分成2个（几乎）完全一样的
2020-07-01 21:16:56
770
原创 Python学习笔记(三)
文章目录1. 异常供个人学习笔记回顾时使用.1. 异常没啥说的, 语法换下而已. 下文只会记录一下和JS语法不同的地方:基础语法: try...except...finally...一. 可以expect多个异常, 例子:可以使用expect语句块处理不同的错误try: print('try...') r = 10 / int('a') print('resu...
2020-06-04 21:24:48
833
原创 Chrome Performance常见名词解释(FP, FCP, LCP, DCL, FMP, TTI, TBT, FID, CLS)
之前整理过一份分析Performance的博文: 利用Performance API分析网站性能这次还是拿优快云的performance来举例说明, 这几个名词的含义, 供自己遗忘和不会的同学方便查看FP (First Paint) 首次绘制: 标记浏览器渲染任何在视觉上不同于导航前屏幕内容之内容的时间点.FCP (First Contentful Paint) 首次内容绘制 标记浏览...
2020-02-09 20:58:36
23582
原创 Python学习笔记(二)
文章目录1. 类1.1. 私有变量1.2. 继承1.3. 杂1. 类天下语言是一家, 你抄我完, 我抄他.没错, python的没啥特殊的, 先来个简单的例子:class Student(object): def __init__(self, name, score): self.name = name self.score = score ...
2020-01-31 16:52:22
1129
原创 Python学习笔记(一)
print()输出r’…’ …中间字符不需要转义‘’’…’’’ ‘’'中间字符支持跨行input()输入由于Python的字符串类型是str，在内存中以Unicode表示，一个字符对应若干个字节。如果要在网络上传输，或者保存到磁盘上，就需要把str变为以字节为单位的bytes。Python对bytes类型的数据用带b前缀的单引号或双引号表示： x = b'ABC'以...
2020-01-29 15:50:39
924
原创 用的上的商学课1-50课学习笔记
机会成本我们每天都在做选择, 而每个人所拥有的时间, 金钱, 社会资源都是有限的. 所以我们通常为了得到某一样东西, 一般我们都不得不放弃另外一些东西. 在经济学里, 这些不得不放弃的东西, 就是我们为当前选择所付出的机会成本. 有人这样描述机会成本, 鱼与熊掌不可兼得, 那么放弃掉的鱼, 就是你选择熊掌的代价.了解机会成本, 要记住以下三个词:所有的选择都有机会成本, 没有例外.机会成本...
2020-01-12 23:16:04
4648
2
原创 未来简史--读书语句摘录及感悟
18世纪末的英国哲学家边沁主张, 所谓至善就是"为最多人带来最大的快乐", 并认为国家, 市场和科学界唯一值得追寻的目标就是提升全球的快乐. 政治家应该追求和平, 商人应该促进繁荣, 学者应该研究自然, 但不是为了荣耀什么国王, 国家或者神, 而 是为了让你我都享有更快乐的生活.现在的思想家, 政治家甚至经济学家, 都呼吁要用GDH(国内幸福总值)来补充甚至取代GDP. 毕竟, 人们到底想要什...
2019-12-01 20:29:47
2092
7
原创 常用分析问题的几种方法
文章目录1. 5W2H分析法2. 麦肯锡问题解决框架3. SWOT分析法4. SMART1. 5W2H分析法5W2H指的就是7个英文单词, 是二战中美国陆军兵器修理部首创, 对于决策和执行性的活动措施也非常有帮助，很适合在做项目之前通过这个模型来梳理思路, 完善或者弥补问题.以后思考问题, 就可以按照从左到右的顺序来进行思考.对于技术人员来说, 7个单词可以对应如下解释:who: 需...
2019-09-14 17:51:38
16157
原创 React源码分析（二）=> Reac初次渲染分析
Reac初次渲染分析源码基于React 16.8.6, 内容极长, 必须配合源码一起来看单步调试的例子: `ReactDOM.render('hello', document.getElementById('root'))`;下文基于这个例子来一步一步分析.
2019-07-02 21:28:54
5450
3
原创 React源码分析（一）=> scheduler分析
`scheduler`这个包主要是在react做diff做任务分配机制, 核心机制类似于[requestidlecallback](https://developer.mozilla.org/zh-CN/docs/Web/API/Window/requestIdleCallback),>`window.requestIdleCallback()`会在浏览器空闲时期依次调用函数， 这就可以让开发者在主事件循环中执行后台或低优先级的任务，而且不会对像动画和用户交互这样延迟敏感的事件产生影响。
2019-06-08 19:11:55
1524
1
转载 浏览器使用postMessage实现零延时定时器
原文地址: https://dbaron.org/log/20100309-faster-timeouts作者: David Baron浏览器零延时定时器 (function() { var timeouts = []; var messageName = "zero-timeout-message"; // 类似setTimeout,...
2019-06-05 16:15:00
1644
原创 如何发布npm包
文章目录1. 注册账号2. 准备包内文件3. 发布包4. 更新包5. 补充：包版本语法规则及安装时前缀~，^含义5.1. X.Y.Z - A.B.C 连字符范围5.2. ~X.Y.Z 波浪线范围5.3. ^X.Y.Z 脱字符范围1. 注册账号前往npm官网注册账号 https://www.npmjs.com/2. 准备包内文件新建一个文件夹，终端进入该路径, 输入命令初始化npm ini...
2019-05-26 12:34:14
745
转载 JavaScript设计模式读书笔记（五）=>架构型设计模式，MVC，MVP，MVVM
这节书中讲的个人感觉不是很清晰。。。还是转载一篇大神的把原文链接：http://www.ruanyifeng.com/blog/2015/02/mvcmvp_mvvm.html作者：阮一峰日期：2015年2月 1日文章目录1. MVC1.1. 互动模式1.2. 实例：Backbone2. MVP3. MVVM1. MVCMVC模式的意思是，软件可以分成三个部分。视图（View）：...
2019-05-24 14:19:56
754
原创 JavaScript设计模式读书笔记（四）=> 技巧型设计模式
javascript设计模式读书笔记1. 节流模式这个单独找了搞了篇文章https://blog.youkuaiyun.com/c_kite/article/details/904467252. 惰性模式减少每次代码执行时的重复性的分支判断，通过对象的重定义来屏蔽原对象中的分支判断。下面来个浏览器的事件绑定兼容问题例子：...
2019-05-23 12:55:56
698
转载 javascript防抖（Debouncing）和节流阀（Throttling）
中文原文链接： https://jinlong.github.io/2016/04/24/Debouncing-and-Throttling-Explained-Through-Examples/英文原文链接： https://css-tricks.com/debouncing-throttling-explained-examples/1. 序言防抖（Debounce）和节流（thrott...
2019-05-22 16:35:19
1079
原创 JavaScript设计模式读书笔记（三）=> 行为型设计模式
javascript设计模式读书笔记模板方法模式父类定义一组操作骨架，而将一些实现步骤推迟到子类中。这节自己没有想到很好用到生产中的例子// e.g.const Alert = function (data) { this.content = data.content; this.panel = document.createElement('div'); this.pane...
2019-05-21 17:39:56
532
原创 JavaScript设计模式读书笔记（二）=> 结构型设计模式
javascript设计模式读书笔记外观模式这个很简单，就是指当一个复杂的系统提供一系列复杂的接口方法时，对接口的二次封装隐藏其复杂性。// e.g.const api = { getabc: () => { // 调用各种函数 // 处理很多 return 'gkd'; }}适配器模式一样很容易理解，将一个对象的方法或者属性转化为另外一个接口，以满足用户的需...
2019-05-08 14:52:03
424
原创 JavaScript设计模式读书笔记（一）=> 创建型设计模式
简单工厂模式为了尽量减少地创建全局变量，同一类对象在不同需求中的重复性使用。通过对简单工厂来创建一些对象，可以让这些对象共用一些资源而又私有一些资源。对于简单工厂模式来说，它的使用场合通常也就限制在创建单一对象。// e.g.function createPop(type, text) { const o = {}; o.content = text; o.show = func...
2019-05-06 11:15:56
606
原创 使用canvas给图片增加滤镜
类似操作像素的博主还写过一篇文章：原生JavaScript + Canvas实现图片局部放大器1. 效果图2. 实现原理滤镜效果主要使用的均为canvas的getImageData以及putImageData。（以上两个api详细介绍可以点击蓝色链接，跳转到MDN查看）操纵getImageData函数返回的ImageData图片的像素信息来给图片增加滤镜效果。2.1 负片滤镜负片滤...
2019-04-26 19:42:19
1983
1
原创 原生JavaScript + Canvas实现图片局部放大器
文章目录1. 效果图2. 原理2.1. 拖拽放大2.2. hover放大3. 代码1. 效果图有两种放大模式，分别为拖拽放大以及单纯的hover放大，已下是效果图：2. 原理两种局部放大效果主要使用的均为canvas的getImageData以及putImageData。（以上两个api详细介绍可以点击蓝色链接，跳转到MDN查看）操纵getImageData函数返回的ImageDa...
2019-04-26 15:00:55
3443
原创 JavaScript拖动文件上传并展示缩略图代码示例
最近又温习了一下H5的知识，因此小小整理一下效果图asd那个就是文件上传请求说明此处应用到的知识点只要是H5的拖放操作，有两种缩略图展示方式，一种为使用URL，另一种是使用FileReader,详情见下面代码代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8">...
2019-04-16 13:28:27
815
原创 前端人脸识别--两张脸相似度
博主才疏学浅, 刚研究此项目没多久, 以下内容主要以实用角度, 略带一些概念自己的理解, 如果有错误, 麻烦大佬们多多指点.代码传送门, 安装即用, 记得给老弟点个starhttps://github.com/TheKiteRunners/face-recognition-browser测试, 用下文章地址, 稍后补齐文章效果图...
2019-02-23 13:12:31
4975
3
原创 pre-commit使用commit之前的检测办法
npm地址: https://www.npmjs.com/package/pre-commit第一步安装pre-commit包npm install pre-commit --save-dev第二步修改package.json, 增加pre-commit字段// 例子, 在提交之前运行tslint "scripts": { "tslint-fe": "tslint -c ...
2019-02-16 11:42:24
4024
原创 Session, Token和Cookie的区别
文章目录1. Session 与 Cookie的区别及关联关系1.1. Cookie原理1.2. Session原理1.3. 总结2. token1. Session 与 Cookie的区别及关联关系cookie数据存放在客户的浏览器上，session数据放在服务器上(不同容器, 不同框架存储的位置不同, 可能是内存, 可能是文件, 也可以持久化储存)1.1. Cookie原理Cookie...
2019-01-24 14:48:17
1050
转载 Service Worker概念和应用介绍
Service workers 本质上充当Web应用程序与浏览器之间的代理服务器，也可以在网络可用时作为浏览器和网络间的代理. Service worker是一个注册在指定源和路径下的事件驱动worker。它采用JavaScript控制关联的页面或者网站，拦截并修改访问和资源请求，细粒度地缓存资源。你可以完全控制应用在特定情形（最常见的情形是网络不可用）下的表现。Service worker运行...
2019-01-15 16:28:41
12325
原创 MongoDB入门系列(四) ===> 应用补充
1. 数据库引用可以在一条数据里面, 保存相关数据库的引用格式: { $ref : , $id : , $db : }三个字段表示的意义为：$ref：集合(表)名称$id：引用的id$db: 数据库名称，可选参数例:// 有一条这样的数据{ &quot;_id&quot;:ObjectId(&quot;53402597d852426020000002&quot;), &quot;address&
2019-01-12 15:05:32
584
6
原创 MongoDB入门系列(三) ===> 基本操作:增删改查
数据库创建数据库语法: use DATABASE_NAME&amp;amp;amp;amp;amp;amp;gt; use gkdswitched to db gkd但如果不插入数据, 数据库是显示不出来的.db.集合名(表名).insert({key: value})删除数据库&amp;amp;amp;amp;amp;amp;gt; use 数据库名&amp;amp;amp;amp;amp;amp;gt; db.dropDatabase
2019-01-08 13:12:29
609
原创 MongoDB入门系列(二) ===> 创建用户
本文代码测试环境: win10, MongoDB 4.0.5刚安装好的mongodb会提示:2019-01-05T11:22:42.470+0800 I CONTROL [initandlisten] ** WARNING: Access control is not enabled for the database.2019-01-05T11:22:42.470+0800 I CONTR...
2019-01-05 13:00:11
772
2
转载 MongoDB入门系列(一) ===> 概念解析
学习笔记记录, 内容出自菜鸟教程http://www.runoob.com/mongodb/mongodb-databases-documents-collections.html文章目录和sql术语的对比数据库常用命令1. &amp;quot;show dbs&amp;quot; 命令可以显示所有数据的列表2. 运行&amp;quot;use&amp;quot;命令，可以连接到一个指定的数据库3. 执行 &amp;quot;
2019-01-04 15:04:53
570
原创 TypeScript与JavaScript不同之处系列(九) ===> 命名空间, 三斜线指令
本系列目的: 列出TypeScript与JavaScript的不同点, 缩小文档内容, 提高学习速度. 原文档地址: https://www.tslang.cn/index.html
2019-01-02 14:00:36
1142
原创 2018年总结, 2019年规划
今天是19年的1月1日, 在家里写下的这篇文章, 今天天气还算不错, 还能看得见填空的蓝.2018年回顾18年四处奔波, 从大三升到了大四.从18年的1月份我就开始了实习生活, 1月6号去的北京网易有道生活了三个月, 住在回龙岗那边; 每天过的很开心, 当初还吐槽过周边环境太偏僻, 不过这么回头一看其实还是不错的.18年4月份我结束了北京的实习生活回学校继续上完还没上完的课程; 从4月份到...
2019-01-01 11:18:27
4064
2
原创 TypeScript与JavaScript不同之处系列(八) ===> 高级类型
本系列目的: 列出TypeScript与JavaScript的不同点, 缩小文档内容, 提高学习速度. 原文档地址: https://www.tslang.cn/index.html这节内容比较多, 但也很实用文章目录高级类型交叉类型联合类型（Union Types）类型保护用户自定义的类型保护typeof类型保护instanceof类型保护判断nullnull类型可选参数和可选属性类型别名接...
2018-12-31 15:31:47
1094
原创 TypeScript与JavaScript不同之处系列(七) ===>类型推论, 类型兼容性
本系列目的: 列出TypeScript与JavaScript的不同点, 缩小文档内容, 提高学习速度. 原文档地址: https://www.tslang.cn/index.html类型推论基本let x = 3; // 推断x为数字let zoo = [new Rhino(), new Elephant(), new Snake()]; // 推断为联合数组类型 (Rhino | El...
2018-12-30 12:53:52
565
原创 TypeScript与JavaScript不同之处系列(六) ===>枚举
本系列目的: 列出TypeScript与JavaScript的不同点, 缩小文档内容, 提高学习速度. 原文档地址: https://www.tslang.cn/index.html枚举简单使用enum Direction { a = 3, b, c, d} // 手动赋值, b c d的值分别为4, 5, 6enum Direction { a, b, c, d} // 默认赋值, a...
2018-12-29 14:50:53
939
原创 TypeScript与JavaScript不同之处系列(五) ===> 泛型
本系列目的: 列出TypeScript与JavaScript的不同点, 缩小文档内容, 提高学习速度. 原文档地址: https://www.tslang.cn/index.html泛型简单使用泛型解决的问题: 一种方法使返回值的类型与传入参数的类型是相同的. 下面是小例子:function identity&lt;T&gt;(arg: T): T { return arg;}...
2018-12-29 12:55:45
1034
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人