自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(21)
  • 收藏
  • 关注

原创 从0开始搭建一个自己的react-app脚手架(webpack5+typescript)

从0开始搭建一个自己的react-app脚手架(webpack5+typescript)1、前置工作mkdir react-clicd react-clinpm init --yes此教程都是以yarn安装依赖的,npm、cnpm也可平时我们可能自己写项目不常用eslint,、prettier等,在公司项目里这些也是很重要的,毕竟多人开发涉及到规范问题嘛,所以我们就先来配置eslint、prettier。2、prettier eslint配置yarn add prettier eslint

2021-04-23 11:59:37 1056 1

原创 JavaScript实现点击复制功能

JavaScript实现点击复制功能。原理:原生JavaScript提供了一个方法:window.document.execCommand('copy');这个方法就是对当前的以选中的字符进行复制,这边就又有一个问题,就是我们该怎么选中?input、textarea等标签提供了select方法,我们就可以使用这个来模拟我们用户选中。我们可以创建一个input标签,当然这个标签要是透明的,或者是不可见的,不能平白无辜在页面上多一个标签吧,然后给这标签的value值赋上我们想要复制的内容,最后我们在执行

2020-12-11 16:13:18 706

原创 VScode格式化和vue脚手架中的eslint相冲突,总是在最后有个逗号

文件——>首选项——>设置setting.json,这边只看跟vue相关的就行了,注意要把vue的默认格式设置位vetur{ "git.ignoreMissingGitWarning": true, "editor.tabSize": 2, //保存的时候格式化 "editor.formatOnSave": true, "editor.codeActionsOnSave": { "source.fixAll.eslint": true }, "fileh

2020-11-17 23:54:36 1433 1

原创 前端优化:防抖和节流

js防抖节流防抖节流是前端性能优化的一部分了,在一些场景中我们需要使用他们来帮助我们减少不必要的消耗,尤其是对一些监听事件的不必要消耗的优化。为什么要进行优化?我们以监听滚动事件来进行举例window.addEventListener('scroll',()=>{ console.log('test')})我们可以看到我们这个监听事件的执行频率很高,只要我们划一小部分,触发很多次事件,当我们的时间如果执行的很慢的话很可能页面就会卡死,而且这么高的执行频率我们也不是必要的,很多性

2020-08-07 17:38:50 352

原创 JavaScript模拟实现call、apply、bind

JavaScript模拟实现call、apply、bind1、实现call()js提供的call方法可以实现函数内this指向的改变,我们可以看下面这个例子const obj={ a:'1'}function fn(){ console.log(this.a)}fn() //undefinedfn.call(obj) //1,指向obj可以看到使用call我们可以将函数中的this强制指向obj对象。下面我们来自己实现这个函数,我们都知道函数fn如果直接执行,则this

2020-08-07 14:14:23 159

原创 JavaScript遍历数组(数组的迭代方法)

for循环遍历let a=[1,2,3,4,5]for(let i=0;i<a.length;i++){ console.log(a[i])}for(…in…)let a=[1,2,3,4,5]for(i in a){ console.log(a[i])}for(…of…)let a=[1,2,3,4,5]for(i of a){ console.log(i)}forEach参数是一个function,function的参数有三个,当前遍历的值,

2020-07-25 15:56:41 129

原创 JS数组方法(返回值以及是否改变原数组)

数组是js最常用的类型,JavaScript提供了很多数组的方法,今天我们就来好好整理一下。1、push在数组末尾插入元素let a=[1,2,3]a.push(4)a//[1,2,3,4]push方法会改变原数组返回值为插入后数组的长度2、pop移除数组最后一项let a=[2,3]a.pop()a//[2]会改变原数组返回值为被移除的元素3、shift获取数组头部元素let a=[3,4,5]a.shift()a //[4,5]会改变原数组返回值为获取到的

2020-07-25 14:52:14 1596

原创 hexo搭建个人博客完整过程

在我们日常中要保持不断的学习,写技术博客就是其中一种,程序员很有必要有自己的一个个人博客,不管是静态搭建的还是自己从零开始一步步实现的,写技术博客都是一种技术分享和学习的有效方法。这里我的博客搭建使用的hexo来搭建的并放在了github-page上,一些人可能看着官方文档会有点乱,这边我就介绍一下hexo博客的基本用法,从搭建到部署安装搭建hexo需要使用npm,因此要先从nodejs官网上下载最新的nodejs稳定版,安装好了之后我们执行下面的步骤,全局安装hexo的一个脚手架npm insta

2020-07-24 22:22:21 703

原创 JavaScript实现继承(七种)

Js继承在学习继承前希望读者先去学习下js原型和原型对象的知识。对于js原型和原型对象的理解原型链继承让一个函数的原型指向另一个引用类型的对象,这样子这个原型对象中就有一个指针是指向另一个函数的原型的,这个原型中又有一个指针是指向另一个函数的构造函数的。function Animal(){ this.name='动物'}Animal.prototype.say=function(){ return this.name}function Cat(){ this.nam

2020-07-23 17:49:55 110

原创 JS原型、原型对象的理解

JS原型、原型对象的理解原型:原型(prototype)是每个函数都具有的一个属性,本质上是一个指针,指向的是函数的原型对象。例如:function Person(Name){ this.name=Name}Person.prototype//可以查看当前Person函数的原型对象。原型对象函数中的protype属性所指向的对象,这个对象的用途就是可以指定特定类型的所有实例共享的一个方法和属性,我们不必在构造函数声明一个对象实例的信息。例如:function Person(){

2020-07-22 16:34:07 430

原创 express+jwt实现token验证

由于面试了前端,但是我简历上写着我会后端所以被问到了token验证这个问题,但是我自己的项目是没有用到的,他问了我jwt的组成结构什么的。。我当然是一问三不知啦,所以回来之后就自己额外做了一下这个token验证。组成jwt主要有三部分组成header,主要就是存放了你的token类型和你的加密方式。playload,一般有签发人,签发时间,过期时间,编号等,这部分是可以添加自己的一些数据进去。signature,要生成这个是需要以上两个字段的,还需要一个密钥,这是只有服务端才知道的一个密钥,生成

2020-06-19 00:38:29 2198

原创 JavaScript手写快速排序

最近的一次前端实习面试题。。因为没准备充分,导致在快排这一块就直接死了。。太丢人了。回来之后好好总结了下,然后写下这篇js实现快排。原理原理其实很简单,我们要先设一个基准数,我们一般设为第一个,然后我们从数组的两端开始找,这边我们开始节点设为low,尾节点设为high,我们从high开始往左找一个比基准数要小的数,(至于为什么要先从high开始往左查找后边我们会讲到),我们在从low开始往右找比基准数大的值,这里一定要满足low是小于high的,然后我们交换找到的两个值,然后当我们找的过程中low=hi

2020-06-18 17:36:33 1257

原创 前端面试(js部分1)

JavaScript面试题1markdown源文件提取码:x67n1、get请求传参的误区get请求对请求参数的大小有限制其实是一个误区。在http协议中并未规定get请求的参数大小限制,对get请求有限制的是浏览器或者是web服务器对URL的长度的限制。2、js闭包闭包的作用:可以在外部读取到函数内的局部变量,并且使该局部变量一直存在于内存之中,不会污染全局变量(JavaScript的GC机制,当一个变量不在被引用时将会被回收,闭包就解决了局部变量被回收的问题。)例子:function

2020-06-06 23:55:49 130

原创 前端面试(CSS部分2)

CSS面试题2markdown源文件提取码:qyjv1、使用CSS制作一个三角形<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> </head> <style type="text/css"> .aa{ width: 0; height: 0; border-top: 20px s

2020-06-06 00:21:31 111

原创 前端面试(css基础部分1)

这是从牛客网上总结下来的css面试基础题的一小部分,后续也会持续更新markdown源文件下载提取码:8min1、css盒模型盒模型有两种,一种是w3c提出的标准盒模型,一种是ie盒模型。box-sizing:content-box为w3c提出的标准盒模型型,其宽度为border+padding+width,因此设置了内边距和边框会使得盒模型的宽度增加。box-sizing:border-box为ie的盒模型,其宽度就为width,当设置了padding或者border时,会使得内容部分减小。

2020-06-05 15:59:39 183

原创 vue+express实现音乐播放器

vue+express实现音乐播放器效果图因为html中的audio的样式不能更改,所以我们自己制作UI,做成自己想要的样子,这样要实现滑动条跟audio的双向绑定,滑动条使用了vant的组件slider,audio单向绑定到slider我们通过监听勾子 timeupdate <audio @canplay="canplay" preload="preload" @timeupdate="updateTime" ref="audio" :src="music"></audio&

2020-05-22 20:17:31 420

原创 用js实现简单的扫雷

JS实现扫雷实现效果:总体思想:这个扫雷难点主要就两点:第一点就是雷的随机分布,我这里使用js动态生成了10*10的table表格,然后设定生成20个雷,然后在生成每个格子代表的数字,雷我们用9表示,因为1-8要被其他非雷格子使用,然后我们只要一格是雷区那么周围的格子都加一,这样我们的雷区就生成好了,然后玩法的编写主要难点就是在当点击数字为0时的格子时要把它周围的0区也显示出来,因此这里我们使...

2020-03-22 20:10:13 1443

原创 c++使用opencv完成人脸检测

opencv是开源的计算机视觉库,实现人脸检测我们使用的是opencv库中帮我们训练好的检测器,一般在D:\opencv\sources\data\haarcascades目录下有各种检测器。可以根据各种要求选择不同的训练器,我是结合了官网中的demo检测了人脸和人眼。代码有详细的注释,当然我还添加了一部分对图像的处理函数,有兴趣的可以了解一下。各种函数参数都可以取opencv官网查看。...

2019-09-14 15:37:55 1645 2

原创 java制作简易计算器图形界面并完成四则运算(不含小数)

因为在java入门就先做一下简单的来练一下手,这边我的图形界面使用windowbuilder制作的,这个可以托框,布局也比用手打方便很多。这个感觉图形界面不是主要的难点,重点还是在于对于四则运算的方法。不多说放代码,里面有注释。图形界面代码/* 图形界面代码,放在了一个Caculator类中,用window builder可以做出自己想要的布局*//*Caculator.java*/pac...

2019-07-19 17:28:53 1788

原创 关于对java多线程售票系统的理解,synchronized关键字

java多线程一直是学会java的关键,多线程中的同步则是安全性的保障,尽管效率会有所下降。为了理解synchronized 同步块的用法,先把代码放上来package thread;public class ticket implements Runnable{ public int i=10; public void run() { while(true) { ...

2019-07-18 17:07:44 189

原创 关于JFrame中使用label添加背景且不会覆盖其他组件的方法

最近心血来潮想学一下老古董swing结果刚要做第一个就被难倒了,琢磨了好久,关于JFrame中使用label添加背景且不会覆盖其他组件的方法,不多说代码先放上在讲述下我自己的理解,因为也是刚接触不一定是正确的理解。。毕竟这个东西现在碰的人也挺少的。。。public static void main(String[] args) { JFrame frame=new JFrame(); ...

2019-07-18 00:46:21 2803 1

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除