- 博客(60)
- 收藏
- 关注
RSS订阅转载 第一次裸辞
本人毕业一年，在第一家公司实习一年、工作一年，2019 年 8 月 9 号正式离职（裸辞）。走的那一刻心情很复杂，并没有一丝轻松的感觉。第一次裸辞，从福州去往上海——一个陌生的城市，无依无靠，一切靠自己。又没什么辞职经验，未来与我而言很是迷茫。这个 8 月，我经历了裸辞、海投、面试、入职新公司。下面讲一下打算离职那一刻（7 月 8 号）的经历...备战面试...
2019-09-08 23:58:00
288
转载 2019前端面试系列——JS高频手写代码题
实现 new 方法/** 1.创建一个空对象* 2.链接到原型* 3.绑定this值* 4.返回新对象*/// 第一种实现function createNew() { let obj = {} // 1.创建一个空对象 let constructor = [].shift.call(arguments) // let [constructo...
2019-08-03 16:23:00
419
转载 2019前端面试系列——HTTP、浏览器面试题
浏览器存储的方式有哪些特性cookielocalStoragesessionStorageindexedDB数据生命周期一般由服务器生成，可以设置过期时间除非被清理，否则一直存在页面关闭就清理除非被清理，否则一直存在数据存储大小4K5M5M无限与服务端通信每次都会携带在 header，中，对于请求性能影响不参与不参与不参与...
2019-08-03 10:21:00
437
转载 2019前端面试系列——Vue面试题
Vue 双向绑定原理mvvm 双向绑定，采用数据劫持结合发布者-订阅者模式的方式，通过 Object.defineProperty() 来劫持各个属性的 setter、getter，在数据变动时发布消息给订阅者，触发相应的监听回调。几个要点：1、实现一个数据监听器 Observer，能够对数据对象的所有属性进行监听，如有变动可拿到最新值并通知订阅者2、实现一个指令解析器 Com...
2019-07-29 23:12:00
3241
转载 2019前端面试系列——JS面试题
判断 js 类型的方式1. typeof可以判断出'string','number','boolean','undefined','symbol'但判断 typeof(null) 时值为 'object'; 判断数组和对象时值均为 'object'2. instanceof原理是 构造函数的 prototype 属性是否出现在对象的原型链中的任何位置function A() ...
2019-07-27 22:09:00
377
转载 Hybrid App从概念到实战
最近一直在准备找工作，看了很多公司的招聘介绍，有相当一部分直接写：熟悉 Hybrid App 开发加分！正好，我司开发的就有这种 Hybrid App——使用 WebViewJavascriptBridge 通信，前端封装一些常用方法调用。现在的 app 开发，已经不在是以前一样所以页面都是有原生开发，基于应用的更新上线繁琐，由于 H5 的易更新，易维护性， 现...
2019-07-20 23:44:00
211
转载 2019前端面试系列——CSS面试题
盒模型/* 红色区域的大小是多少？200 - 20*2 - 20*2 = 120 */.box { width: 200px; height: 200px; padding: 20px; margin: 20px; background: red; border: 20px solid black; box-sizing: bo...
2019-07-20 14:14:00
240
转载 面试题——数组转树结构
树结构大家应该都比较熟悉，这里我主要说两种：一个根节点和多个根节点。一个根节点，就像我们的html节点，不可能有和它同级的；多个根节点，比如我们的一二级导航栏。下面一个个分析：一个根节点初级 - 只能是两层树let arr = [ { menuId: 1, name: '系统1', parentMenu: null }, { ...
2019-07-07 22:03:00
151
转载 前端安全
前端安全一直以来都是被容易忽略的知识点，因为放在前端的东西都能被用户拿到，还谈什么安全而言。也正是因为如此，我们才更应该为用户的安全考虑我认为，防止黑客窃取用户信息，从而损害用户利益。个人认为，最好的前端安全就是同源策略，浏览器已经帮我们做好了。我们要做的就是防止黑客钻空子。下面来具体分析几种前端攻击：XSS(Cross Site Scripting)跨站脚本...
2019-06-29 17:09:00
98
转载 webpack入门——构建简易版vue-cli
前言：（面试让介绍webpack，你可以这么答）简单地说，Webpack其最核心的功能就是 解决模板之间的依赖，把各个模块按照特定的规则和顺序组织在一起，最终合并成一个JS文件（比如bundle.js）。这个整个过程也常常被称为是 模块打包。换句话说，Webpack是一个指令集合的配置文档，然后通过配置好的这些指令去驱动程序做一些指令要求要做的事情。而这些动作都是通过自己写的...
2019-06-02 14:06:00
162
转载 [] == ![]，走进==隐式转换的世界
先来公布答案：console.log([] == ![]) // true，是不是很酷。==还有个好兄弟——===，下面就来看看哥俩到底干了啥...==的运行机制==运算符为确定两个运算数是否相等，会对左右两边运算数进行类型转换。执行类型转换的规则如果一个运算数是Boolean值，在检查相等性之前，把它转化成数字值。false转化成0，true转换为1。如果一个运算数是字符...
2019-05-25 19:28:00
76
转载 Vue图片懒加载插件
图片懒加载是一个很常用的功能，特别是一些电商平台，这对性能优化至关重要。今天就用vue来实现一个图片懒加载的插件。 这篇博客采用“三步走”战略——Vue.use()、Vue.direction、Vue图片懒加载插件实现，逐步实现一个Vue的图片懒加载插件。Vue.use()就像开发jQuery插件要用$.fn.extent()一样，开发Vue插件我们要用Vue.use()。其实就是官...
2019-03-10 15:50:00
104
转载 JS常用时间处理方法
这里会扩展一些JS常用时间处理方法，内置时间对象的方法不再赘述 —— 传送门：http://www.w3school.com.cn/js/jsref_obj_date.asp时间格式化 -- 转换为：yyyy-MM-dd hh:mm:ss格式// 说明：JS时间Date格式化参数// 参数：格式化字符串如：'yyyy-MM-dd hh:mm:ss'// 结果：如2016-06-0...
2019-03-07 13:13:00
129
转载 Vue中实现token验证
前后端流程分析前端页面进行登录操作，将用户名和密码发给服务器服务器进行校验，通过后生成token，包含信息有密匙、uid、过期时间等，然后返回给前端前端将token保存在本地（建议在localStorage中）和state（vuex）中，下次对服务器请求时带上，然后返回给前端服务器端对接收到的token进行校验。通过则进行相应的增删改查操作，并将数据返回给前端；未通过则返回错误...
2019-03-03 19:10:00
532
转载 VSCode基本配置
功能：保存时自动按ESLint规范格式化代码 + stylus配置（需安装Manta's Stylus Supremacy插件）{ "editor.fontSize": 18, "editor.lineHeight": 28, // 设定主题theme "workbench.colorTheme": "Atom One Dark", // 重新设定tabsize ...
2019-03-02 16:50:00
266
转载 打乱数组——shuffle
在学习vue移动端音乐项目时，看到一个打乱数组函数，感觉很有意思就记录一下（意外发现：slice是个有趣的知识点）原理：遍历数组，(let i = 0; i < _arr.length; i++)，从0-i之间随机取一个数，与当前的arr[i]作交换，这样就把数组洗的很乱// 返回min和max之间的一个随机数，包括min和maxfunction getRandomInt...
2019-02-23 21:19:00
437
转载 $emit子组件传出多个参数，如何在父组件中在接收所有参数的同时添加自定义参数...
很多时候用$emit携带参数传出事件，并且又需要在父组件中使用自定义参数时，这时我们就无法接受到子组件传出的参数了。 找到了两种方法可以同时添加自定义参数的方法。方法一：子组件传出单个参数时// 子组件this.$emit('test',this.param)// 父组件@test='test($event,userDefined)'...
2019-02-21 13:11:00
334
转载 ios中picker滑动穿透bug
Bug描述：使用mint-ui的picker组件时，datepicker和picker在ios的webview（bug是在Hybrid App发现的）中会出现滑动穿透的现象，导致弹层后面的页面也会滚动，这使得用户体验很不好。方案1：由于picker组件的滚动是用touch事件 + translate实现的，所以，我们可以在picker弹层出现的时候禁止页面的默认滚动机制，picker弹...
2018-11-24 12:01:00
227
转载 ES6常用七大特性
ES6可谓是对JS语言的一个颠覆性改变，增加了Module改善JS一直被诟病的模块化、Promise解决异步函数的回调地狱、Class的面相对象编程... 在学习ES6的过程中，大家或多或少都有看过阮一峰老师的《ECMAScript 6 入门》。这本书把ES6的所有知识点都讲解的很详细，如果有时间，还是要去仔仔细细的研究一番。这篇博文只是摘录五个常用的特性来讲解，话不多说，下面...
2018-11-17 22:48:00
150
转载 css实现类似朋友圈九宫格缩略图完美展示
公司有在做一个类似qq空间的开发，发表说说避免不了的要有图片展示。产品提出的空间缩略图的展示类似*信朋友圈那种效果——图片不变形、能看到中间部分。这里给出3种解决方案(jsbin地址失效时可复制代码到jsbin.com看效果）：1、 img + position + translate<!DOCTYPE html><html><head>...
2018-11-03 12:36:00
807
转载 NodeJS入门篇
在我印象里，“全栈工程师”这个词是NodeJS诞生后才逐渐火起来的，因为NodeJS赋予了JS服务器开发的能力。下面开始从一个小白的角度进军NodeJS... 前言：在学习NodeJS之前是需要安装的，安装方法很easy。安装好之后，安装路径会自动写到环境变量path路径中，所以我们可以直接cmd去黑窗口用node命令运行js文件。1、NodeJS是什么 Node.j...
2018-10-27 22:00:00
78
转载 viewport其实没那么难理解
在学习移动端布局的时候，你肯定听说过"viewport"这个词，然后去问度娘或谷歌。你会惊奇的发现，这个viewport不简单，居然有那么多兄弟——layout viewport、visual viewport、ideal viewport。这些都是什么鬼，然后就硬着头皮去发现他们的不同，找了很多资料，很想搞懂他们，最后可能是越看越懵逼，或者就豁然开朗的懂了（我是觉得自己豁然开朗的懂...
2018-10-21 22:21:00
110
转载 JavaScript中的异步 macrotask 和 microtask
看过很多setTimeout、Promise执行顺序的面试题，一直不明白为啥都是异步操作，Promise就牛×些呢？直到了解了macrotask和micromask才恍然大悟... 先来一道面试题助助兴：setTimeout(()=>{ console.log('A');},0);var obj={ func: function () ...
2018-10-07 19:46:00
89
转载 酷炫字体背景图的实现——神奇的background-clip: text
愉快的时光总是飞快，七天小长假已接近尾声，抓住假期的尾巴，再学个新知识点——css的background-clip: text属性...会不会有种陌生的感觉，毕竟在我们的印象里，background-clip只有padding-box、border-box、content-box三个属性，这个text是个什么鬼？？？没用过没关系，今天就来看看它用什么妙用... backg...
2018-10-05 16:48:00
336
转载 移动端rem适配屏幕
九月已成历史，十月如期而至...可能是九月工作比较清闲，周记就没怎么写，十月决不能这么堕落，立贴为证，至少保证5篇博客！！！如果没学到什么新知识，就对以往的那些工作中常用到的知识点做个总结...话不多说，今天就来谈谈移动端的rem适配...本文将从rem是什么、为什么要用rem适配、怎么用rem来讲解，保证浅显易懂...1、什么是rem rem（font size of t...
2018-10-02 22:19:00
151
转载 随机撒花特效、动态修改伪元素样式、contenteditable属性、手机端调试利器VConsole、浏览器端debug调试...
记录一些小零碎知识点，以便日后查看~1、随机撒花特效 教师节快到了，公司的产品提出一个需求：在IM（即时聊天）聊天界面弹出教师节的祝福“广告”，用户点击“发送祝福”按钮，聊天界面会随机撒花。这里的重点是随机撒花，下面会附上随机撒花的代码：<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//...
2018-09-09 15:53:00
639
转载 vue中动态添加图片无效、build上线后background-image路径问题
又是一个周五，又一周要过去了...很开心，这周遇到了vue中的一个比较常见的坑，网上随便一搜就有了很多解决方案...“幸运”的是，我选了一个带坑的方案...所以我觉得有必要记录一下这个“坑中坑”... 事情是这样的：<img :src="item.img ? item.img : '../images/default.png'" alt="">接口字段有图片则用...
2018-08-24 17:26:00
1097
转载 判断img图片是否加载成功
上班之余，记录一下工作中遇到的有趣问题... 事情是这样的...在做一个内嵌H5的app时，有一个“个人名片”页面...要求：如果后台接口有给头像的图片链接就用他们给的，如果没给，前端给个默认头像...测试过程中发现，接口的图片链接有可能是无效的，就像这样一个链接http://www.test.com/wuxiao.png...我们当时的做法是判断avaterUrl（头像链接字...
2018-08-21 15:56:00
2302
转载 FileReader实现上传图片前本地预览
平时做图片上传预览时如果没有特殊的要求就直接先把图片传到后台去，成功之后拿到URL再渲染到页面上。或者使用前端插件。这篇博客使用的是HTML5的新特性——FileReader。由于兼容性，这种方法不适合pc端...FileReader具体的兼容性点这里：FileReader兼容性。 自从有了HTML5的FileReader对象以后，预览图片变得简单多了，不再需要后台的配合，并且...
2018-08-19 16:39:00
105
转载 解决fixed属性在ios软键盘弹出后失效的bug
这周在做空间（“类似”qq空间）项目。首页是好友发表的说说，可以针对每条说说进行评论，评论框吸附固定在屏幕底部。此时，Bug来了...在ios上，软键盘弹出后fixed属性失效了。后来发现，ios绝大部分情况把fixed变成了absolute。为什么说是绝大部分情况下而不是100%，后面会提到。下面介绍2种方案...1、css布局（推荐） 解决思路：既然在 iOS ...
2018-08-19 12:50:00
588
转载 ios的日期格式bug
转眼又到了周末，转眼又要上班，转眼...大概这就是一眼万年的意思吧。 这周继续IM（即时聊天），项目用的是LayIM移动端改装的，仅仅“借用”了一个聊天窗口。由于是内嵌App的页面，自然少不了Android和iOS的兼容问题，这次要谈的就是日期格式在iOS的bug。 一般我们在页面渲染时间的时候都是xxxx-xx-xx，ios系统new Date(xxxx-xx-xx...
2018-08-12 10:40:00
151
转载 WebSocket入门
一周复一周，时间过得飞快，每个周末都是很开心却又很彷徨。开心的是不用工作，彷徨的是自己这周学到了什么、自身的技能有没有提高、如何应对这个日新月异的社会... 本周的工作的开发IM（即时聊天）模块，要用到的技术是WebSocket。由于刚接触WebSocket，自己也是边摸索边做...1、Websocket是什么 WebSocket是HTML5下一种新的协议，为解...
2018-07-29 10:10:00
59
转载 移动端1px边框
布局方面，css有那么几个比较热衷的问题。其中，移动端1px边框问题的讨论不亚于垂直居中。那么移动端1px边框问题是如何产生的呢？由于现在的手机几乎都是retina屏，css设置的1px会被渲染成2px的物理像素（针对像素比等于2的屏幕），因此看起来会比较粗。既然知道了问题的产生原因，那么我们就开始解决。网上有很多种方案，但实际上我们用的时候只能选一种用，所以那么“不靠谱”的就...
2018-07-22 15:56:00
114
转载 JS异步执行之setTimeout 0的妙用
最近在工作中遇到一些问题，大致是关于js执行问题的。由于没搞清执行顺序，导致出现了一些奇怪的bug。 所以这里整理一些有关异步执行的知识（冰山一角角）... 大家都知道js是单线程的，执行起来是顺序的，在顺序的业务逻辑中当然没有问题。如果遇到可以并发执行的业务逻辑，再排队就很低级了，所以需要异步执行！1、什么是异步？setTimeout(function(){...
2018-07-15 16:41:00
145
转载 IE8兼容border-radius.
我们知道，CSS3新增的很多简洁优美的属性，比如border-radius、box-shadow、border-image、gradients、RGBA...因为这些属性的出现，我们可以很方便的就写会很多好看的页面。但是，IE8对于CSS3的属性来说是个坎，IE8及其以下不支持CSS3属性。因此，我们需要去兼容它。下面就来说下如何兼容border-radius： 提示：be...
2018-01-24 18:04:00
115
转载 如何阻止iframe里引用的网页自动跳转
需求：现在在做一个项目，要求一个页面内嵌Bing和Baidu俩个iframe，载入页面后，从url中拿数据进行搜索。 问题：完全载入页面后，会跳转到百度页面。 问题来源：百度代码中有if (top.location != self.location) {top.location=self.location;}使用里这段代码之后，会自动判断当前的location...
2018-01-11 15:40:00
162
转载 jQuery中的动画——《锋利的JQuery》
自CSS3以来，主流网站开始偏向于扁平风格和动画效果，这时就可以jQuery的动画就可以发挥其长处了，灵活的应用其动画API，让我们可以设计出很多绚丽的效果。下面，让我们来列举一些jQuery常用的动画API。 1、show()和hide()方法1 //从display:none还原元素默认或已设置的display属性2 $("selector").show()...
2017-08-16 22:33:00
61
转载 jQuery之jquery.lazyload.js插件用法
研究背景：网站中如果图片过多，就会因为加载图片而等待很长时间，此时我们就用到图片延时加载插件jquery.lazyload.js，这个插件可以让我们在向下滚动的时候加载图片。让网页首屏尽可能快的加载进来。如何使用jquery.lazyload.js：1、jquery.lazyload.js依赖于 jquery. 请将下列代码加入HTML的结尾，也就是</body>...
2017-08-15 22:19:00
128
转载 iframe高度自适应
// 设置iframe高度winsize();function winsize() { $("#ifr").height($(window).height() - 80); // 80为顶部导航高度}$(window).resize(function () { winsize();});// 图片看不到 这个css设置是主要代码ifra...
2017-08-09 00:34:00
120
转载 jQuery中的事件——《锋利的JQuery》
虽然利用原生的JavaScript事件能完成一些交互，但jQuery增加并扩展了基本的事件处理机制。jQuery不仅提供了更加优雅的事件处理语法，而且极大地增强了事件处理能力。1、加载DOM 在JavaScript中，通常用window.onload方法，而在jQuery中，使用的是$(document).ready()方法。下面来看看这两种方法的不同之处：...
2017-06-27 19:21:00
66
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人