- 博客(513)
- 资源 (8)
- 收藏
- 关注
RSS订阅
原创 使用微任务来实现缓冲队列
Javascript的所有的任务分为两种:在主线程上排队执⾏的任务，只有前⼀个任务执⾏完毕，才能执⾏后⼀个任务同步任务>微任务>宏任务以上内容参考:js中的同步和异步，宏任务和微任务，async和await - 百度文库我们可以明确知道 微任务的执行是低于同步任务的，有了这个概念后，对后面的内容理解就更加容易了。现在value变化一次时候，就会马上更新一下dom上面的doSomeThing函数的执行，是处于主线程中的，也是同步任务，是堵塞的，也是马上执行的。所以我们得把目光放到异步任务上
2022-06-11 19:13:14
404
2
原创 避免异步任务竞态更新-已过期的不再允许更新
这个概念在前端里面其实比较少听到，但是其实我们是有遇见过的，并且很常见。只是翻遍了前端书籍都很难到对这个概念的解释。有幸读到霍春阳的《vue.js设计于实现》，真的是三生有幸有代码①如下:let res=null;function async update(){res=await Api.get(“someThing”);return res;}var A=update();// 假设返回结果为avar B=update();//假设放回结果为b假设受到网络波动的..
2022-05-14 13:23:05
430
原创 react Dva.js框架分享
Dva.js出现的原因:React React 专注解决视图层问题，UI = f(data)只提供简单的setState手动更新 数据来触发视图更新，对多组件通讯或需要全局状态管理的支持不够健全，也缺乏computed这种生成组合变量的功能以及对某个组件变量的watchDva就是对react状态管理方面进行拓展依赖:redux提供功能:1.状态管理2.异步加载3.提供集成环境应用层面的语法:es6 Generator它简化了 redux 的使用，并且.
2021-11-14 06:34:50
1897
原创 wap 横屏适配和竖屏适配的通用方案
这个话题应该能聊的东西挺多的，从16年做手机端开始就研究，也写了两篇博客来记录过（但是受限于但是的经验和认知，现在看起来不是特别清晰）。为什么今天会继续这个话题呢，在做了reactnative和之前小游戏横屏页面后，我觉得有必要总结一下。本篇博客，最终针对wap横屏和竖屏给出两个通用的适配方案，rn上面可能实现方式和web的不大一样，但是思路逻辑是一样的。从生产流程来考虑，适配这个东西，产品经理和设计都是需要考虑的，相对传统pc设计，移动端能展示的区域比较小。这个就要求设计出来的产品（.
2021-03-18 20:07:00
1990
2
原创 react-native 表单校验库 react-native-validator
npm i react-native-validator说明这是一个类似jQuery.validator的表单校验工具点击查看demo提供两种常用的校验方式（1.点击校验所有表单元素通过就提交，2.在输入表单过程中自动验证，如果所有表单验证通过按钮高亮可点击提交）你可以覆盖所有样式支持动态表单校验(包括数组和对象)目前校验规则是写在elFormItem里面的，暂时不考虑在elForm上加MP4演示需要科学上网，你也可以下载仓库里面的video.mp4如果你npm下载后使用报错，建议拷贝包
2020-06-18 00:58:25
2301
原创 vue指令以及dom操作
“AngularJS 通过被称为指令的新属性来扩展 HTML。AngularJS 通过内置的指令来为应用添加功能。AngularJS 允许你自定义指令。”这是我最初接触“指令”这个词。还记得那时候，ng大行其道的时候，我特别好奇怎么给一个div加一个"ng-app" 就能解决这么多问题。后来随着前端工作的深入，我用了jq的data-attr并且学会了jq的插件使用。但，这这并不能让我把它“指令...
2017-02-19 15:13:35
16393
原创 vue 动态替换父组件
替换父组件？？什么鬼？？？这个场景的确很少见！！不过我们要说的的确是要替换父组件！！！！！！就是子组件内容不变但是父组件变化我们要把父组件替换成其他的，虽然这种场景不大可能遇到，但是爱转牛角尖的我还是决定试一试！！
2024-08-30 00:49:55
407
原创 flex-basis实现min-width和max-width
flex-basis是定义flex容器子元素的基础宽度的，这个宽度回受到flex-shrink和flex-grow的影响例如设置了子元素flex-basis: 200px，这不一定子元素的宽度就等于了200px，还要看另外两个属性以及父容器的宽度的影响。
2024-08-29 08:52:18
272
原创 css rem之2024
为了避免使用js计算，我看到有些网站时用媒体查询给html设置fontSize的，这个方式也不失为一种解决方式，但是需要维护好几个设备宽度，并且并不全面，虽然问题不大，但是并不够完善。这个html fontsize的大小是通过js动态计算的，而这个js的运行时晚于html渲染的，所以会导致一个问题，进入页面时候会看到页面整体缩放一下。我们同一家公司里面的设计稿肯定必须得统一一个标准的，目前主流就是750，如果出现不同尺寸饿设计稿，这时候就应该是工作流程活着标准上面出现了什么问题了，
2024-08-10 19:08:48
515
原创 移动网页缩放。 meta name=“viewport maximum-scale知多少
这个viewport熟悉有哪些，我们直接从文档可以查阅的到，也可以很清晰的明白它所表达的内容文档控制页面允许放大的倍数。设置一个低于3的值将不具备无障碍访问性。最小值是0.1。最大值是10。默认值为1。负值会被忽略。文档说最小值是0.1，其实我们可以设置0的。
2024-08-10 18:45:37
343
原创 uniapp-小程序命令行打包上传
直到看到{"_status":"done","_msg":"upload","_id":"xxx"}，整个项目上传成功。key是单独文件放在某个目录里面,在上面updated函数里面给配置配置好读取的key的目录文件。字段，但是注意这种写法需要你严格遵照 JSON 的格式来写。上传需要配置小程序的key以及本次上传的改动说明，其他就是。同级的) 根目录中存在这个文件，那么它会被。上传过程中会自动的输出log，配置文件，如果项目的 (和。
2024-08-04 16:47:49
533
原创 图-基础概念
如果两个订单v，w，只能由v向w，而不能w向v，那么我们就把何种情况叫做一个从v到w的有向边。v也被陈作初始点，w也被称为终点。这种图也被称为有向图。通过一个二维数组G[N][N]表示N个点到N-1编号，通过邻街矩阵可以立即看到两个订单直接是否存在一条边。如果v和w是没有顺序的，从v到达w和从w到达v是完全相同的，这种图就叫做无向图。图是一种抽象的数据类型，在图中的数据元素通常称作。，V是所以定点的集合，E是所有边的集合。上面的set是用来做去重的。结果:0,1,2,3,4。
2024-08-04 10:39:02
296
原创 网页打开摄像头录制视频，下载和上传，支持手机端，视频压缩
也可以配置视频分辨率来压缩，这不一定可以拿到完全一致的分辨率，设备不一样结果不一样（会尽可能的接近，所以改小是有用的），但是分辨率过小时候（视频也会变模糊），改分辨率后可以看到同样20s情况下文件变小了，如何看保存的分辨率有没有变，可以用这个网站直接在线看。直接使用上面的代码生成的文件可以会略大，可以修改帧率来降低文件大小，这不会影响清晰度，只会“掉帧”，压的严重可能会卡卡，参考。向下兼容，如果不支持上面的api只能使用input标签调用原生的摄像头，然后上传前判断下长度和文件大小。
2024-07-03 15:05:34
475
原创 await-to-js，promise错误拦截
今天介绍一个 npm 包 ——。它可以有效地帮助我们写出健壮的异步逻辑，降低异步编写成本。众所周知，Promise 是 es6 当中一个非常方便的流程控制对象，大大简化了异步逻辑的编写。我们可以使用await来让异步代码像同步代码一样写将异步的逻辑用近似同步的语法表达了出来，连回调都消失了，更加清晰易读，这是件很棒的事情。
2024-06-14 15:38:26
425
原创 ts 字符串不能做索引异常提示 type because expression of type ‘string‘
let c=a[b]就会爆这个错误，因为在编译器看来b是一个未知的东西，它不属于a下面的任何一个属性b或者c，所以我们需要告诉它。
2024-05-25 09:09:21
259
原创 es6 class给私有集合_options里面的所有属性添加get,可以直接访问obj.xx下面的属性，而不需要obj.options.xx
在这个例子中，BaseWithOptions类有一个_options属性和一个，后者接受一个options对象作为参数。类还包含一个静态方法，该方法遍历_options对象的属性，并为每个属性在实例上定义一个getter。当的子类（如Stuff）被实例化时，会调用来调用基类的构造函数，并在此过程中设置getter。因此，子类的实例可以直接访问options对象中的属性。
2024-05-09 09:41:40
272
原创 element plus el-date-picker type=“datetime“ 限制年月日 时分秒选择
是不是小时就是disabled-hours,依此类推其他就是disabled-minutes。上面的时间组件很明显和el-time-picker一样，我是这样猜到的，那小时，分钟，秒呢？它提供的disabled-date给我们来限制日期选择。
2024-04-18 11:35:50
973
1
原创 根据2个坐标+运动速度，计算速度分量，实现小球方向运动
为正，球将向右移动；如果为负，球将向左移动。这个值的大小决定了球在X轴方向上移动的快慢。通过不断更新球的位置（例如，）在X轴和Y轴方向上的速度分量。这些分量是基于球的角度（代表了球在X轴方向上的移动速度。），你可以模拟球在水平方向上的移动。在给定的代码片段中，
2024-04-14 21:34:51
506
原创 XmlHttpRequest responseType: ‘stream‘ &&图片代理服务器
它是一个存在于原生对象中的属性。在 Web API 中，XMLHttpRequest对象用于发送 HTTP 或 HTTPS 请求到服务器，并接收响应。属性就是用来指定预期从服务器返回的响应数据的类型。
2024-03-13 10:06:29
953
原创 Object和Function是函数，函数都有一个prototype属性
在上面代码中，fun1、fun2、fun3 都是函数对象，obj1、obj2、obj3 都是普通对象。在 JavaScript 中，万物皆对象，你要一个吗？new Object() 啊！都有一个 prototype 属性，这个属性的指向被称为这个函数对象的。而 Object 和 Function 都是 JavaScript。当然，就好比同样为人，也区分普通人和天才。对象也是有分类的，分为。
2024-02-23 22:22:22
660
原创 Object.create和Object.setPrototypeOf区别
Object.create实现属性继承时候，重新为prototype属性赋值，同时删除原型对象的constructor属性所以需要从新更新原型对象的构造函数指向。
2024-02-23 10:44:55
260
原创 Object.create的作用，生成个对象？远远不止这些
是 JavaScript 中的一个方法，用于创建一个新对象，并使用现有的对象作为新创建的对象的__proto__（即原型）。换句话说，会执行与以下代码相同的操作：其中是一个函数，其原型属性包含了你想要新对象继承的属性。proto这里有一个使用的基本示例在这个例子中，person1对象是通过创建的，因此成为了person1的原型。这意味着person1可以访问上定义的所有属性和方法。之后，我们给person1添加了name和isHuman属性，并调用了原型上的方法。
2024-02-22 16:33:47
409
原创 __proto__和protype的区别
都是JavaScript中非常重要的概念，它们在原型链和继承中发挥着关键作用。理解它们的区别和用途对于掌握JavaScript中的对象模型和继承机制至关重要。是JavaScript中两个重要的概念，它们在对象原型链和继承中起着关键作用。
2024-02-22 09:09:22
539
原创 election 28.1.4 踩坑
这是浏览器加载和解析本地javascript时候需要一点点时间，index.html是已经读取了的，如果怀疑的话可以试下在index.html文件里面加点背景颜色，可以看到会先出现背景颜色，稍后才后内容。如果和Mac一样一个命令行，在 build的target里面配置两个arch，他会把支持两个bit的包都打到一个文件，mac却是不会。到打包后的目录，找到app.asa文件，在该目录打开终端，执行下面命令，在aaa目录下就能找到反编译后的内容。（效果一般，第一次点击图标后，好久才会出现窗口）
2024-02-17 09:43:40
1102
原创 javascript 常见的继承方式
继承是基于“类”的，在没有es6前，一的函数就充当了“类”的，构造函数的prototype上面的属性就等于实例的共享属性。
2024-01-17 21:57:24
497
原创 react setState调用为什么会触发整个组件函数的重新运行
这里的index申明是否可以省略呢，其实也可以，但是这样就得手动给App函数添加index属性，Function是Object的实现，所以它也可以有自己的属性。上面代码里面的index每次调用的时候都会递增，那setState调用时候会触发App的调用那index不是还是会继续递增么？setAge执行会导致App函数重新执行，但是age还是保存之前的结果！然后setState的执行会触发执行它的函数的重新运行，这个怎么写呢？这样无法做到index和我们useState的调用顺序保持一致！
2024-01-07 10:59:43
658
转载 Husky 格式化代码和校验 Commit 信息
Husky 是一个很有用的工具，能够利用 Git hook 在本地 Commit 时，配合 eslint 等 Linter 工具做文件的格式化，并配合Commitlint 校验 commit 信息格式，是工程化统一代码风格的一大利器。
2024-01-05 21:53:18
119
原创 webpack 5 mode的作用和区别
通过选择production或none之中的一个，来设置mode参数，你可以启用 webpack 内置在相应环境下的优化。其默认值为production。会将中的值设置为. 为模块和 chunk 启用有效的名。例如js文件里面打印。
2024-01-02 15:59:18
878
原创 useConsole的封装,vue,react，htmlscript标签，通用
之前用了接近hack的方式实现了console的封装，目标是获取console.log函数的执行（所在位置）所在的代码行数。例如以下代码，执行window.mylog(1)时候，console.log实际是在匿名的箭头函数()=>{//这里执行的}如果代码改为以下，因为log返回的是conosle.log本身，并且它并没有在函数内执行，也就是函数。
2023-12-19 10:08:17
747
转载 vue node_modules\node-sass: Command failed. 安装失败，如何解决，使用 sass 替换
在使用 vue create appName 创建 vue 项目，手动配置项目框架内容时，可以手动选择 sass/scss 的插件，之前我都是默认选 node-sass ，现在我只用 sass，让这个编译给烦透了。scss 的具体使用方法，可以参见： https://kylebing.blog.csdn.net/article/details/89738636。node-sass 的主要功能是将 sass/scss -> css ，跟 sass 的作用是一样的， sass 是 dart 语言写的，
2023-12-12 06:11:07
1024
原创 es6字符串模板之标签化模板
我们经常搞前端开发工作的都会用到。它可以保留字符串换行格式，还能接受变量。这个给前端的字符串拼接带来了非常大的方便。但是还有一种用法可能是我们平时还是没有怎么用到的。
2023-11-26 23:07:30
1465
cors，谷歌插件，破除下载图片空白
2023-07-10
程序员的数学，程序员的数学 3线性代数
2018-08-02
jqZoom放大镜,淘宝放大镜，jqZoom.js
2015-07-25
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人