- 博客(36)
- 收藏
- 关注
原创 给gitlab项目设webhooks(Jenkins CI)
使用jenkins,监控的gitlab项目的一个分支,一旦分支有变更,就通知jenkins,jenkins执行对应的任务(自动化打包,为测试服务器代码做替换等),这样就可以节省我们很多时间本地安装Jenkinsjenkins是一个开源的、提供友好操作界面的持续集成(CI)工具系统管理=》节点管理节点 我理解的就是服务器 当你要设置任务的时候,你可以选择哪个节点上做这些任务 master是搭建jenkins的主机系统管理=》系统配置添加我们需要管理的gitlab地址.
2021-08-20 15:12:59
1167
原创 Promise.all的实现
function all(promiseArr) { if (!Array.isArray(promiseArr)) { throw new Error('promiseArr 必须为数字') } if (promiseArr.length === 0) { Promise.resolve([]) } var result = [] return new Promi
2021-06-08 14:17:36
239
原创 正则正向预查和负向预查
编写一条正则,用来验证规则:一个6-16位的字符串,必须同时包含有大小写字母和数字/*检查的时候设置一个条件正向预查(?=pattern) 意思的要匹配的字符串必须满足pattern这个条件需要注意的是:括号里的内容只是条件,并不参与真正的捕获,只是检测一下后面的字符串是否符合要求而已负向预查(?!pattern) 意思的要匹配的字符串必须不满足pattern这个条件var reg1 = /(?=^)\d{2}(?=$)/var reg2 = /^\d{2}$/// reg1 跟 reg2
2021-06-08 11:21:24
472
原创 图片懒加载
编写代码实现图片的懒加载前端性能优化的重要方案通过图片或者数据的延迟加载,我们可以加快页面的渲染的速度,让第一次打开页面的速度变快只有滑动到某一个区域 我们才加载真实的图片 这样也可以节省加载的流量处理方案把所有需要延迟加载的图片用一个盒子包起来,设置宽高和默认占位图开始让所有的IMG的src为空,把真实图片的地址放在IMG的自定义属性上,让IMG隐藏等到所有其他资源加载完成后 我们再开始加载图片对于很多图片 需要当页面滚动的时候,当前图片区域完全显示出来后再加载真实图片代码的实现/
2021-06-03 10:41:09
110
原创 在不同地方调用类的属性
/* */function Foo() { Foo.a = function() { console.log(1) } this.a = function() { console.log(2) }}// 把Foo当作类,在原型上设置实例公有的属性方法 实例.a()Foo.prototype.a = function() { console.log(3)}// 把Foo当作普通对象设置私有属性的方法 Foo.a()Foo.
2021-06-03 10:38:42
91
原创 网址正则检测
/* 在输入框中如果判断输入的是一个正确的网址例如:用户输入一个字符串,验证是否符合URL网址的格式*/function checkURL(url) { // \w 元字符用于查找单词字符。单词字符包括:a-z、A-Z、0-9,以及下划线, 包含 _ (下划线) 字符。 /* 协议 ((http|https|ftp):\/\/)? 域名 (([\w-]+\.)+[a-z0-9]+) 路径 ((\
2021-06-03 10:36:45
1106
1
原创 Object对象
/* 输出下面代码运行结果*/// example 1var a={},b="123",c=123;a[b]='b'a[c]='c'console.log(a[b]) // c 对象里面的key都是字符串console.log(a); // 因为a[123] = a["123"]// example 2var a = {}, b = Symbol("123"), c = Symbol(123);a[b]='b'a[c]='c'console.log(a[b]) // b t
2021-06-03 10:35:11
97
原创 重写indexOf方法
实现一个字符串匹配算法,从字符串 S 中,查找是否存在 T,若存在则返回所在位置,不存在则返回-1如果不用indexOf/includes等内置方法,你会如何处理let S = "zhufengstart开始zhufengend结尾HAHAHAHA";let T = "iii";~(function() { /* 使用正则的情况下的方法 */ /* function myIndexOf(data) { let str = this; let reg = new RegExp
2021-06-03 10:32:42
364
原创 转换大小写字母
转换大小写字母 如 abC 转为 ABclet str = "zhufeng哈哈哈HAHAHA"// "A".charCodeAt() 转为Unicode码// console.log("A".charCodeAt())str = str.replace(/[a-zA-z]/g,item => { // 验证是否为大写字母: // 转为大写字母看是否与原字符相等 // 对比ASCLL嘛 大写字母A-Z 为 65-90 /* if(item.charCodeAt(
2021-06-03 10:29:37
95
原创 箭头函数与普通函数的区别
常见问题箭头函数与普通函数(function)的区别是什么?构造函数(function)可以使用New生成实例,那么箭头函数也可以吗?为什么?箭头函数与普通函数的区别:箭头函数在语法上比普通函数更为简洁(ES6语法形参的默认值与剩余参数都适用于箭头函数和普通函数)箭头函数没有自己的this,他里面的this是继承函数所处上下文,没有继承函数就是window(用call,applay等任何方法都无法改变箭头函数的this的指向)普通函数的this指的是函数的调用者箭头函数没有argumen
2021-06-03 10:24:27
231
原创 数字链式相加
(5).add(3).minus(2) 使其结果为6~function(){}() 与 (function(){})() 一样的 都是立即执行函数的意思~(function() { // 每一个方法执行完后都要返回这个Number类的实例, //这样才能继续调用Number原型上的方法(链式写法) function check(n) { // 转换为数字 //Number() -- 强制转换整个参数;parseInt()/parseFloat() -- 专门将字符串转换为数
2021-06-03 10:03:21
105
原创 call和applay的区别
call和applay的区别是什么call applay 都是function原型上的方法 都是改变函数的this指向fn.call(obj,1,2,3) 参数是不定的 传给函数的参数是一个一个的传递的fn.applay(obj,[1,2,3]) 参数只有两个 传给函数的参数是用一个数组包裹起来传递的除了这两个 bind也可以改变this的指向 只不过bind不会立马执行函数 只是先改变this的指向call和applay哪个性能更好性能:call 性能要好一点别人测试过的:当给函数传的参
2021-06-03 09:58:46
861
原创 闭包的理解
1、概念闭包函数: 声明在一个函数中的函数,叫做闭包闭包: 内部函数总是可以访问其所在外部函数声明的参数和变量,即使在其外部函数被返回(寿命终结)了之后2、特点让外部访问函数内部变量成为可能;局部变量会常驻在内存中;可以避免使用全局变量,防止全局变量污染;会造成内存泄漏(有一块内存空间被长期占用,而不被释放);3、闭包的创建闭包就是可以创建一个独立的环境,每个闭包里面的环境都是独立的,互不干扰。闭包会发生内存泄漏,每次外部函数执行的时 候,外部函数的引用地址不同,都会重新创建一个新的
2021-06-03 09:54:25
2691
原创 为localStorage设置过期时间,关闭浏览器清空localStorage
我们知道localStorage是会一直保存在浏览器里面的,除非人为清除,否则会一直记录,但有些情况下我们只想让它保留几天时间,所以这次我们为localStorage设置一个过期时间.简单的说就是让它存进去的时候保留一个存入时间,获取的时候让当前时间与存入时间对比一下,看是否过期,过期了就清除这个localStorage现在根据需求封装一个Storageclass Storage { constructor(name) { this.name = 'storage'; .
2021-05-13 16:21:28
3253
原创 electron5+vue3.0搭建一个桌面应用
之前因为项目需求 需要做一个桌面应用 所以在bilibili上学习了一部分基础知识后 又参考[https://zhuanlan.zhihu.com/p/75764907]这篇博客搭建了一个electron+vue 的桌面价格查询应用,此文章记录一下搭建流程和遇到的一些问题一.electron基础知识点electron 我认为就是个浏览器 ,里面显示什么.怎么写还是跟平时的页面怎么写一样,只不过一个是用浏览器直接打开,一个是以桌面应用的方法打开准备工作1.cnpm init -y 创建pack.
2021-05-13 15:58:10
817
1
原创 前端部署到服务器上
记录一下自己从买服务器到部署的历程一、云服务器云服务购买可以在腾讯云和阿里云上面搜索云服务器,然后购买自己需要的云服务器,我买的是1核2G的 ubuntu server 公网宽带选的1M买好后 自己试一下连接自己的服务器 在cmd里输入windows上要ssh 没有的话需要自己安装openSSH我在阿里云上买的服务器,刚开始没有设置实例密码,连接之前得先去实例那里设置密码才能连接ssh 用户名@公网IP 回车 输入密码域名购买在域名选择那里,输入自己想要的域名,是否被注册,没有注.
2021-04-01 17:03:35
4217
原创 antd design vue项目按需加载和修改主题颜色
安装babel-plugin-import 按需加载模块npm i babel-plugin-import -D修改babel.config.jsmodule.exports = { presets: [ '@vue/cli-plugin-babel/preset' ], plugins:[ ['import',{ 'libraryName':'ant-design-vue', 'libraryDirectory':'es', 'styl
2021-02-26 14:04:08
1868
原创 antd design react项目按需加载和修改主题颜色
创建新的React项目1.安装 npm i -g create-react-app 安装完后 create-react-app --version 查看当前版本2.创建项目 create-react-app 项目名3.启动项目 npm start安装antdnpm i antd -S安装按需加入需要的包npm i react-app-rewired customize-cra babel-plugin-import -D修改package.json"scripts": { "st
2021-02-26 12:01:49
1716
原创 改elementUI上的进度条为动画效果
改elementUI上的进度条为动画效果第一种 改变background 背景<style>.layui-progress-bar .el-progress-bar__inner:before { content:""; width:100%; height:100%; display:block; animation:move 1s linear infinite; }@keyframes move { to { .
2020-11-10 20:02:00
6914
2
原创 解决button点击后按enter键还会响应click事件问题
点击button后 焦点还在button上面 所以按enter键还会响应click事件,要想解决这个问题,得把焦点从button上面移开document.onclick = e =>{ if(e.target.tagName.toLowerCase() === "button") { e.target.blur(); }}...
2020-11-03 15:05:39
897
原创 vue项目遇到的兼容性问题解决(IE)
记录一下之前项目所遇到的兼容性问题项目用的是https协议 前端用的是Vue全家桶+elementUI框架搭成问题一:之前项目只能在chrome上正常使用 在火狐 IE浏览器上显示空白 火狐直接阻拦了跨域请求找了半天原因,火狐浏览器是不能跨域请求的 会直接拦截请求操作,所以我就设置了proxy代理,这只是解决开发环境上的跨域问题,生产环境上还需要设置nginx代理(目前还没做到Nginx这里,后续做了再做详细的记录)// 修改config/index.js 设置代理proxyTable: .
2020-10-16 16:56:15
6464
1
原创 js监听Dom元素变化
当echarts图表要跟随父元素宽高而变化时,我们需要对他的父级元素进行监听,但是resize只能对windows窗口进行监听,对普通dom元素进行监听是不行的.1.轮循(不优雅)2.MutationObserver、ResizeObserver 有兼容性问题3.使用iframe模拟window的resize创建一个隐藏的iframe 让他与父元素的宽高相等 添加到父元素里 这样父元素宽高改变的时候 iframe也会跟着改变 然后我们监听contentWindow就可以了(注意:父元素得po.
2020-08-07 10:06:15
3072
原创 使用animate.css
安装animate.cssnpm i animate.css --save在main.js中引用animate.cssimport animate from 'animate.js'Vue.use(animated)在vue中使用直接使用animated中的动画class名,注意:必须使用animated这个class名,否则动画会无效<div class="box a...
2020-03-18 22:59:10
201
原创 vueCli脚手架安装
一、vuecli3.0安装1.全局安装vue/cli 脚手架npm i @vue/cli -g2.创建vue项目vue create [项目名称] 项目名称不能用驼峰如果windows使用Git Bash 上下箭头不生效的解决方案 ,使用winpty:winpty vue.cmd create [项目名称]3.功能选项TypeScript // 使用typeScriptPr...
2020-03-18 17:11:26
206
原创 element-ui table 二次封装
element-ui table由于最近项目中要用到 所以自己封装了一个简单的包含翻页效果的一个table组件每列的显示内容可以自定义 表头也可以自定义 点击翻页自动请求数据 列表参数基本和element-ui table组件的原生参数一样代码后面再传…...
2019-09-16 16:57:43
748
原创 less
less是一种动态样式语言,属于css预处理的范畴, 他扩展了CSS语言,增加了变量、mixin、函数等特性,使CSS更易维护和扩展less既可以在客户端上运行,也可以借助nodejs在服务端上运行less中文网 http://lesscss.cnless 编译工具koala 官网:www.koala-app.comless中文的注释以//开头的注释,不会编译到css文件中去以/...
2019-07-28 12:30:05
247
原创 随机取26个字母中的一个
function randomKey(num){ var key = "" if(!num){ num = 6 } var charArr = "qwertyuiopasdfghjklzxcvbnm" for(var i = 0;i<num;i++){ key += charArr.charAt(Math.ceil(Math.random()*25)) } return...
2019-07-16 10:13:41
2194
原创 js的rc4加密与PHP的rc4加密
rc4是对称加密js 的RC4加密function rc4(data,key){ var pwd = key || 'COwC2GiRIaouOuiQSxamm8NO8U1s1jNNWuSwteOCnM3C6gHa'; var cipher = ''; var key = []; var box = []; var...
2019-07-16 09:52:39
2026
1
原创 全局设置超时
$.ajaxSetup({ headers:{'access_token':token}, timeout:1000, complete:function(XMLHttpRequest,status){ if(status == "timeout"){ layer.alert("请求超时!") ...
2019-06-12 11:09:29
675
原创 修改form表单radio样式
<div class="main-form-block-radio"> <label class="main-form-label">数据库配置</label> <div class="main-form-block-radio"> <label class="main-step3-radio" for="mai...
2019-06-03 11:21:19
2283
原创 关闭浏览器窗口非script打开的
if(navigator.userAgent.indexOf('firefox') !== -1){ window.location.herf="about:blank"}else { window.opener = null window.open("","_self") window.close()}
2019-05-16 09:44:25
555
原创 Git 基本操作
提交代码先查看 分支状态git status如果 有新增 文件 没有则跳过 2 git add .确认 修改无误 后提交代码 并 添加描述git commit -am '[对本次提交的简短描述]'#例 : git commit -am '这是一句简单的描述'拉取远程仓库 对应分支 代码 查看 是否有文件冲突git pull [仓库名] [...
2019-05-10 09:55:45
41
原创 flow 安装
npm安装编辑器npm install --save-dev babel-preset-flow然后在项目的根目录下创建**.babelrc**文件 并在里面写入 “presets”:["flow]{ "presets":["flow]}安装flownpm install --save-dev flow-bin添加"flow"在package.json文件下的scripts字...
2019-04-28 17:47:06
1087
原创 js导出表格\csv\zip格式文件
最近工作运用到导出zip文件,把自己运用到的方法在这里记录一下用js导出zip文件具体JSZip的运用请参考https://stuk.github.io/jszip/官方文档<button class="layui-btn layui-btn-sm layui-btn-danger" id="export>导出</button><script src="...
2019-04-28 15:33:05
1329
原创 form表单文件上传
form表单文件上传form表单文件上传的ajax方法与文本上传有一些不一样首先form表单的enctype属性写为**“multipart/form-data”** 默认是application/x-www-form-urlencoded<form class="layui-form" id="authorization-upload" enctype="multipart/fo...
2019-04-25 10:33:00
39211
4
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人