- 博客(43)
- 收藏
- 关注
RSS订阅原创 js中双问号??和双竖杠||的区别
双竖杠||，将前面的值自动转为布尔值并且为false时，就取后面，否则取前面，如undefined、null、false、空字符串和数值0例：console.log(0||33)打印出33而双问号则为：前面的值为null、undefined，则取后面的值，否则都取前面的值。例：console.log(0??33)打印出0由此可以发现，双问号??更加适合在不知道变量是否定义时，或者是否赋值时的场景来使用。...
2021-07-16 19:34:23
1104
1
原创 js实现一个lazyman
需求：js实现一个LazyMan，能按以下方式调用：> LazyMan(“hank”).sleepFirst(2).eat(“晚餐”)在两秒后打印出我睡了2秒你好，我是hank吃晚餐<script> LazyMan = (name) => { var queue = [] const task = () => { console.log(`你好，我是${name}`); next() }
2021-03-21 17:29:05
496
原创 前端打印页面功能element数据重复打印
在vue2.x+element项目中打印页面时发现表格数据被重复打印了。点击打印：发现多循环展示且打印了两条数据造成原因：element提供的fixed固定效果是通过新创建一个相同dom进行切换实现的，观察dom结构可以发现有多个相同的dom结构。解决办法：1：不使用fixed，把table中的fixed属性删除。2：在打印事件中判断打印内容的结构中是否有fixed的表格，有的话删除即可。最后贴上修改前和修改后的代码：修改前：<template><div>
2020-10-05 15:09:25
1129
原创 async实现原理
async是generator的语法糖，async=Generator+co(自动执行器)了解其原理首先得来看看generator。node=>express=>koa=>koa2其实就是回调=>promise=>generator=>async从上述演变中看出generator也是处理回调的一种方式。Generator示例：var a=1;function *fun(){ a++; yield 'xixihaha' a++; console.log
2020-08-27 00:45:27
541
原创 MVVM简易实现源码
贴上代码便于日后复习文件如下：index.htmlMVVM.jsobserver.jscompile.jswatcher.jsindex.html:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewpo...
2020-03-22 12:58:28
580
原创 前端api接口管理及axios二次封装
以下内容分为三部分ajax二次封装axios二次封装API接口管理规范1. ajax二次封装function ajax(options){ //设置defaults作为默认参数 var defaults={ type:'get', url:'', data:{}, header:{ ...
2020-03-05 21:38:01
4455
原创 Vue.use()的实现
Vue.use(插件名)用于引入插件打个断点看看它的实现function initUse (Vue) { Vue.use = function (plugin) { var installedPlugins = (this._installedPlugins || (this._installedPlugins = [])); if (installedPlu...
2019-12-28 19:05:36
441
原创 js策略模式
策略模式简介定义一系列的算法，把它们一个个封装起来，并且使它们可以相互替换策略模式优点策略模式可以有效地避免多重条件选择语句。支持对修改关闭,对扩展开放原则算法可复用性强在策略模式中利用组合和委托来让 Context 拥有执行算法的能力，这也是继承的一种更轻便的替代方案。本文参考书籍：JavaScript设计模式与开发实践例一使用策略模式计算奖金以计算年终奖为例：绩效考核...
2019-12-06 17:27:37
375
原创 js浅拷贝深拷贝
浅拷贝和深拷贝的基本概念今天无意间又看到了这个知识点，那就写写笔记及小结，有时可能理解了一个知识点并不够，亲自讲清楚给别人听才是真正的消化并提高。还是亲手画一张草图先捋清楚概念。（首先搞清楚浅拷贝和深拷贝的概念是在引用类型这个分支下面的，它们和基本类型没有啥关系）基本类型和引用类型关于基本类型引用类型的介绍网上已经有很多介绍了，那这里我就简单举两个例子带过。基本类型var a=1...
2019-10-22 21:40:40
1894
原创 输入url到页面展示的过程
多次看到这个问题，在此做个记录加深理解并说说自己的想法。首先关于大致的过程自己画了张草图步骤分123步执行。步骤分析：1.关于url地址一般我们输入的url地址可能会有三种形式http://121.199.63.22:80http://121.199.63.22http://heyaniu.club第一种：ip地址+端口号第二种：ip地址第三种：域名第一种形式浏览器就可...
2019-10-18 21:45:25
482
1
原创 nginx入门配置
nginx配置文件结构安装好nginx后我们cd进/etc/nginx目录下，这里面有两个配置文件比较重要。nginx.conf为nginx的主配置文件，conf.d为nginx的子配置文件 接着我们输入命令vim nginx.conf进入nginx.conf配置文件nginx.conf配置文件内容如下（#后面的是注释说明这里先看一遍了解）user nginx; #...
2019-10-17 11:09:48
302
原创 macos升级catalina数据库报错NonExistentPath: Data directory /data/db not found
在一次用mongod指令启动mongodb服务时报错提示找不到db数据库文件一番寻找后发现他放在了桌面这个文件夹内于是来到访达shift+command+G前往根目录文件查看发现原本在这下面的数据库文件data消失了百度后发现在macos升级系统Catalina后就不支持在系统根目录下进行文件的相关操作于是它自动把这个data/db文件夹迁移至桌面了导致我们启动服务失败那我们在每次...
2019-10-13 18:57:05
2507
原创 no write since last change (add ! to override)
在centos7上vim下编辑配置文件时通过：wq和：q发现都无法退出vim编辑器原因：配置文件为只读状态无法编辑解决：ctrl+z退出即可
2019-10-11 11:12:31
4859
4
原创 数组的map find filter内部模拟实现
1.数组map()方法的实现：遍历数组数据并将其回调，再将所有返回值添加到新数组中Array.prototype.mymap = function(callback) { let newArr = []; for (let i = 0; i < this.length; i++) { let item = this[i]; let index = i; let arr...
2019-09-28 19:54:57
354
原创 node-sass安装报错[email protected] postinstall: `node scripts/build.js`
疯狂 npm install node-sass --save疯狂报错一番谷歌找到可行的操作。先 npm install -g cnpm --registry=https://registry.npm.taobao.org下载cnpm然后用cnpm去安装 cnpm install node-sass --savedev终于跑起来了...
2019-09-18 19:03:31
34435
11
原创 nuxt初始化项目报错
按提示npm run dev后报错首先重新install发现还是报错通过google发现是element-ui版本与nuxt不兼容导致的1.降级element版本npm uninstall element-uinpm install [email protected] -S2.修改nuxt.config.jsplugins: [ //'@/plugins/element-ui...
2019-09-17 22:43:36
759
原创 js计算页面有多少标签
记录此行代码加深对基础的学习。new Set([...document.querySelectorAll('*')].map(index => index.tagName))测试结果如下：
2019-09-17 08:22:58
402
原创 TS学习笔记(范型)
1.首先举个直白的小demo解释下为什么需要范型1.我们这里写了一个函数，传入的参数我们规定是number类型。代码如下接着如果我们又要写一个函数实现的业务跟上面这个一样，但传入的参数类型却规定要string那我们就得重新写一个一模一样的函数，函数内的代码如果很多很多，那显然这是不可取的。那如果我们把他的类型规定成any不就可以了吗，但是这样做的话就失去了类型检测的意义。我们既需要一...
2019-09-08 00:06:22
1130
原创 TS学习笔记(接口)
1.首先举个直白的小demo解释下为什么需要接口1.当我们需要一个函数并规范了他的参数为字符串时我们会这样写2.当我们需要一个函数并规范他的参数为对象时我们会这样写那如果有很多方法需要对其进行同样的约束，这样每次都写一遍同样的约束就显得不怎么方便了这时接口就派上用场了。接口的作用就是对批量方法传入的参数进行约束。2.接口的类型接口又分以下几种类型属性类接口函数类型接口可索引...
2019-09-05 23:56:10
336
原创 git报错ssh: connect to host github.com port 22: Connection timed out
碰到了git拉代码时报出的一个错误通过查阅资料尝试了几种方法之后解决了，在这做个记录。首先需要检查一下SSH是否能够连接成功，输入以下命令ssh -T [email protected]若还是报这个错ssh: connect to host github.com port 22: Connection timed out就可以使用以下解决办法第一步：打开终端并打开存放ssh的目录cd ...
2019-08-15 18:20:05
32870
31
原创 ajax post导出excel(解决乱码问题）
当前有一个需求 前端对当前页面的数据做筛选之后需要将其导出至excel文件且发送的请求需传入需验证的参数如页面token信息尝试了form提交及其他方法后出现excel乱码等问题 最后用ajax成功完成了导出。直接贴代码：下面是解释：xhr.responseType = “arraybuffer”;这段代码不加会导致导出的excel出现乱码问题。xhr.onload内操作如下：使用...
2019-07-29 00:08:26
5279
1
原创 前端分页和后端分页的思考
在工作中需要对返回的数据进行展示就需要用到分页效果了。而前端要做的就是尽快接受数据并最快地展示给用户，对于数据不多的场景用前端实现也无妨，然而若考虑到以后会有成千上万条数据应用的场景，显然后端去处理分页更合适些。每次点击下一页，前端只需发送分页数信息请求后端数据，假设一页显示十条数据，每次点击只需请求这十条数据的信息返回给前端来更快地进行交互。然而若是由前端来进行分页操作，那就得把成千上万条数...
2019-07-21 22:10:09
11004
2
原创 webpack-cli打包5分钟入门
转眼在新公司实习快十天了 趁着闲暇时间赶紧给自己充充电看到公司的项目用的grunt打包工具那今天就来复习下学过的webpack打包的基本配置吧问题1：为什么需要打包工具答：我们在html页面中可以通过script标签引入对应的js文件实现js脚本的运行那如果现在我们写了个.vue .stylus .sass等等文件浏览器无法看懂该咋办呢这时就需要打包工具（翻译官）翻译成js供浏览器...
2019-07-13 19:42:01
2114
原创 记一个webpack loader顺序没写对的报错
记一个webpack loader顺序没写对的报错发现配置了loader还是报错查阅后发现loader书写规则错误引起的改成如下打包成功总结：在webpack中，loader的执行顺序是从右到左，从下到上，stylus-loader处理好stylus文件后向上传递给css-loader处理css文件，再向上传递给style-loader处理style文件，每个loader互不影响，各...
2019-06-19 09:00:33
409
原创 webpackvue-loader was used without the corresponding plugin. Make sure to include VueLoaderPlugin
新建新项目配置vue-loader打包vue后发现报错查阅文档发现v15版的vue-loader配置需要加个VueLoaderPlugin解决方案1：把vue-loader回到v14版本npm uninstall vue-loadernpm install [email protected]解决方案2：修改webpack.config.js新增第2，36，37，38行再次...
2019-06-18 20:36:19
14868
7
翻译 plugin/preset files are not allowed to export objects only finctions
初始化nuxt+koa报错新建项目$ vue init nuxt-community/koa-template <project-name>$ cd <project-name>$ npm run dev控制台报错plugin/preset files are not allowed to export objects only finctions…先降低n...
2019-05-31 14:04:41
385
原创 vue使用better-scroll导致@click事件失效
解决办法：this.scroll=new BScroll(this.$refs.wrapper,{ click:true})在new一个BS对象的地方添加{click:true}即可实测可行
2019-05-24 22:24:26
1423
原创 overflow:hidden不仅能隐藏溢出
如下结构中div1下包含了div2div1的宽度随子元素div2改变而改变这时若给子元素添加浮动 float:left;<body> <div class="div1"> <div class="div2"> haha</br>haha </div> </div></body...
2019-05-15 09:09:40
819
原创 3行css使文本溢出显示省略号
使文本溢出显示省略号在实际开发中时常因获取到前台的data文字过长超出了div宽度导致页面结构出错这时就需要把超出的文字省略并显示省略号了 body代码<body> <div> <p>hahahaaahaahahahaa</p> </div></body>style代码<...
2019-05-13 08:42:04
914
1
原创 Vue.delete()删除data中对象的属性
想要删除data中一个对象的属性data(){ return{ userinfo:{ name:"haha", age:12, higher:"177cm" } }}发现用delete this.userinfo.key无法删除改用Vue.delete()方法成功删除/* delete this.userinfo.keys *///js中删除js对象属性...
2019-05-09 09:22:37
7171
原创 vue命名组件不能大写吗
主要代码如下<body><div id="app"> <ssST></ssST></div><template id="tp1"> <li>Hello</li> </template></body><script> Vue.comp...
2019-05-08 14:05:18
3228
原创 vue中checked结合v-model
复习了下vue的todolist记录下checked结合v-model加深印象<p>未完成</p><ul id="ul1"> <li v-if="!item.pd" v-for="item in list"> <input type="checkbox" v-model="item.pd">{{item.text}} <...
2019-05-07 20:30:24
3943
原创 instanceof测字符串为啥是false
发现控制台返回一个false说明在这里str只是一个以string为数据类型的值 并不是String的实例对象str instanceof String 在只有左侧是右侧类的对象时才会返回ture那么我们看下他是不是Object的实例对象同样返回false说明str本身并不是任何一个类的实例所以只能通过new一个String达到目标还可以测一下typeof str;返回的是 ...
2019-05-07 08:21:50
3266
1
原创 CSS：什么是BFC
BFC：用来解决使两相邻元素间距发生折叠的问题在css中按照边距重叠的原则.两元素在一起边距会产生重叠。他们之间的边距取大的那个元素的边距.比如有如下代码：<body> <section id="sec"> <p>1</p> <p>2</p> <p>3</p> <...
2019-04-29 20:43:56
492
原创 vue生命周期mounted和created的区别
简单记法：created在前,mounted在后在created这个阶段 还未对html进行渲染。故无法对相关dom节点做相关操作而在mounted这个阶段,html已渲染完毕。故可以进行相关dom操作翻阅笔记写一写加深印象...
2019-04-29 19:27:37
779
原创 小程序入门之快递查询
功能如下：输入单号显示快递信息第一步:新建项目把界面搭下wxml代码如下：<!--index.wxml--><view class="container"><input placeholder="请输入运单号" bindinput='input' /><button type="primary" bindtap="btnClick">...
2019-04-25 17:03:55
843
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人