缘自世界_个人页

缘自世界

文章

问答

视频

个人介绍

有事没事儿搞点技术

擅长的技术

Linux

获得更多能力

通用技术能力：

暂时未有相关通用技术能力~

云产品技术能力：

暂时未有相关云产品技术能力~

阿里云技能认证

详细说明

高分内容

最新动态

文章
问答
视频

发表了文章 2018-12-07

判断DOM元素是否出现再浏览器窗口中

几乎所有的项目都要解决这样一个问题：判断一个元素是否出现在浏览器窗口中？因为通过它我们可以极大的优化项目的性能，进而提升用户的的体验。使用场景及技术分析所涉及的业务实现，比较常见的就是电商平台或者是图片展示类的网站。
发表了文章 2018-10-27

不要忽视代码审查的重要性

这是一篇译文，觉得它很不错就把它翻译了一下。原文名为 8 Tips for Great Code Reviews，这篇文章不管是对提升个人编程素养，还是协调团队间的合作都有一定的指导意义。在学校里没有教给你的一项本领就是怎样做一个好的代码审查(CR)。
发表了文章 2018-10-17

webpack4带来了什么

在开发人员还在体会webpack3.x的余韵时，webpack4.x已经悄然而来。而对使用者来说，最期待的问题无外乎如下：新版本与旧版本相比都有哪些改变？ webpack3.x到webapck4.x的迁移？使用webpack4.x我们应该注意什么？ webpack的新特性 webpack 作为构建工具的强大之处在于：可以在 webpack.config.js 中配置很多独特的功能；它的配置灵活多变；但正因为这样，这也是它的糟点。
发表了文章 2018-10-16

从ajax到fetch

Ajax 是什么？答：Ajax是一种可以在浏览器和服务器之间使用异步数据传输（HTTP请求）的技术。使用它可以让页面请求少量的数据，而不用刷新整个页面。
发表了文章 2018-10-14

浮动的label

图片来自JVFloatLabeledTextField 在web项目中，有一个很重的模块就是登陆/注册模块，这个模块的主体部分就是一个form表单，这个form表单包含两个重要input组（用户名/密码），每个input组都包含label和input，而关于 label+input 的布局方案多种多样，不同的设计师有不同的设计风格，不同的前端工程师又有不同的实现方式。
发表了文章 2018-10-13

HTML5中dialog元素尝鲜

对话框（别称模态框，浮层）是web项目中用于用户交互的重要部分，我们最常见的就是js中 alert()，confirm()，但是这个对话框的不美观，也不能自定义样式，所以在开发的过程中，一般根据自己自己的需求造轮子或者使用第三方的。
发表了文章 2018-10-11

用 css 做web图形化处理

图片来自 CHRIS COYIER 在前端开发中，你或多或少都会接触到css图形。之前我整理过伪元素&伪类的内容，为的就是更加熟悉了解它们，以便更好的使用它们。
发表了文章 2018-09-29

伪类&伪元素

伪类（pseudo-class）& 伪元素（pseudo-element）伪类和伪元素在web开发中用的好的话，可以说犹如神助。但一定要分清楚，什么是伪类，什么是伪元素。
发表了文章 2018-05-01

深入理解vue.js——组件

熟悉vue或者研究过vue源码的同学都知道，组件是vue最重要的部分之一，而写组件由两种常见的方式： template模板 render渲染函数式的 template式的组件 template式的组件有两种常见的形式：第一种： {{ msg }} Vue.
发表了文章 2018-02-04

eval()不是魔鬼，只是被误解了（翻译）

原文来自：https://www.nczonline.net/blog/2013/06/25/eval-isnt-evil-just-misunderstood/ 作者：Nicholas C.Zakas 在JavaScript中，我不确定是否有比eval()受到更多诽谤的。
发表了文章 2018-02-03

漫谈promise使用场景

深入理解promise 对于现在的前端同学来说你不同promise你都不好意思出门了。对于前端同学来说promise已经成为了我们的必备技能。那么，下面我们就来说一说promise是什么，它能帮助我们解决什么问题，我们应该如何使用它？这是我个人对promise的理解。
发表了文章 2018-02-02

算法宽度遍历（面试题详解）

问题来源 https://segmentfault.com/q/1010000013091395?_ea=3284779 问题描述：存在一个0，1值的二维数组，给定一个坐标[x,y]，如果该坐标所代表的元素值为1，则返回该坐标所代表的元素相邻的所有值为1的元素坐标。
发表了文章 2018-01-26

JavaScript 观察者模式

观察者模式又叫做发布-订阅模式。这是一种一对多的对象依赖关系，当被依赖的对象的状态发生改变时，所有依赖于它的对象都将得到通知。生活中的观察者模式就如我们在专卖店预定商品（如：苹果手机），我们会向专卖店提交预定申请，然后店家受申请，正常这样就完事了。
发表了文章 2018-01-21

javascript 代理模式

所谓的的代理模式就是为一个对象找一个替代对象，以便对原对象进行访问。使用代理的原因是我们不愿意或者不想对原对象进行直接操作，我们使用代理就是让它帮原对象进行一系列的操作，等这些东西做完后告诉原对象就行了。
发表了文章 2018-01-17

javascript 数据类型判断

JavaScript一共有六种数据类型，分为原始类型（又名基本类型）和对象类型（又名引用类型）原始类型有五种，分别为number，string，boolean，undefined，null五种。
发表了文章 2018-01-16

javascript 策略设计模式

什么是策略。策略就是根据形势的发展而制定的行动方针。比如说春节快要到了，我们要回家，回家我们就要选择交通工具。怎么回家我们就需要制定方案。比如说我吧，我们家在河南一个农村，不管是汽车，火车，飞机都没有直达的。
发表了文章 2018-01-15

JavaScript 单例模式

定义确保一个类仅有一个实例，并提供一个访问它的全局访问点。单例模式使用的场景比如线程池、全局缓存等。我们所熟知的浏览器的window对象就是一个单例，在JavaScript开发中，对于这种只需要一个的对象，我们的实现往往使用单例。
发表了文章 2018-01-02

设计模式（通往高手之路的必备技能）

‘从大处着眼，从小处着手’，以前对这句话一知半解，自从踏出校门走入社会，开始工作以来，有了越来越深的理解，偶有发现这句话用在程序开发中也有用，所以，近段时间开始尝试着分析jQuery源码，分析angularjs源码，学习设计模式。
发表了文章 2018-01-02

掌握面试——弹出框的实现

这道面试题，当初我面试的时候被问过两次，因此比较深，此外，我记得还有设计模式的考察，所以，有深刻的体会。面试题主要考察什么面试不是个轻松的活，不管是对面试官还是面试者都一样。
发表了文章 2017-12-31

观察者设计模式

观察者设计模式是一个好的设计模式，这个模式我们在开发中比较常见，尤其是它的变形模式订阅/发布者模式我们更是很熟悉，在我们所熟悉jQuery库和vue.js框架中我们都有体现。
发表了文章 2017-12-29

constructor设计模式

在经典的面向对象编程语言中，constructor是一个特殊的方法，被用来初始化一个新建的对象，一旦该对象被分配内存话。在JavaScript中几乎所有的东西都是一个对象，然而常常引起我们兴趣的是对象的constructor。
发表了文章 2017-12-23

掌握Javascript面试：什么是闭包？

文章来源于:https://medium.com/javascript-scene/master-the-javascript-interview-what-is-a-closure-b2f0d2152b36 在JavaScript的面试中我通常将这个问题放在第一个或者最后一个问题。
发表了文章 2017-12-23

傻傻的分也分不清楚的property和attribute

最近，一个小伙伴问了我一个问题property和attribute的区别？当时我想了又想，很不好意思的说了我不知道，所以，抽了个事件好好的利用了一下‘度娘’和‘Google’总结了一下。
发表了文章 2017-09-19

掌握并熟练运用vue后，我们还需要知道什么

掌握并熟练运用vue后，我们还需要知道什么起因最近，公司在招兵买马，吸纳了很多的优秀人才，起初我对这一现象并不重视，自我认为这就是因为公司最近的项目做的不错，老板要把项目做大做强，因此招一些技术大牛无可厚非，同时说句比较脸皮厚的话自己也不差，尤其是在这个前端这一块儿还是比较有信心的，但是偶然间和老大的一次谈话引起了我的警惕。
发表了文章 2017-09-08

vue-仿手机qq的demo

概述这是一个16年9月份找的开源项目源代码，结合自己的实际情况进行的修改项目，以后内容将会有很大的不同，项目的目标是向QQ看齐页面效果展示效果展示免责声明本项目为开源项目，如有类同，纯属巧合。
发表了文章 2017-09-08

vue 填坑系列总结——scoped

在上个月份的一次使用vue的项目开发的过程中发现了一个很诡异的现象，就是我在中写样式时发现样式突然间不起作用了，这是为什么？填坑步骤 1.当时我首先想到的是缓存问题，所以果断的按住ctrl + shift + del键，清除缓存，但是我发现‘然并卵’； 2.
发表了文章 2017-05-24

transform，transition，animation的混合使用——结业篇

css动画的动画制作没有什么特别高深的地方，引入少量的css代码就能实现丰富多彩的页面效果是作为一个web前端开发者所推崇的，但我想要强调的是掌握并深入的理解css的基础，以及灵活的运用是做出一个画面美观、代码简洁、性能高效的css动画的必备技能。
发表了文章 2017-05-20

transform，transition，animation的混合使用——高手

每个制作出来的css3动画都凝结了设计者和创作者智慧的结晶，以此，我们要向前辈致敬；动画的出现给单调的网页平添了活性，是单纯的展示页面变得不再那么枯燥，所以，作为一个web前端的开发者能够创作出属于自己的特有的动画，我感到很高兴。
发表了文章 2017-05-16

transform，transition，animation的混合使用——进阶

今天我们来讲述css3能够做成动画的最小独立单元,并且讲述如何使用这些独立的单元来构成一个‘高大尚’的组合动画。这是我在网上找的一个案例，修改后的效果图，虽说不是特别的‘高大尚’，但我认为这也跟高大尚占了一点了，中间的菜单按钮就是我们在做responsive开发时会用的到的效果，这是一个六边形的菜单，每个正三边形中的鼠标滑过出现的文字效果也是我们常见到的产品推荐的鼠标滑过的一种形式。
发表了文章 2017-05-11

transform，transition，animation的混合使用——初探

学习css3动画 css3动画这个对于我们前端攻城狮来说是个既熟悉又陌生的东东，前两年有好些个大牛都在研究使用它，但最近一段热度降了下来，可以说这个东东各大钟情于大的公司都有自己的一套解决使用方案，但我在网上苦苦的寻找，没有发现，可能是我不够用心。
发表了文章 2017-04-23

前端的多列布局解决方案

前端页面的布局经历了固定布局，表格布局，浮动、定位布局, 弹性布局，网格布局的历史演进，各种布局方式在web发展的不同阶段扮演你了不同的角色。多列布局的解决方案我个人总结至少有5种之多，有的兼容性不错但代码结构复杂，有的结构简单但兼容性不佳，但根据具体的使用环境和要求，总有一种解决方案是适合你的。
发表了文章 2017-04-23

前端开发——模块化（css模块化开发）

掌握模块化开发的思想是我们进行模块化开发的基础。他有以下几部分组成： 1.css模块化 2.html模块化 3.js模块化模块化开发的优势 1.更好的组织和维护代码 2.按需加载 3.避免命名冲突 css模块化 css模块化编程语言说到css的编程语言我们就需要了解一下css预处理器，它用一种专门的编程语言，为 CSS 增加了一些编程的特性，将 CSS 作为目标生成文件，然后开发者就只要使用这种语言进行编码工作。
发表了文章 2017-04-23

前端开发——模块化（html模块化开发）

web从进入2.0时代后，web开发人员更加注重模块化思想的运用，特别是有了SPA之后。 SPA——组件化进入了spa时代的我们对于模块化有了新的称呼‘组件化’，spa既是我们所熟知的单页面应用。
发表了文章 2017-04-23

前端开发中关于icon 使用的总结

解决方案： 1. Css sprite 雪碧图，也称为css精灵图 2. Icon font 图标字体 3. Data URI scheme 实现原理：雪碧图: 它的基本原理是将网站中的所有的图标图片整合到一张图片中，该图片使用css 中的width,height,background属性和background-position属性来渲染网站中请求页面中的图标。

暂无更多信息

发表了文章 2018-12-07

判断DOM元素是否出现再浏览器窗口中
发表了文章 2018-10-27

不要忽视代码审查的重要性
发表了文章 2018-10-17

webpack4带来了什么
发表了文章 2018-10-16

从ajax到fetch
发表了文章 2018-10-14

浮动的label
发表了文章 2018-10-13

HTML5中dialog元素尝鲜
发表了文章 2018-10-11

用 css 做web图形化处理
发表了文章 2018-09-29

伪类&伪元素
发表了文章 2018-05-01

深入理解vue.js——组件
发表了文章 2018-02-04

eval()不是魔鬼，只是被误解了（翻译）
发表了文章 2018-02-03

漫谈promise使用场景
发表了文章 2018-02-02

算法宽度遍历（面试题详解）
发表了文章 2018-01-26

JavaScript 观察者模式
发表了文章 2018-01-21

javascript 代理模式
发表了文章 2018-01-17

javascript 数据类型判断
发表了文章 2018-01-16

javascript 策略设计模式
发表了文章 2018-01-15

JavaScript 单例模式
发表了文章 2018-01-02

设计模式（通往高手之路的必备技能）
发表了文章 2018-01-02

掌握面试——弹出框的实现
发表了文章 2017-12-31

观察者设计模式

正在加载, 请稍后...

滑动查看更多

正在加载, 请稍后...

暂无更多信息

正在加载, 请稍后...

暂无更多信息

缘自世界_个人页

个人介绍

擅长的技术

判断DOM元素是否出现再浏览器窗口中

不要忽视代码审查的重要性

webpack4带来了什么

从ajax到fetch

浮动的label

HTML5中dialog元素尝鲜

用 css 做web图形化处理

伪类&伪元素

深入理解vue.js——组件

eval()不是魔鬼，只是被误解了（翻译）

漫谈promise使用场景

算法 宽度遍历（面试题详解）

JavaScript 观察者模式

javascript 代理模式

javascript 数据类型判断

javascript 策略设计模式

JavaScript 单例模式

设计模式（通往高手之路的必备技能）

掌握面试——弹出框的实现

观察者设计模式

constructor设计模式

掌握Javascript面试：什么是闭包？

傻傻的分也分不清楚的property和attribute

掌握并熟练运用vue后，我们还需要知道什么

vue-仿手机qq的demo

vue 填坑系列总结——scoped

transform，transition，animation的混合使用——结业篇

transform，transition，animation的混合使用——高手

transform，transition，animation的混合使用——进阶

transform，transition，animation的混合使用——初探

前端的多列布局解决方案

前端开发——模块化（css模块化开发）

前端开发——模块化（html模块化开发）

前端开发中关于icon 使用的总结

判断DOM元素是否出现再浏览器窗口中

不要忽视代码审查的重要性

webpack4带来了什么

从ajax到fetch

浮动的label

HTML5中dialog元素尝鲜

用 css 做web图形化处理

伪类&伪元素

深入理解vue.js——组件

eval()不是魔鬼，只是被误解了（翻译）

漫谈promise使用场景

算法 宽度遍历（面试题详解）

JavaScript 观察者模式

javascript 代理模式

javascript 数据类型判断

javascript 策略设计模式

JavaScript 单例模式

设计模式（通往高手之路的必备技能）

掌握面试——弹出框的实现

观察者设计模式

算法宽度遍历（面试题详解）

算法宽度遍历（面试题详解）