- 博客(39)
- 收藏
- 关注
原创 axios post 提交数据的几种方式
axios中post请求在与后台交互时,在请求头‘Content-Type’ 定义的提交数据类型有几种方式,如下:this.axios({ url:"http://127.0.0.1:3000/getData", method:"post", data:params, header: { 'Content-Type': 'application/x-www-form-urlencoded'.
2020-12-11 15:29:01 1445
原创 Javascript数组对象去重
var arry = [{ name: "a", value: 12 }, { name: "a", value: 23 }, { name: "b", value: 44 },{ name: "c", .
2020-09-03 17:21:07 194
原创 找出并删除git库中的大文件
在git库中有时会存在很大的文件,比如二进制文件、记录账号密码的文件或者一些zip文件等。我们可能会忘记在gitignore中加上这些文件名,在commit和pull的时候就会很慢,甚至出错下面分几步处理这些大文件1. 显示10个最大的文件id列表git verify-pack -v .git/objects/pack/pack-*.idx | sort -k 3 -g | tail -...
2020-03-26 16:13:49 3067
原创 Mac上 npm EACCES: permission denied 问题终极方案
方法一:// 1、清除npm缓存(由于是在Mac系统下,执行npm cache clean --force命令时前面需要加sudo获取权限)sudo npm cache clean --force// 2、删除node_modules文件(也可手动删除node_modules文件夹)rm -rf node_modules// 3、重新执行安装sudo npm install方法二(...
2020-02-16 15:19:04 3574
原创 Linux/Mac OS 常用命令
输入下面的ps命令,显示所有运行中的进程:ps aux | less根据进程名搜索【ps -axu 本机名|grep 程序名】【ps -axu ShuChan|grep mysql】在知道程序端口的情况下:将PortNum替换为要查询的端口号(注意端口号前面不要空格)sudo lsof -i:PortNum举个例子sudo lsof -i:3306结束进程前提是需要知道进程的...
2019-10-22 09:45:38 269
原创 Javascript 将html转成pdf,可以下载,支持多页(html2canvas 和 jsPDF)
最近项目碰到一个需求,将一个表格生成一份报告,故而想到将表格导出为pdf文件。此功能用到了jspdf和html2canvas两个开源插件,可以 npm 直接拉取,不多说,代码如下:在获取到页面截取的base64位的长长图片之后,添加到pdf中。 $("#downpdf").on("click", function() { //获取节点高度,后面为克隆节点设...
2019-07-30 14:41:05 2278
原创 js 实现将数据导出excel两种方式
由于项目需要,需要在不调用后台接口的情况下,将json数据导出到excel表格,参考了好多资料以及很多大佬写的博客终于实现,兼容chrome没问题方法一将table标签,包括tr、td等对json数据进行拼接,将table输出到表格上实现,这种方法的弊端在于输出的是伪excel,虽说生成xls为后缀的文件,但文件形式上还是html,代码如下<html><head>...
2019-07-15 08:45:17 680
原创 node打包工具--Pgk
使用pkg打包Node.js应用的方法步骤Node.js应用不需要经过编译过程,可以直接把源代码拷贝到部署机上执行,确实比C++、Java这类编译型应用部署方便。然而,Node.js应用执行需要有运行环境,意味着你需要先在部署机器上安装Node.js。虽说没有麻烦到哪里去,但毕竟多了一个步骤,特别是对于离线环境下的部署机,麻烦程度还要上升一级。假设你用Node.js写一些小的桌面级工具软件,部署...
2019-05-31 15:04:23 3773 1
原创 JS实现继承的几种方式
前言JS作为面向对象的弱类型语言,继承也是其非常强大的特性之一。那么如何在JS中实现继承呢?让我们拭目以待。JS继承的实现方式既然要实现继承,那么首先我们得有一个父类,代码如下:// 定义一个动物类function Animal (name) { // 属性 this.name = name || 'Animal'; // 实例方法 this.sleep = functi...
2019-04-04 12:31:45 184
原创 访问一个URL经历了哪些过程
从大致上来讲经历了客户端获取URL - > DNS解析 - > TCP连接 - >发送HTTP请求 - >服务器处理请求 - >返回报文 - >浏览器解析渲染页面 - > TCP断开连接1、概要从用户在浏览器输入域名开始,到web页面加载完毕,这是一个说复杂不复杂,说简单不简单的过程,下文暂且把这个过程称作网页加载过程。下面我将依靠自己的经验,总结一...
2019-04-03 00:18:35 17666 2
原创 CommonJS模块与ES6模块的区别
前面我们已经对ES6的模块化规划和CommonJs的模块化规范已经介绍过了,所以今天我们主要聊聊这两种模块化的差异,如果对这两种模块化规范不是特别了解的,可以点击ES6模块化规范和CommonJs模块化规范ES6 模块与 CommonJS 模块完全不同。它们有两个重大差异。CommonJS输出是值的拷贝,即原来模块中的值改变不会影响已经加载的该值,ES6静态分析,动态引用,输出的是值的引用...
2019-03-28 23:07:10 504
原创 js的深拷贝和浅拷贝
浅拷贝我们看一下这个例子:let a = {title:'深复制'};let b = a;a.title = '浅复制';console.log(a)console.log(b)咦,为啥嘞!!!!!!为啥两个都是输出"浅复制"。。。。Object.assign() 方法用于将所有可枚举属性的值从一个或多个源对象复制到目标对象。它将返回目标对象。const object1 = ...
2019-03-28 22:21:00 222
原创 event-loop的理解
JavaScript的学习零散而庞杂,因此很多时候我们学到了一些东西,但是却没办法感受到自己的进步,甚至过了不久,就把学到的东西给忘了。为了解决自己的这个困扰,在学习的过程中,我一直试图在寻找一条核心的线索,只要我根据这条线索,我就能够一点一点的进步。前端基础进阶正是围绕这条线索慢慢展开,而事件循环机制(Event Loop),则是这条线索的最关键的知识点。所以,我就马不停蹄的去深入的学习了事件...
2019-03-26 17:47:29 309
原创 相关面试题
面试分享:一年经验初探阿里巴巴前端社招面试一个一年工作经验的前端,大家一般会问什么问题才能确实这是自己需要的前端平安科技前端面试题前端面经总结——平安科技四轮技术面+一轮HR面...
2019-03-21 17:48:15 202
原创 CSS圆环的5种方法
想到去年面试实习的时候被问到实习圆环的问题,特意写篇文章总结一下吧!总结了一下大概有5种方法。1. 两个标签的嵌套:<div class="element1"> <div class="child1"></div></div>.element1{ width: 200px; heig...
2019-03-21 17:22:42 3648 1
原创 dom 事件冒泡、捕获 dom事件三个阶段
本文主要解决两个问题:什么是事件流DOM事件流的三个阶段起因温故了一下我的《JavaScript高级程序设计》的时候,翻到DOM事件那一章,(说实话,现在无论是什么框架你都离不开操作DOM啊,毕竟这是你展示的最基本元素,就像人的细胞)。想起了dom事件流原理,好多人不明白,只知道click mouseout等实用场景,真要理解和更进一步的前端是要必须:理论+实践 并行的。当然,DOM事件...
2019-03-21 17:04:37 1530
转载 js的原型和原型链
对于新人来说,JavaScript的原型是一个很让人头疼的事情,一来prototype容易与__proto__混淆,二来它们之间的各种指向实在有些复杂,其实市面上已经有非常多的文章在尝试说清楚,有一张所谓很经典的图,上面画了各种线条,一会连接这个一会连接那个,说实话我自己看得就非常头晕,更谈不上完全理解了。所以我自己也想尝试一下,看看能不能把原型中的重要知识点拆分出来,用最简单的图表形式说清楚。...
2019-03-21 16:58:36 149
原创 vuex直接修改state 与 用dispatch/commit来修改state的差异:
一. 使用vuex修改state时,有两种方式:1)可以直接使用 this.$store.state.变量 = xxx2)this.$store.dispatch(actionType, payload)或者: this.$store.commit(commitType, payload)二. 异同点1)共同点: 能够修改state里的变量,并且是响应式的(能触发视图更新)2)不同点:...
2019-03-21 15:53:01 3452
原创 Vue-lazyload原理详解之源码解析
前叙本来想要研究mint-ui组件库的Lazy load组件,没想到翻看它的源码,发现它完全引用的vue-lazyload项目,直接引用,没有丝毫修改。因此转而研究vue-lazyload,代码并不多,几百行吧,有兴趣的可以读一下。简单接入示例html代码:<div id="app"> <li v-for="img in imgList"> ...
2019-03-20 23:38:39 715 1
原创 ES6特性
刚开始用vue或者react,很多时候我们都会把ES6这位大兄dei加入我们的技术栈中。但是ES6那么多那么多特性,我们真的需要全部都掌握吗?秉着二八原则,掌握好常用的、有用的这个可以让我们的开发快速起飞。接下来我们就聊聊ES6那些可爱的新特性吧。1.变量声明const和let在ES6之前,我们都是用var关键字声明变量。无论声明在何处,都会被视为声明在函数的最顶部(不在函数内即在全局作用域...
2019-03-20 22:07:48 171
原创 前端经典面试题之CSS实现三栏布局,左右宽度固定,中间宽度自适应
前端常问的面试题,题目:假设高度一定,请写出三栏布局,左右宽度300px,中间自适应。下面提供这道题的五种解决方案:首先要写好整个页面的布局(初始化等) <style> html * { padding: 0; margin: 0; } .layout { ...
2019-03-20 18:23:08 952
原创 vue的生命周期
前言在使用vue一个多礼拜后,感觉现在还停留在初级阶段,虽然知道怎么和后端做数据交互,但是对于mounted这个挂载还不是很清楚的。放大之,对vue的生命周期不甚了解。只知道简单的使用,而不知道为什么,这对后面的踩坑是相当不利的。因为我们有时候会在几个钩子函数里做一些事情,什么时候做,在哪个函数里做,我们不清楚。于是我开始先去搜索,发现vue2.0的生命周期没啥文章。大多是1.0的版本介绍。...
2019-03-20 16:48:22 130
原创 函数防抖与函数节流
一、概念解释函数节流和函数防抖,两者都是优化高频率执行js代码的一种手段。 大家大概都知道旧款电视机的工作原理,就是一行行得扫描出色彩到屏幕上,然后组成一张张图片。由于肉眼只能分辨出一定频率的变化,当高频率的扫描,人类是感觉不出来的。反而形成一种视觉效果,就是一张图。就像高速旋转的风扇,你看不到扇叶,只看到了一个圆一样。 同理,可以类推到js代码。在一定时间内,代码执行的次数不一定要非常多。...
2019-03-20 14:01:03 457
原创 前端对称加密
前端 crypto-js AES 加解密网上关于 AES 对称加密的算法介绍挺多的,对这一块还不是特别理解的小伙伴可自行百度,这里我推荐一篇AES加密算法的详细介绍与实现,讲的还是蛮详细的~具体实现其实搞懂了是怎么一回事,做起来还是挺简单的,因为库都是现成的,我们只需要会用就好啦,这里我在推荐一篇理解AES加密解密的使用方法,加深大家对 AES 算法的理解~这里我以 Vue 作为例子,其他...
2019-03-15 13:57:15 10343
原创 MD5、对称加密、非对称加密
一、md5加密md5是一种不可逆的加密,一定记住是不可逆的。虽然现在很多算法也可以将md5解密出来但是md5还是具有很大程度上的不可逆,而且加大解密难道使用双重加密,很多登录的地方用到md5加密,那么有些人会问我用md5加密了服务器怎么解密呢,你要是这么想就错了。登录时输入用户的密码这个密码被md5加密后在服务器也存的是这个md5的字符格式,也就是说服务器的数据库存的就是这个格式的字符串,所以服...
2019-03-15 13:38:11 4876
原创 前端跨域方案
什么是跨域?跨域是指一个域下的文档或脚本试图去请求另一个域下的资源,这里跨域是广义的。广义的跨域:1、资源跳转:A链接、重定向、表单提交2、资源嵌入:&amp;lt;link&amp;gt;、&amp;lt;script&amp;gt;、&amp;lt;img&amp;gt;、&amp;lt;frame&amp;gt;等dom标签,还有样式中background
2019-03-14 17:48:57 328
原创 前端单元测试框架(Karma/Mocha + Vue-Test-Utils + Chai)
通过我们Vue的项目, 去讲解如何使用mocha &amp; karma, 且结合vue官方推荐的vue-test-utils去进行单元测试在使用vue-cli创建项目的时候,会提示要不要安装单元测试和e2e测试。既然官方推荐我们使用这两个测试框架,那么我们就以此为例实践一下。简介KarmaKarma是一个基于Node.js的JavaScript测试执行过程管理工具(Test Runn...
2019-03-13 10:14:18 4457
原创 前端大厂10道经典面试题汇总
1、写一个js函数,实现对一个数字每3位加一个逗号,如输入100000, 输出100,000(不考虑负数,小数)—百度前端面试题解题思路本题是js实现number.toLocaleString()方法,面试题做了简化不考虑负数小数,此题主要是考数据类型及字符串操作,答案不唯一。按现实思路解题,现实中添加千位分隔符是从后到前,每3位添加逗号,所以这里输入数据转换成字符串后,利用slice方法...
2019-03-11 21:39:34 2513 1
原创 ES6 Promise 用法
Promise是一个构造函数,自己身上有all、reject、resolve这几个眼熟的方法,原型上有then、catch等同样很眼熟的方法。那就new一个var p = new Promise(function(resolve, reject){ //做一些异步操作 setTimeout(function(){ console.log('执行完成'); ...
2019-03-08 17:24:54 152
原创 讲讲http和浏览器那些事
1. http和httpshttps的SSL加密是在传输层实现的。(1)http和https的基本概念http: 超文本传输协议,是互联网上应用最为广泛的一种网络协议,是一个客户端和服务器端请求和应答的标准(TCP),用于从WWW服务器传输超文本到本地浏览器的传输协议,它可以使浏览器更加高效,使网络传输减少。https: 是以安全为目标的HTTP通道,简单讲是HTTP的安全版,即HTTP下...
2019-03-07 00:11:00 433
原创 前端闭包
不起眼的开始招聘前端工程师,尤其是中高级前端工程师,扎实的 JS 基础绝对是必要条件,基础不扎实的工程师在面对前端开发中的各种问题时大概率会束手无策。在考察候选人 JS 基础的时候,经常会提供下面这段代码,然后让候选人分析它实际运行的结果:for (var i = 0; i &amp;amp;lt; 5; i++) { setTimeout(function() { console.l...
2019-03-06 17:43:31 209 1
原创 前端性能优化
1. 规避javascript多人开发函数重名问题命名空间封闭空间js模块化mvc(数据层、表现层、控制层)seajs变量转换成对象的属性对象化2. 请说出三种减低页面加载时间的方法压缩css、js文件合并js、css文件,减少http请求外部js、css文件放在最底下减少dom操作,尽可能用变量替代不必要的dom操作3. 你所了解到的Web攻击技术(1)XSS(Cros...
2019-02-28 23:16:56 201
原创 jQuery相关问题
1、 jQuery 库中的 $() 是什么?()函数是jQuery()函数的别称。() 函数是 jQuery() 函数的别称。()函数是jQuery()函数的别称。() 函数用于将任何对象包裹成 jQuery 对象,接着你就被允许调用定义在 jQuery 对象上的多个不同方法。你可以将一个选择器字符串传入 $() 函数,它会返回一个包含所有匹配的 DOM 元素数组的 jQuery 对象。2、如...
2019-02-28 17:33:38 239
原创 前端面试题(一)
#以下主要是HTML、CSS相关面试题1. 阐述清楚浮动的几种方式(常见问题)(1).父级div定义 height原理:父级div手动定义height,就解决了父级div无法自动获取到高度的问题。优点:简单、代码少、容易掌握缺点:只适合高度固定的布局,要给出精确的高度,如果高度和父级div不一样时,会产生问题(2).父级div定义 overflow:hidden原理:必须定义widt...
2019-02-26 15:00:41 404
原创 前端面试题(三)
以下主要是前端相关的技术知识点1.你能描述一下渐进增强和优雅降级之间的不同吗?优雅降级:Web站点在所有新式浏览器中都能正常工作,如果用户使用的是老式浏览器,则代码会检查以确认它们是否能正常工作。由于IE独特的盒模型布局问题,针对不同版本的IE的hack实践过优雅降级了,为那些无法支持功能的浏览器增加候选方案,使之在旧式浏览器上以某种形式降级体验却不至于完全失效.渐进增强:从被所有浏览器...
2019-02-26 14:59:27 897
原创 前端面试题(二)
以下主要是JavaScript相关面试题1.call和.apply的区别是什么?call方法:语法:call(thisObj,Object)定义:调用一个对象的一个方法,以另一个对象替换当前对象。说明:call 方法可以用来代替另一个对象调用一个方法。call 方法可将一个函数的对象上下文从初始的上下文改变为由 thisObj 指定的新对象。 如果没有提供 thisObj 参数,那么 G...
2019-02-26 14:57:07 598
原创 Prometheus相关资料
prometheus-book:https://github.com/yunlzheng/prometheus-book中文文档:https://www.ctolib.com/docs/sfile/prometheus-book/index.html非官方中文手册: https://www.bookstack.cn/read/prometheus-manual/README.md...
2019-02-21 15:22:17 281
原创 CSDN-markdown编辑器的使用
第一次发文章就是markdown 编辑器使用。。。欢迎使用Markdown编辑器你好! 这是你第一次使用 Markdown编辑器 所展示的欢迎页。如果你想学习如何使用Markdown编辑器, 可以仔细阅读这篇文章,了解一下Markdown的基本语法知识。新的改变我们对Markdown编辑器进行了一些功能拓展与语法支持,除了标准的Markdown编辑器功能,我们增加了如下几点新功能,帮助你用...
2019-02-21 11:09:03 137
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人