- 博客(33)
- 收藏
- 关注
RSS订阅原创 全局属性title
定义： 全局属性title包含代表它所属元素的有关的咨询信息的文本， 通俗的来说， 就是一个浏览器定义的，一个具有朴素的tooltip的属性</</
2023-03-19 12:58:51
110
原创 实现一个小玩意
不知道在哪里看到的一种在页面点击就会出现字符慢慢消失的小东西 大概是这种， 我也实现了一下源码// 获取不同的内容function generateColorWrap () { let getColorIndex = null const colors = [ 'rgb(37, 116, 92)', 'rgb(71, 100, 133)', 'rgb(90, 71, 133)', 'rgb(161, 29, 51)', 'rgb(161, 77,
2021-09-25 21:44:32
133
原创 前端性能优化思路总结
前端性能优化性能优化的方向提高网页的加载速度提高运行时的性能如何提高网页的加载速度保持低代码冗余度封装公共组件库封装公共工具库或者使用成熟的类库对于引用的第三方模块，采用CDN方式引入， 不要打包到代码中充分发挥webpack等工具的treeshaking， 避免打包冗余代码对代码压缩优化对于不改变的库或者分包名，不要改变包名，充分利用浏览器的缓存功能经过这样的操作我们就得到了一份低冗余度的代码，然而这仍然是不够的，即使我们代码冗余度很低，但是如果项目足够大，仍然会造成
2021-09-22 20:54:31
128
原创 web网络安全总结
web网络安全我认为web的网络安全我们只需要关注两个方面保证我们的前端页面没有漏洞可循我们页面常见的web安全问题有：xss跨站点脚本攻击： 不要新人任何用户的输入， 能跟用户产生交互的地方都需要对参数进行转译或者过滤文件上传漏洞攻击： 校验文件格式， 后端限制存放文件路径的权限，限制运行脚本SQL注入攻击： 对用户输入进行转译， 后端采用预编译的sql，不要直接使用前端参数CSRF 跨站请求伪造anti CSRF token： 原理是从后端拿过来的html文件会在session存
2021-09-22 20:42:58
2837
原创 vue3 的依赖收集原理
总结来说： vue使用模块全局变量来进行依赖收集极简版的vue3 依赖收集源码// 以vue3 ref为例// 定义响应式对象， 对外接口 reffunction ref(value) { return createRef(value)}function createRef(value) { return new RefImpl(value)}class RefImpl { constructor(value) { this._value = va
2021-07-26 23:12:12
898
1
原创 vue3 computed详解
创建computed我们知道，computed可以传入两个参数作为computed值的getter和setter， 也可以传入一个getter函数， 此时vue会自动生成一个warn函数来作为创建computed的setterComputedRefImpl类我们使用computed时， 会使用传入的getter和setter创建一个ComputedRefImpl的实例对象， 这个实例对象缓存computed的值，并作为target被响应式系统进行依赖收集，实际上在项目中依赖computed的订..
2021-07-19 20:53:52
5138
2
原创 在不同环境下获取全局对象的各种方法总结
背景最近在读vue3的源码的时候发现在shared中的一个工具函数，以此记录， 源码如下const getGlobalThis = () => { return (_globalThis || (_globalThis = typeof globalThis !== 'undefined' ? globalThis : typeof self !== 'undefined'
2021-07-15 22:14:46
293
原创 英雄联盟客户端可以打开知道选择英雄，但是进入游戏时一直客户端无响应
麻蛋，为了考驾照请了个假，考完回来想玩一玩撸啊撸结果，客户端可以打开，英雄可以选择，但是游戏客户端一直就无响应，进不去游戏，具体表现如下经过多方排查，游戏重装，网络测试，开关加速器等等操作，最后发现在进入游戏时把原来的客户端关闭就可以进入游戏了注： 如果还是出现这种情况就比如，虽然关闭原来的客户端但是仍然进不去游戏，比如那就看看这个没错，只有网速能测试出来的才能进去o(╥﹏╥)o挂： 该死的自如，这网络直接把我心态搞崩...
2021-07-01 20:14:09
878
原创 文件下载的解决方案探索
背景再现在正在进行的项目中，由于后端涉及到网关安全控制（我也不是太懂，毕竟不是专业），我的后端搭档没有找到好的提供静态文件服务的方式，只好以流的方式向前端写入，在前端进行如下操作：前端接收blob使用URL.createObjectURL() 或者 FileReader 创建下载url使用a标签 href， download click() 来进行下载但是这种方式是有缺点的对于开发者来说，需要配合xhr方法来编写，增加代码量只有拿到所有的二进制字节数才能进行转化url，在浏览器上才有可能
2021-06-24 00:43:16
147
原创 vue3+typescript在vscode eslint与prettier的函数空格格式化问题
在vue3中使用typescript时，<script lang="ts"></script>在定义function 时出现函数名后空格被格式化掉的问题原因是因为eslint的格式化与prettier有格式冲突，perttier没有关于函数名空格的配置，默认是函数名后不保留空格，所以在vetur配置中不可以使用prettier插件来格式化代码，而要使用vscode自带的vscode -typescript // javascript "vetur.forma
2021-05-16 21:48:00
4993
原创 踩坑 - koa2如果koa-router的各项配置都正确，但是访问时却是404
问题： koa2如果koa-router的各项配置都正确，但是访问时却是404解决方案： 看看调用了next（）的中间件是否没有加 await
2021-03-25 21:33:06
3218
原创 uni-app 第三方登录注册流程
async otherLogin(e) { const type = e.target.dataset.logintype // 使用uni.login获取微信或者qq，微博等第三方登录信息, weixin, qq await uni.login({provider: type}) // 得到用户信息详情 const userinfo = await uni.getUserInfo({provider: type}) // 把用户信息存入缓存 c...
2021-03-25 21:30:07
984
原创 二分查找及其变种
https://leetcode-cn.com/problems/find-first-and-last-position-of-element-in-sorted-array/solution/yi-wen-dai-ni-gao-ding-er-fen-cha-zhao-j-ymwl/转自leetcode， 仅作记录作者主页 https://leetcode-cn.com/u/yuan-chu-de-suan-fa-xiao-wu/
2021-03-22 22:11:17
78
原创 node-写入文本log的小函数
codeconst fs = require('fs')const { EOL } = require('os')// 使用闭包保存流对象const writelog_generator = function (path) { let writeStream = null return function writeLog(log) { fs.open(path, 'w', function (err, fd) { if (err) {
2021-03-13 22:40:37
113
原创 node-简单的TCP聊天服务器
codeconst net = require('net')const server = net.createServer()let sockets = []server.on('connection', function (socket) { sockets.push(socket) socket.on('data', function (data) { sockets.forEach(other => { if (other !
2021-03-13 22:18:18
62
原创 uniapp - animation动画数组无效
问题描述： 在开发uniapp时发现，在使用数组来存储动画的场景下动画总是不生效通过多次尝试发现1. 在方法中临时创建的animation实例导出的数据不是reactive的2. 数组并没有监控到元素对象的变动解决方法把animation实例定义在data中， 在onload中初始化，在方法中使用，可以解决这个问题猜想原因可能是在data中的animation实例会被vue监控，从而触发animation实例导出数据的监控。 后面有待确认其原因export default { d
2021-03-09 22:44:44
1482
原创 uniapp Vue.prototype绑定属性无法在微信小程序中直接使用 报[渲染层网络层错误]
最近在做uniapp的时候发现在h5上运行正常的代码，在微信小程序上测试的时候报错了 [渲染层网络层错误] Failed to load local image resource /pages/index/undefined/images/carousel/batmanvssuperman.png the server responded with a status of 500 (HTTP/1.1 500 Internal Server Error) 查看报错发现是在main.js中给Vue的原
2021-03-07 22:55:43
3804
1
原创 盘点遍历javascript对象的方式
CODEconst proto = { type: 'human', [Symbol('p')]: 'created'}const person = Object.create(proto, { name: { value: 'zhangsan', enumerable: true, writable: true, configurable: true }, sex: { enume
2021-03-03 22:46:48
118
1
原创 一个前端经典的面试题： new关键词
前言在前端的面试中，有一道经典的题： 在new对象的过程中发生了什么在javascript中， 我们总是称用于创建对象的函数为构造函数。 其实，没有构造函数，只有函数的构造调用，构造函数名称的首字母大写只是一种标识，并没有任何实际作用codeconst proto = { sayHello() { console.log(`名字： ${this.name}; 年龄： ${this.age}`) }}function Person() { const _t
2021-02-20 22:49:58
358
原创 判断javascript对象是否为数组
instanceofMDN解释：instanceof 运算符用于检测构造函数的 prototype 属性是否出现在某个实例对象的原型链上。这句话的意思就是instanceof的原理其实是检查构造函数的原型是否在目标的原型链上。请看如下代码function Person() { this.name = 'zhangsan'}Person.prototype = Array.prototypeconsole.log(new Person() instanceof Array ) //tru
2021-02-19 22:02:09
143
原创 node.js 如何合并被分割的小片片
FBIWRAINGCODEasync function mergeFile(catalogue /* 被分割文件存在的路径 */) { try { const fileStream = await fs.promises.opendir(catalogue) const file = await fileStream[Symbol.asyncIterator]() let writer = null for await ( fil
2021-01-23 16:17:08
561
原创 完整版深度复制
function deep_copy(src) { const type = src === null ? '' : Object.prototype.toString.call(src) const method = getCopyMethod(type) return method(src)}function getCopyMethod(type) { let method function copyObject (src) { // 拿s.
2021-01-23 15:07:17
63
原创 递归深度复制的函数
复制类型：基本类型： String， Number， Boolean， undefined，null引用类型： Array，Object没有做Map和Set哦function deep_copy(src) { if (typeof src !== 'object' || src === null) { return src } else { let target if (Array.isArray(src)) {
2021-01-21 21:21:49
85
原创 同步与异步的区别
同步与异步的区别同步代码： js为脚本语言，对于同步代码来说，自上而下进行解释执行异步代码： 对于一个任务，分为多个片段来进行执行， 先执行一段，如果碰到比较耗时间的操作，比如本地或者网络io请求。在只想第一段开始进行io之后，把执行权交由其他任务，当io完成后在来执行后半段的任务（io操作比较耗时，在系统进行io时，主线程是空闲的）console.log('sync1') // 同步任务setTimeout( // 宏任务 () => { console.log('
2021-01-20 21:28:27
1475
原创 使用Proxy和Reflect实现观察者模式
function createObsever(obj) { // 观察者 const observers = [] //使用proxy代理对象，使用Reflect保证默认行为 const proxyObj = new Proxy(obj, { set(target, p, value, receiver) { Reflect.set(target, p, value, receiver) observers.forEa
2021-01-18 22:18:30
149
原创 lodash - getTag源码分析
lodash - getTag源码分析说明：大家可以很简单的看出来这个方法是一个获取类型的方法下面是lodash getTag的源码const toString = Object.prototype.toString/** * Gets the `toStringTag` of `value`. * * @private * @param {*} value The value to query. * @returns {string} Returns the `toStringTag`
2020-12-31 22:04:14
202
原创 可能是最新的两边宽度固定中间自适应布局方式的总结（手动狗头）
话不多说，showCode<template> <div class="elmentArrage"> <div class="part1"> <div class="left"></div> <div class="center"></div> <div class="right"></div> </div>
2020-12-27 20:17:56
84
原创 node.js的下载接口
#如何用node做一个下载小片片的接口以koa2为例服务器端async function downloadAvi (ctx, next) { // 默认为json, 需要设置为二进制流哦 ctx.set('Content-type', 'application/octet-stream') // 创建一个文件读取流 const reader = fs.createReadStream(path.resolve('service/番号.avi')) // 发送 ctx.body
2020-12-23 21:54:35
852
原创 手写 call apply bind
手写 call apply bindcallFunction.prototype.my_call = function (context, ...args) { if (typeof context === 'undefined' || context === null) { context = window } context.fn = this const result = context.fn(...args) // 也可以不定义args直接使用ar
2020-12-21 23:22:05
205
1
原创 原型链的小坑-属性屏蔽
原型链的小坑-属性屏蔽javascript的原型是面试必会问到的知识点，当一个对象被创建出来的时候，就会被赋予一个非空的对象作为[[prototype]]原型链的终点是Object.prototype当我们执行如下代码的时候，我们创建了一个b对象并且以pro为原型，按照原型链的规则，当我们调用b.a时，在b中并没有a这个属性所以会查找他的原型链，在他的原型链中找到了这个属性，所以正常访问，当b中有这个属性的时候，就会访问本对象的a属性而对他的原型中的同名属性进行了屏蔽const pro
2020-12-02 22:21:57
269
原创 Javascript Number类型那些你可能不知道的小细节
#Javascript Number类型那些你可能不知道的小细节###你会如何实现一个数字比较的Function 我想所有的js开发者都应该可以想到 function simpleCompaire(num1, num2) { return num1 === num2 }这样的代码是可以实现部分数字的比较。注意我说的是部分，也就是说这个函数是有bug的如果我们这样调用这个函数 simpleCompaire(0.3, 0.1 + 0.2)) //
2020-11-16 22:51:29
129
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人