20170822 前端开发日报-前端开发博客

几种 JavaScript 动画库推荐；2017年8月前端开发者超实用干货大合集；深度好文 | JavaScript 疲劳终极指南：我们行业的真相；JavaScript数据结构和算法；Vue.js数据绑定原理；HTTP缓存机制详解；如何监听页面DOM变动并响应；立即表达式的多种写法与注意点以及in操作符的作用

几种 JavaScript 动画库推荐JavaScript 库对设计师和开发人员来说，都是非常有用的工具。它们可以为你的网站添加一些超级强大的功能，给用户带来更好的体验。
2017年8月前端开发者超实用干货大合集在过去的几年当中，网络上所流传的各种设计和开发资源，在素质上有明显的提升。其中有一些已经几乎成为了设计师和开发者必备的工具，但是其中绝大多数由于其应用范畴的局限，或者传播不够广，导致它们大多并广为人知。将这些素材集中到一起，很大程度上是希望它们的目标用户能够明白，需要这些工具的时候，上哪儿找。

这次的前端干货合集内容也很齐全，仔细看看，总能找到几款你所需要的。
深度好文 | JavaScript 疲劳终极指南：我们行业的真相上周我在 NebraskaJS 2017 会议上做了一个和这个话题极其类似的演讲，我也收到了许多积极的反馈，所以我就想这个演讲也可以写成一篇文章发表出来，让更多的人知道，并帮助他们应对 JS 疲劳，理解我们行业的真相。

这篇文章的目的是希望改变你对软件工程行业的普遍的看法，助你在你可能工作的领域上一臂之力。
JavaScript数据结构和算法数据结构和算法对于很多前端工程师来说，一直觉得是可有可无的，但其实不然，个人觉得，前端工程师其实是最需要重视数据结构和算法的人，因为前端所做的东西是用户访问网站第一眼看到的东西，特别在移动浪潮到来之后，对用户体验越来越高，对前端提出了更高的要求，面对越来越复杂的产品，需要坚实的数据结构和算法基础才能驾驭。如果没有学习过计算机科学的程序员，当我们在处理一些问题时，比较熟悉的数据结构就是数组，数组无疑是一个很好的选择。但很多时候，对于很多复杂的问题，数组就显得太过简陋了，当学习了数据结构和算法之后，对于很多编程问题，当想到一个合适的数据结构后，设计和实现解决这些问题的算法就手到擒来。
Vue.js数据绑定原理 Vue.js是一款MVVM框架，上手快速简单易用，通过数据绑定在修改数据的时候更新视图。Vue.js的数据绑定原理依赖于Object.defineProperty，尤大大在Vue.js文档中就已经提到过，这也是Vue.js不支持E8 以及更低版本浏览器的原因。Vue通过设定对象属性的 setter/getter 方法来监听数据的变化，通过getter进行依赖收集，而每个setter方法就是一个观察者，在数据变更的时候通知订阅者更新视图。
HTTP缓存机制详解 Http 缓存机制作为 web 性能优化的重要手段，对于从事 Web 开发的同学们来说，应该是知识体系库中的一个基础环节，同时对于有志成为前端架构师的同学来说是必备的知识技能。

但是对于很多前端同学来说，仅仅只是知道浏览器会对请求的静态文件进行缓存，但是为什么被缓存，缓存是怎样生效的，却并不是很清楚。

在此，我会尝试用简单明了的文字，像大家系统的介绍HTTP缓存机制，期望对各位正确的理解前端缓存有所帮助。
如何监听页面DOM变动并响应最近在做 chrome 插件开发，既然是插件那就难免不对现有页面做一些控制，比如事件监听、调整布局、对 DOM 元素的增删改查等等。其中有一个需求比较有意思，便整理一下顺便把涉及到的知识点复习一遍。
立即表达式的多种写法与注意点以及in操作符的作用立即表达式，在javascript中非常常见，采用立即表达式可以形成一个局部作用域，常配合闭包实现模块化编程等其他用途，接下来我们看看，在大多数的框架中，立即表达式都有哪些写法，以及需要注意的点，另外再介绍下in操作符的用法。
【从删库到跑路！IT工程师离职后删雇主网站源码判刑五年】软件工程师徐某离职后因公司未能如期结清工资，便利用其在所设计的网站中安插的后门文件将网站源代码全部删除。最终徐某破坏计算机信息系统罪成立，获刑五年。
#前端技术#【常见 CSS 布局方式】详见：一些常见的 CSS 布局方式梳理，涉及 Flex 布局、Grid 布局、圣杯布局、双飞翼布局等。
我们动手来封装一个JS的发布订阅组件提及发布订阅，我们都知道是一种比较经典的设计模式。比如像redux等比较流行的一些库或者一些前端框架底层都会用来作为通讯机制，那么我们今天就来封装一个基于发布订阅的组件。
HTML5 indexedDB 前端本地存储数据库实例教程 HTML5 indexedDB和Web SQL Database都是本地数据库数据存储，Web SQL Database数据库要出来的更早，然并卵。从2010年11月18日W3C宣布舍弃Web SQL database草案开始，就已经注定Web SQL Database数据库是明日黄花。
阿里云前端周刊 – 第 21 期推荐 1. Firefox 55 引入 WebVR 支持 https://hacks.mozilla.org/201… 近日发布的 Windows 平台上的 Firefox 55 版本，成为首个支持新 WebVR 标准的桌面浏览器；Mozilla 希望能够以此推动 WebVR 的进一步发展。…
Vue.js响应式原理写在前面因为对Vue.js很感兴趣，而且平时工作的技术栈也是Vue.js，这几个月花了些时间研究学习了一下Vue.js源码，并做了总结与输出。文章的原地址： github.com/answershuto 。在学习过程中，为Vue加上了中文的注释 github.com/answershuto… ，希望可以对其他想学习Vue源码的小伙伴有所…
基于 vue + nuxt 打造 o2o 教育商城系统（触屏版）服务端渲染SSR Node.js(v6.9.1) + express(4.X) + vue(2.0) + vuex + mysql(5.7.18) + （NUXT）SSR + nginx反向代理前言 *本项目纯属个人练习项目，数据并非真实，如有雷同 Node.js(v6.9.1) + express(4.X) + vue(2.0) + vuex + mysql(5.7.18) + （NUXT）SSR + nginx反向代理前言 *本项目纯属个人练习项目，数据并非真实，如有雷同
[外刊评论]JavaScript的流行是一群精神病人的狂欢不得不说的是，这篇文章还是比较片面化得吐槽，请各位js也不要太在意，每个语言都有他吐槽的地方，包括C#,JAVA,PHP,甚至c++和c…如果真要写，可以写出类似于C#是一群精神病人的狂欢,JAVA是一群精神病人的狂欢,PHP是一群精神病人的狂欢…..反正这篇吐槽文章在劝大家不要进JavaScript的坑，但是世界到处都是坑,你不进这个总…
前端每周清单第 27 期：React Patent License 回复，Shopify WebVR 购物，原生 JS MVC 设计，Flow 优化 React 作者：王下邀月熊编辑：徐川前端每周清单专注前端领域内容，以对外文资料的搜集为主，帮助开发者了解一周前端热点；分为新闻热点、开发教程、工程实践、深度阅读、开源项目、巅峰人生等栏目。欢迎关注【前端之巅】微信公众号（ID：frontshow），及时获取前端每周清作者：王下邀月熊编辑：徐川前端每周清单专注前端领域内容，以对外文资料的搜集为主，帮助开发者了解一周前端热点；分为新闻热点、开发教程、工程实践、深度阅读、开源项目、巅峰人生等栏目。欢迎关注【前端之巅】微信公众号（ID：frontshow），及时获取前端每周清
【20170820 前端开发日报】这些JavaScript编程黑科技，装逼指南，高逼格代码，让你惊叹不已；js的call,apply，bind的使用与区别；原生JS实现最简单的图片懒加载；@前端开发博客
分析webpack打包后的文件前言作为前端，总是在工作中使用 Webpack 作为模块打包工具，却从来也没有分析过 Webpack 打包后的文件是什么样子的。这可不行，今天我就写了一个小例子，来分析一下 Webpack 生成
前端每周清单半年盘点之 JavaScript 篇前端每周清单专注前端领域内容，以对外文资料的搜集为主，帮助开发者了解一周前端热点；分为新闻热点、开发教程、工程实践、深度阅读、开源项目、巅峰人生等栏目。欢迎关注【前端之巅】微信公众号（ID：frontshow…
JavaScript 专题之惰性函数 JavaScript 专题系列第十五篇，讲解惰性函数需求我们现在需要写一个 foo 函数，这个函数返回首次调用时的 Date 对象，注意是首次。解决一：普通方法 var t; function foo() { if (t) return t;
Javascript中 toFixed javascript中toFixed使用的是银行家舍入规则。银行家舍入:所谓银行家舍入法，其实质是一种四舍六入五取偶（又称四舍六入五留双）法。简单来说就是：四舍六入五考虑，五后非零就进一，五后为零看奇偶，五前为偶应舍去，五前为奇要进一。但是不论引入toFixed解决浮点数计算精度缺失的问题也好，它有没有使用银行家舍…
#JavaScript#【JavaScript运算符】1.JavaScript算术运算符算术运算符用于执行变量或值之间的算术运算。var y=5; var x=y+2; x=7; x=y%2,x=1;x=++y, x=6; x=–y; x=4;2.JavaScript赋值运算符赋值运算符用于给JavaScript变量赋值…请戳→ #前端开发博客#
React Internals In this five part series, we will “recreate” React from the ground up, learning how it works along the way. Once we’ve finished, y
ES6系列—解构在编码过程中，我们经常定义许多对象和数组，然后有组织地从中提取相关的信息片段。ES6的解构特性，可以简化这项工作。解构是一种打破数据结构，将其拆分为更小部分的过程。未使用解构的做法 {代码…} 这段代码…
React+Redux项目结构最佳实践 React + Redux 是React生态中使用最频繁的技术栈，但关于如何组织React+Redux的项目结构，一直都有多种声音。本文将讨论其中最常用的3种项目结构，并给出个人的最佳实践。按照类型这里的类型指的是一个文件在项目中充当的角色类型，即这个文 React + Redux 是React生态中使用最频繁的技术栈，但关于如何组织React+Redux的项目结构，一直都有多种声音。本文将讨论其中最常用的3种项目结构，并给出个人的最佳实践。按照类型这里的类型指的是一个文件在项目中充当的角色类型，即这个文
Preact.js – React.js 的精简版 Getting Started Note: You don't need ES2015 to use Preact… but give it a try! The easiest wa Getting Started Note: You don't need ES2015 to use Preact… but give it a try! The easiest wa Getting Started Note: You don't need ES2015 to use Preact… but give it a try! The easiest wa
[React技术内幕] setState的秘密对于大多数的React开发者，setState可能是最常用的API之一。React作为View层，通过改变data从而引发UI的更新。React不像Vue这种MVVM库，直接修改data并不能视图的改变，更新状态(state)的过程必须使用setState。
基于 vue+express+mongodb 个人网站开发体验从界面设计到后端的全栈开发
从 JavaScript 到 TypeScript – 泛型TypeScript 为 JavaScriopt 带来了强类型特性，这就意味着限制了类型的自由度。同一段程序，为了适应不同的类型，就可能需要写不同的处理函数——而且这些处理函数中所有逻辑完全相同，唯一不同的就是类型——这严重…
Velocity.js的使用