20170724 前端开发日报

前端事件绑定知识点（面试常考）；合格前端系列第六弹-从指向看JavaScript；刺破vue的心脏之——响应式源码分析；10个JavaScript难点；webpack多页应用架构系列（十六）：善用浏览器缓存，该去则去，该留则留；JS事件浅析；htcap：一款实用的递归型Web漏洞扫描工具；使用node爬虫，爬取指定排名网站的JS引用库

1. 前端事件绑定知识点（面试常考）简介 事件是可以被 JavaScript 侦测到的行为。 网页中的每个元素都可以产生某些可以触发 JavaScript 函数或程序的事件。 事件通常与函数配合使用，当事件发生时函数才会执行。 执行JS 事件的方式： HTML 事件属性…
2. 合格前端系列第六弹-从指向看JavaScript很多人刚刚接触前端甚至一些“老”前端都经常会在JavaScript中所谓的难点，如this，原型，继承，闭包等这些概念中迷失了自我。接下来这篇文章会把我自己对于JavaScript中这些点通过指向的概念做个总结并分享给大家，希望可以帮助大家更好的了解这些所谓的难点。
3. 刺破vue的心脏之——响应式源码分析 之前发 刺破 vue 的心脏之——详解 render function code 的时候，承诺过会对 Vue 的核心过程的各个部分通过源码解析的方式进行抽丝剥茧的探索，今天就来进入第二部分 响应式原理部分的源码解析 ，承诺兑现得有些晚，求轻拍 一、先分析工作原理 还是之前的套路，在读源码之前，先分析原理 上图来自 Vue 官…
4. 10个JavaScript难点10个JavaScript难点 1.立即执行函数 立即执行函数，即Immediately Invoked Function Expression (IIFE)，正如它的名字，就是创建函数的同时立即执行。它没有绑定任何事件，也无需等待任何异步操作： {代码…} fu…
5. webpack多页应用架构系列（十六）：善用浏览器缓存，该去则去，该留则留本文首发于Array_Huang的技术博客——实用至上，非经作者同意，请勿转载。原文地址：https://segmentfault.com/a/1190000010317802如果您对本系列文章感兴趣，欢迎关注订阅这里：https://segmentfault.com/blog/arr…
6. JS事件浅析 一个网页由三层组成（html 结构，js 行为，css 表现），一切的东西其实都建立在html上，html里面的dom提供了一些事件，然后通过js封装，我们可以用js去调用dom上的事件。事件有很多，有我用过的有我没用过的，今天我想分析一番。 事件流 我们都知道，有两种事件流，一个是冒泡一个是捕获。 捕获就是从body开始到你…
7. htcap：一款实用的递归型Web漏洞扫描工具 今天给大家介绍的是一款名叫 htcap 的开源 Web 漏洞扫描工具，它通过拦截 AJAX 调用和页面 DOM 结构的变化并采用递归的形式来爬取单页面应用（SPA）。htcap 并不是一款新型的漏洞扫描工具，因为它主要针对的是漏洞扫描点的爬取过程，然后使用外部工具来扫描安全漏洞。在 htcap 的帮助下，我们就可以通过手动或自动渗透测…
8. 使用node爬虫，爬取指定排名网站的JS引用库前期准备 本爬虫将从网站爬取排名前几的网站，具体前几名可以具体设置，并分别爬取他们的主页，检查是否引用特定库。 github地址 所用到的node主要模块 express 不用多说 request http模块 cheerio 运行在服务器…
9. 关于javascript中的从堆栈内存到执行上下文关于javascript中的从堆栈内存到执行上下文 我GitHub上的菜鸟仓库地址： 点击跳转查看其他相关文章 文章在我的博客上的地址： 点击跳转         先从计算机角度说一下内存：内存，包括三个部分：只读存储器（ROM…
10. ReactNative学习笔记十之npm 在之前的笔记中总有各种形式的npm install，npm到底是干什么用的，它的命令都有哪些，这里会详细介绍一下。 npm NPM的全称是Node Package Manager，是随同NodeJS一起安装的包管理和分发工具，它很方便让JavaScript开发者下载、安装、上传以及管理已经安装的包。 版本 查看 $ npm -v 2.3.0 升级 $ sudo npm…
11. TypeScript：不止稳，而且快 前言 关于 TypeScript 是什么，应该大部分人都已经知道了，但是在这儿，还是摘抄一下知乎的回答： TypeScript 是 JavaScript 的强类型版本。然后在编译期去掉类型和特有语法，生成纯粹的 JavaScript 代码。由于最终在浏览器中运行的仍然是 JavaScript，所以 TypeScript 并不依赖于浏览器的支持，也并…
12. Vue 和 React 使用方式的对标 这篇文章将接地气的从开发使用角度对比Vue和React，带有严重个人偏好，慎入。 这篇文章首次发布于 knowledge 项目，因为博客正在换皮肤和评论系统，关于这篇文章的任何问题，都可以在我 GitHub 的 knowledge 仓库提issues讨论。 目录结构 关于组建的创建方式 关于 State …
13. 分享自己折腾多时的一套 vue 组件 –we-vue接触 Vue.js 已经一年多了，记得用它 hello world 的时候，最新的稳定版本还是 1.0.24，而眼下，v2 都已经迭代好多次了。 不得不说，初识Vue.js 时，让我有种初恋的赶脚。（当然了，对于 jQuery 这旧爱也是没办法…
14. JavaScript 函数重载 译者按: jQuery之父John Resig巧妙地利用了闭包，实现了JavaScript函数重载。 原文: JavaScript Method Overloading 译者: Fundebug 为了保证可读性，本文采用意译而非直译。另外，本文版权归原作者所有，翻译仅用于学习。 在一个业余项目中，我写了一个简单的addMethod函数，用于实现函数重…
15. 用 TS + Vue 重写 APlayer HTML5 音乐播放器 简介 @DIYgod/APlayer 是一款简洁漂亮的 HTML5 音乐播放器 (〃ﾉωﾉ) 在我第一次看到这款播放器颜值的时候让我眼前一亮，我非常崇拜那些能设计出好看界面的设计师 (* 简介 @DIYgod/APlayer 是一款简洁漂亮的 HTML5 音乐播放器 (〃ﾉωﾉ) 在我第一次看到这款播放器颜值的时候让我眼前一亮，我非常崇拜那些能设计出好看界面的设计师 (*
16. JSXX – 又一个模板引擎 该模板引擎采用与 JSX 类似的语法，但是提供了 for 和 if 语句来方便使用，与 JSX 类似，该模板引擎会将模板编译为与之对应的模板函数，可以同时在浏览器和 node 端使用。 Vue 的模板引擎似乎也提供了预编译的方式，但是它生成的模板函数会使用 with 语句来在运行时确定模板变量的作用域，见 Vue-Templ…
17. Web前端模板引擎の字符串模板这是一个系列文章，将会介绍目前Web前端领域里用到的三种模板引擎技术，它们分别是： 基于字符串的模板 基于Dom操作的模板 基于虚拟Dom的模板 本文是这个系列的第一篇，着重介绍基于字符串的模板引擎的实现原理，…
18. 如何更有效率和质量地开发Vue项目 前言 自总结完了上篇前端工程化的思想，并在vue全家桶的项目加以实践，趁热给大家总结一篇如何更有效率与质量地开发vue项目，以及其中踩过的一个个坑。。。 基于vue-cli的自定义
19. nodejs + express + mssql 封装数据操作在网上看到有一些nodejs连接sqlserver的相关教程，但非常少，而且很多都有错，特别是操作数据库的语句，在这里我做了一番整理，搭建一个完整的nodejs后台，并封装sqlserver的操作。 nodejs的安装和express的安装…
20. 前端每周清单第 23 期：React 内部原理与实现，自定义基于 JavaScript 的 16 位虚拟机 – 知乎专栏 前端 前端每周清单 编辑：徐川 作者：王下邀月熊 前端每周清单专注前端领域内容，分为新闻热点、开发教程、工程实践、深度阅读、开源项目、巅峰人生等栏目。关注【前端之巅】微信公众号（ID：frontshow），及时获取前端每
21. 阿里云前端周刊 – 第 17 期推荐 1. Styled-Components 实战 https://hackernoon.com/styled… Styled-Components 是由 Max Stoiber 与 Glen Maddern 创建的新的 CSS-in-JS 工具库，能够帮你组织 React 或者 React Native 项目中的样式声明…
22. 换个思路理解Javascript中的this 在网上很多文章都对 Javascript 中的 this 做了详细的介绍，但大多是介绍各个绑定方式或调用方式下 this 的指向，于是我想有一个统一的思路来更好理解 this 指向，使大家更好判断，以下有部分内容不是原理，而是一种解题思路。
23. Angular Renderer (渲染器) Angular 其中的一个设计目标是使浏览器与 DOM 独立。DOM 是复杂的，因此使组件与它分离，会让我们的应用程序，更容易测试与重构。另外的好处是，由于这种解耦，使得我们的应用能够运行在其它平台 (比如：Node.js、WebWorkers、NativeScript 等)。 为了能够支持跨平台，Angular 通过抽象层封装了不同平台的差异。比如定…
24. 前端视角下的Ruby 请把话筒转交给我，对Ruby我有一些逼要装。 image.png 在Beansmile做前端已经有半年多了，这件四川特产我还留着。倒不是说这件衣服布料有多好，它怎么看都更像是一个表白的工具吧？当然穿着这件衣服在外面招摇撞骗的时候，还是会有些朋友问我“Ruby 请把话筒转交给我，对Ruby我有一些逼要装。 image.png 在Beansmile做前端已经有半年多了，这件四川特产我还留着。倒不是说这件衣服布料有多好，它怎么看都更像是一个表白的工具吧？当然穿着这件衣服在外面招摇撞骗的时候，还是会有些朋友问我“Ruby
25. Webpack 2 Tree Shaking配置原文 Tree Shaking是一个针对ES6以上代码的清楚死代码的算法，也是Webpack 2最被期待的特性之一。通过清除未使用的ES6引用，Webpack能更助于压缩过程从而得到比之前更小的文件体积。 Webpack 2简单应用代码已更新…
26. 关于promises，你理解了多少？ 用Javascript的小伙伴们，是时候承认了，关于 promises 我们一直存在着问题。并非说 promises 本身有问题，Promises/A+ 是极好的。 就我过去数年观察大量 PouchDB API 以及其他 promise-heavy API 的 用Javascript的小伙伴们，是时候承认了，关于 promises 我们一直存在着问题。并非说 promises 本身有问题，Promises/A+ 是极好的。 就我过去数年观察大量 PouchDB API 以及其他 promise-heavy API 的
27. 理解 JWT（JSON Web Token）认证及实践 最近想做个小程序，需要用到授权认证流程。以前项目都是用的 OAuth2 认证，但是Sanic 使用OAuth2 不太方便，就想试一下 JWT 的认证方式。这一篇主要内容是 JWT 的认证原理，以及python 使用 jwt 认识的实践。 几种常用的认证机制 HTTP Basic Auth HTTP Basic Auth 在HTTP中，基本…
28. 面向未来的API —— GitHub GraphQL API 使用介绍 本文根据GitHub开发者文档，整理翻译了GitHub GraphQL API的使用方法，你可以了解到GraphQL的基本概念、GitHub GraphQL API的使用，两个实际的使用案例，以及使用Explorer查询GitHub GraphQL API 本文根据GitHub开发者文档，整理翻译了GitHub GraphQL API的使用方法，你可以了解到GraphQL的基本概念、GitHub GraphQL API的使用，两个实际的使用案例，以及使用Explorer查询GitHub GraphQL API
29. 开源JavaScript插件和库速查表 我关注的
30. Vue 折腾记 – (6) 写一个不大靠谱的backToTop组件 前言 返回顶部这个功能用jq实现,好容易实现,一个animate配合scrollTo就搞定了 今天我们来试试vue封装一个原生js实现的返回顶部;写起来够呛,借助github,看了别人的gist,稍微封装了下; 当然不是用scrollTo直接调位那种,没有过渡

关注github前端日报 订阅精彩文章

前端日报栏目数据来自码农头条，每日分享互联网上热门的前端开发、移动开发、设计、资源和资讯等，为开发者提供动力，如果觉得内容对你有用，记得分享给你的小伙伴。进入码农头条查看更多