前端纸非机的博客_JavaSvript,JavaScript,flex

前端性能优化

事件委托事件委托（也叫事件代理）利用了事件冒泡，把监听函数绑定在父容器上。在触发DOM上的某个事件时，会产生一个事件对象event，这个对象中包含着所有与事件有关的信息。使用事件委托的优点：a.减少DOM操作，使事件处理时间减少。b.减少内存空间的使用，提升性能。简单例子：javascriptletmyUl=document.getElementByld("myul");myUl.addEvent

加载

服务器

数据

优化

性能优化

置顶原创推荐 2022-04-24 12:13:15 321 阅读 yyds干货盘点

css有了css变量这个神器，我再也不需要less和sass了

用过sass或less的都知道，主要他们可以有嵌套和变量以及函数功能，其实在原生css中，已经开始逐渐支持，诚然目前只有你我熟知，而他人还处在萌芽中，了解css变量，你会发现CSS从此变得异常强大。变量的声明声明变量的时候，变量名前面要加两根连词线（）css//局部声明body{foo:ed145b;bar:F7EFD2;}//全局声明:root{foo:ed145b;bar:F7EFD2;}例如

css

javascript

f5

字符串

ide

置顶原创推荐 2021-11-12 15:11:48 6726 阅读 1收藏

uni-app自定义摄像头拍照添加人物框

一、效果效果种包含相册选择，拍照，切换摄像头。!(https://s4.51cto.com/images/blog/202110/26171708_6177c794de4ad86491.gif?xossprocess=image/watermark,size_14,text_QDUxQ1RP5Y2a5a6i,color_FFFFFF,t_100,g_se,x_10,y_10,shadow_20,t

uni-app

置顶原创推荐 2021-10-26 17:17:30 3921 阅读 1点赞 1收藏

❤️一个聊天室案例带你了解Node.js+ws模块是如何实现websocket通信的

?1、前言大家好，我是纸非机。倘若每天都是无尽的知识点，那这样的学习想必会很枯燥无味吧。今天就给大家带来个比较有成就感的玩意：Node.js+ws模块来制作一个简易聊天室！文末有代码地址。!效果图(https://s4.51cto.com/images/blog/202110/18171520_616d3b2840f8e97391.gif?xossprocess=image/watermark,

websocket

nodejs

置顶原创推荐 2021-10-19 11:43:35 2568 阅读 1评论

一篇超详细的vue项目前端自动化测试教学！

为什么需要写前端自动化大部分企业为了追求开发效率，所以并没有去强制要求员工写前端自动化测试的代码。另一部分企业则会要求前端开发额外写前端自动化测试。那么写和不写到底有哪些区别呢？不写前端自动化测试代码：修改某个模块功能时，其它模块也受影响，很难快速定位bug多人开发代码越来越难以维护不方便迭代，代码重构困难代码质量差，参差不齐增加自动化测试后：我们为核心功能编写测试后可以保障项目的可靠性强迫开发者

自动化测试

单元测试

e2e

置顶原创推荐 2021-10-09 13:21:28 10000+阅读 16点赞 2收藏 4评论

细谈Axios中那些不为人知的秘密！一文读懂Axios

Axios介绍1、Axios是什么？Axios是一个基于promise的HTTP库，类似于jQuery的ajax，用于http请求。可以应用于浏览器端和node.js，既可以用于客户端，也可以用于node.js编写的服务端。2、Axios特性（1）支持PromiseAPI（2）拦截请求与响应，比如：在请求前添加授权和响应前做一些事情。（3）转换请求数据和响应数据，比如：进行请求加密或者响应数据

Axios

前端

置顶原创推荐 2021-09-29 14:55:47 10000+阅读 1点赞 2收藏

❤️十分钟快速学会使用Nodejs全栈开发微信公众号【建议收藏】

一、准备1.注册微信订阅号2.注册小程序测试号3.sunnyngrok工具安装及注册账号注意：sunnyngrok的原型是ngrok，不过ngrok是国外的，sunnyngrok是国内的一个私服，速度更快了，主要作用是域名转发，模拟公网ip和端口，甚至可以配置给客户在公网上展示项目。地址：http://www.ngrok.cc/,进去后注册开通隧道，有免费的。记住：一个微信号只能注册一种微信产品，

微信公众号

NodeJs

JavaScript

Vue

置顶原创 2021-09-28 00:03:47 307 阅读

❤️一起谈一谈js中的宏任务和微任务！❤️

前面面试的文章(https://root181.blog.csdn.net/article/details/120035664"面试的文章")中我们说过一道关于宏任务和微任务的题：setTimeout(function(){console.log('1')});newPromise(function(resolve){console.log('2');resolve();}).then(funct

宏任务

微任务

JavaScript

置顶原创精选 2021-09-24 10:31:15 2122 阅读 1点赞 1收藏

前端高效开发不得不知道的一些JavaScript库！

工欲善其事,必先利其器；器欲尽其能,必先得其法。函数库lodash推荐指数：⭐️⭐️⭐️⭐️⭐️Lodash是一个一致性、模块化、高性能的JavaScript实用工具库。地址：Lodash简介Lodash中文文档Lodash中文网(https://www.lodashjs.com/"Lodash简介Lodash中文文档Lodash中文网")请求库 axios推荐指数：⭐️⭐️⭐️⭐️⭐️是一个

JavaScript

高效开发

置顶原创精选 2021-09-22 19:55:02 1378 阅读 1点赞 1收藏

手把手教你在 Vue 中使用 JSX，不怕学不会！【建议收藏】

学习这篇文章希望您已经具备以下知识：1.vue.js的基本使用2.对前端三件套(html、css、js)已经可以熟练使用了文末有配套demo代码：点我直达(test1)JSX是什么JSX是一种Javascript的语法扩展，JSX=Javascript+XML，即在Javascript里面写XML，因为JSX的这个特性，所以他即具备了Javascript的灵活性，同时又兼具html的语义化和直观性

JSX

Vue.js

置顶原创推荐 2021-09-20 19:37:24 10000+阅读 1点赞 1收藏

【章节4】原项目升级到webpack5并进行配置优化全流程

以升了wepack5 再做commit 预处理的方案，也可以先commit 预处理再来乎没有。

webpack5

webpack5优化

html

git

生产环境

原创精选 2月前 373 阅读

【章节2】husky + 自动检测是否有未解决的冲突 + 预检查debugger + 自动检查是否符合commit规范

简单脚本写法，print 和 echo两者差异lint-staged 和 commit规范 commitlint 的作用和用法npx husky add 用法debugger不可以进仓库。

commitlint

lint-staged

husky

commit规范

shell

原创精选 2月前 317 阅读

【章节1】git commit规范 + husky + lint-staged实现commit的时候格式化代码

git commit规范要熟知和养成习惯lint-staged的作用和配置husky的作用和怎么写一个简单的脚本以上希望大家都能掌握，下一章节再见?！

git

husky

lint-staged

预处理

json

原创精选 2月前 243 阅读

应用到vscode

随着ChatGPT的热度持续上升，我们也不得不深刻认识到，这已经势不可挡了。我们必须去接受它，甚至是拥抱它。私信我可以获取最新包今天呢，我们要介绍的是vscode的一款插件，叫做。

chatgpt

vscode

javascript

补全

解决方法

原创 2月前 92 阅读

【MAC】nvm安装和使用

这些代码的作用是定义一个变量$NVM_DIR，然后检查该目录下是否存在nvm.sh脚本文件，并在文件存在的情况下调用它。touch命令

macos

linux

bash

nvm

git

原创 2月前 119 阅读

【章节3】Webpack5 对比 Vite，孰强孰弱？

webpack

前端

webpack5

vite

Webpack

原创 2月前 170 阅读

前端开发利器-ChatGPT

scode的一款插件，叫做。

chatgpt

补全

解决方法

右键

原创 3月前 140 阅读

修改后的代码只进行了git add操作不小心给他恢复了怎么找回来

发现了很多乱码名字的文件并且没有后缀，你没有猜错，这些就是git add 过得文件，我

git

后缀

文件大小

原创 8月前 169 阅读

需求开发到一半需要改别的分支的bug该怎么办呢？（git stash 和 git commit）

在实际开发中，经常我们会遇到需求开发到一半，别的分支有bug急需解决的情况，这个时候我们改怎么办呢？有的人会说可以先提交当前分支的代码再切换到别的分支改bug，当然这样是没问题的，但是呢，在项目文件特别多的时候，我们改需求好不容易找到的文件位置，这个时候代码一提交，我们就无法看见下面的内容，导致于我们改完bug切换回来就很难分辨我们改了哪些文件了！所以这个时候我们会用上 git stash 或

git

bug

github

实际开发

项目文件

原创 9月前 86 阅读

多人协作多版本开发冲突的正确解决姿势

这里实际上用上一个关键命令：git merge --no-ff 分支名注意：无论何种情况，都绝不允许把开发、测试、预生产的代码拉到自己分支上解决冲突，因为上面有很多垃圾代码。开发环境和测试环境冲突怎么？两个分支解决冲突方式一致，都由开发人员解决。这里举例开发分支：将本地分支切换到开发分支，然后git pull 拉取最新代码（因为你是和远程仓库的最新代码冲突）git checkout

git

github

解决冲突

远程仓库

原创 10月前 165 阅读

vue3的自定义指令

除了 Vue 内置的一系列指令 (比如 v-model 或 v-show) 之外，Vue 还允许你注册自定义的指令 (Custom Directives)。1.自定义指令的目的和简单介绍自定义指令主要是为了重用涉及普通元素的底层 DOM 访问的逻辑。一个自定义指令由一个包含类似组件生命周期钩子的对象来定义。钩子函数会接收到指令所绑定元素作为其参数。举例：在某个场景下，需要一进入页面或者打开某个弹

vue.js

javascript

前端

自定义指令

生命周期

原创 10月前 418 阅读

常见遍历方法 for循环、forEach、map、filter、find、findIndex、some、every

MDN上说：map() 方法创建一个新数组，其结果是该数组中的每个元素都调用一个提供的函数后返回的结果

javascript

前端

开发语言

数组

迭代

原创 2022-09-20 20:58:32 124 阅读

企业级git工作流程

线上合并代码到develop分支，开发人员有权限，自己线上合并即可，然后jekins构建项目，结合你本地运行代码，你和后端就

git

开发环境

生产环境

原创 2022-07-25 10:04:47 143 阅读

前端面试题梳理

加了删除线的优先级较低，不常问，但也有的问。HTML相关面试题1.HTML5 有哪些新特

前端

面试

html5

客户端

服务端

原创 2022-05-31 06:40:12 137 阅读

前端路由原理

后端路由：早期传统MVC网站路由都是服务端主导，前端通过不同URL请求后端，后端框架有专门的路由模块用来匹配URL地址，

前端

javascript

vue.js

html

服务端

原创 2022-05-15 21:24:03 279 阅读

企业微信小程序从开发调试到发布的全流程

企业微信小程序和普通微信小程序两者的关系可以理解为企业微信小程序就是把普通小程序丢进了企业微信这个app里运行，企业微信小程

微信小程序

小程序

微信

原创 2022-05-15 21:21:12 1616 阅读

javascript深拷贝和浅拷贝以及实现方法(推荐)

深拷贝和浅拷贝的区别？浅拷贝：将原对象或原数组的引用直接赋给新对象，新数组，新对象／数组只是原对象的一个引用。深拷贝：创建一个新

javascript

深拷贝

数组

json

原创 2022-05-15 18:57:24 859 阅读

Proxy(代理)

Proxy用于修改某些操作的默认行为，也可以理解为在目标对象之前架设—层拦截，外部所有的访问都必须先通过这层拦截，

Proxy代理

函数调用

赋值

数据

原创 2022-05-15 18:57:16 261 阅读

class类

ES6通过class关键字定义类。class是—个语法糖，是构造函数的另—种写法。基本用法//类声明（不可重复声明）class Point { constructor(x,y){ th

class类

父类

构造函数

静态方法

原创 2022-05-15 18:56:06 98 阅读

手把手教你在 Vue 中使用 JSX，不怕学不会！【建议收藏】

学习这篇文章希望您已经具备以下知识：vue.js的基本使用对前端三件套(html、css、js)已经可以熟练使用了文末有配套demo代

javascript

vue.js

html

JSX

插槽

原创 2022-05-15 13:44:38 132 阅读

官方博客	全部文章	热门标签	班级博客
了解我们	在线客服	网站地图	意见反馈

开源基础软件社区	51CTO学堂
51CTO	汽车开发者社区

51CTO博客

12689853

前端性能优化

css有了css变量这个神器，我再也不需要less和sass了

uni-app自定义摄像头拍照添加人物框

❤️一个聊天室案例带你了解Node.js+ws模块是如何实现websocket通信的

一篇超详细的vue项目前端自动化测试教学！

细谈Axios中那些不为人知的秘密！一文读懂Axios

❤️十分钟快速学会使用Nodejs全栈开发微信公众号【建议收藏】

❤️一起谈一谈js中的宏任务和微任务！❤️

前端高效开发不得不知道的一些JavaScript库！

手把手教你在 Vue 中使用 JSX，不怕学不会！【建议收藏】

【章节4】原项目升级到webpack5并进行配置优化全流程

【章节2】husky + 自动检测是否有未解决的冲突 + 预检查debugger + 自动检查是否符合commit规范

【章节1】git commit规范 + husky + lint-staged实现commit的时候格式化代码

应用到vscode

【MAC】nvm安装和使用

【章节3】Webpack5 对比 Vite，孰强孰弱？

前端开发利器-ChatGPT

修改后的代码只进行了git add操作不小心给他恢复了怎么找回来

需求开发到一半需要改别的分支的bug该怎么办呢？（git stash 和 git commit）

多人协作多版本开发冲突的正确解决姿势

vue3的自定义指令

常见遍历方法 for循环、forEach、map、filter、find、findIndex、some、every

企业级git工作流程

前端面试题梳理

前端路由原理

企业微信小程序从开发调试到发布的全流程

javascript深拷贝和浅拷贝以及实现方法(推荐)

Proxy(代理)

class类

手把手教你在 Vue 中使用 JSX，不怕学不会！【建议收藏】