20180827 前端开发周报-前端开发博客

webRequest – 监控网络请求；webpack打包（有面试题）；计算树结点路径的一种Javascript的实现；Vue $mount的挂载入口的奥秘；使用 Vue 编写一个长按指令；什么是 Dweb？(中英)；零基础通过Ajax实现网易云音乐数据交互(3)；从应用实践到技能提升，那些你不可错过的 WebRTC 干货

webRequest – 监控网络请求使用 webRequest API 可以让插件监控 Chrome 的网络请求，甚至重定向请求。如图，我们可以替换掉原有图片。配置见 manifest.json we
webpack打包（有面试题）1.打包入口 {代码…} 2.css文件处理引入css css-loader 在较新的版本中使用mini-css-extract-plugin提取css文件 3.本地开发服务器：webpack-dev-server 路径重定向，支持https，浏览器中可以显示编译错误，可以…
计算树结点路径的一种Javascript的实现树结构如下： {代码…} 主要算法如下： {代码…} {代码…} 运行结果： {代码…}
Vue $mount的挂载入口的奥秘 #$mount挂载入口在想了解 mount挂载入口的区分意义合并策略已经讲解完成。在合并策略之后还有很多始化操作，在执始化执行到最后就是执行Vue原型上 $mount 方法将组件挂载到开发者给定的元素之上。 $mount 存在两种挂载方式，手动挂载、同样在 api 中向外暴露了。第二个则是自动挂载，一旦有 …
使用 Vue 编写一个长按指令原文链接：Building a long press directive in Vue 译者：OFED 使用 Vue 编写一个长按指令有没有想过只需按住一个按钮几秒钟就能在你的 Vue 应用中触发一个功能？有没有想过创建一个按钮，按下一次就可以清除单次
什么是 Dweb？(中英) 原文：hacks.mozilla.org/2018/07/int… 作者：Dietrich Ayala 发表时间：July 31, 2018 译者：西楼听雨  发表时间：2018/8/18 原文是 Mozilla 开发者网站发布的关于 Dw
零基础通过Ajax实现网易云音乐数据交互(3)数据交互，应该是一个老生常谈的问题了，可是十几年过去了，这个简单却又重要的问题，依然是很多人面试和实际工作中的心病。
从应用实践到技能提升，那些你不可错过的 WebRTC 干货在2011年 WebRTC 开源时，它还是一项不为人熟知的项目。而现在，随着苹果 Safari 对 WebRTC 的支持，以及未来可见的与微软提出的 ORTC 的结合，这项技术进入了另一个里程碑阶段。当然，目前苹果对 WebRTC 的支持还比较粗糙，需要更多的时间成熟，并解决互通上的更多问题。微软则还需要在标准的一致性上参与行业的讨论，…
js 中一些意想不到的使用技巧（持续更新，欢迎补充）js 中一些意想不到的使用技巧（持续更新，欢迎补充） 1. 箭头函数 => 返回 map 对象 {代码…} 2. 对象属性名不确定，需要动态的传入 {代码…} 3. 复制一个对象，并重写其中的一些属性 {代码…} 4. 数组解构…
Webpack+Electron+React小记看惯了网上各种全家桶，各种X+Y+Z，今天我也来凑凑热闹，和大家一起聊一聊如何使用Webpack打包基于Electron+React开发的跨平台桌面应用。 Electron是一个结合Node.js和Chromium实现的跨平台桌面应用解决方案，提供了操作系统访问Api，并赋予普通HTML网页访问Node.js本地模块的能力。使得掌握传统HTML、CSS和JS等技术的…
从 1 到完美，用 js 和 electron 写一个桌面应用目前用 js 和前端技术写桌面软件的方案主要有两种：electron 和 nw.js。这两者在底层实现上有所不同，简单的说，electron 是 node + chromium，nw.js 是 node + webkit。从使用上来说，electron 的使用更为广泛，…
不一样的 React context context 为 React 中提供了跨层级组件传递数据的能力，避免在每个层级的组件中显式传递 props。在 React16 以前，尽管被 React-Redux、React-Router 等第三方库广泛使用，但由于潜在的诸多问题，context 一直被官方标注为实验性 API，不建议使用，而 React v16.3，推出了 New Context API，期望去解决之前 context…
NODEJS+EXPRESS发送验证码完全实践，排坑之旅最近在深入学习nodejs+express+mysql的全栈开发，我知道现在mysql、express是老旧的，但是个人感觉还是挺成熟的，而且比较熟悉，先学学看，后面再看看kao、MongoDB，下面就来说说我用nodejs和腾讯云的短信sdk开发的验证码服务
JavaScript七种非常经典的创建对象方式JavaScript创建对象的方式有很多，通过Object构造函数或对象字面量的方式也可以创建单个对象，显然这两种方式会产生大量的重复代码，并不适合量产。接下来介绍七种非常经典的创建对象的方式，他们也各有优缺点。…
React 源码全方位剖析当时在各种前端框架或库充斥市场的情况下，出现了大量优秀的框架，比如 Backbone、Angular、Knockout、Ember 这些框架大都采用了 MV* 的理念，把数据与视图分离。而就在这样纷繁复杂的时期，React 诞生于 Faceboo…
一行 JavaScript 代码竟然让 FT.com 网站慢了十倍原文地址：This one line of Javascript made FT.com 10 times slower 原文作者：Arjun 译文出自：掘金翻译计划本文永久链接：github.com/xitu/gold-m… 译者：IridescentMi
Android webview 与 js(Vue) 交互 js 与原生交互分为两种情况：js 调用原生方法，原生调用 js 方法。本文将对这两种情况分别讲解，H5 端用 vue 实现。一、前期准备（Vue项目准备）本文的 H5 端用Vue 实现，所以在正式开始前先把 Vue 项目环境准备好。项目写好后，执行
深入理解 JavaScriptCore 大家好，我是美团技术团队的程序员鼓励师美美，今天正式出道，以后多多指教哟～～当当当当，今天美美给大家特别介绍一个全新的栏目，它的名字是：基——本——功！之前啊我们公众号的内容要求可严了，要么技术上有原创性，要么是程序员小哥哥们自己实践经验的总结。可是你们知道吗，美团技术同学都可…
JavaScript[21] — 数学函数数学函数 Math.random() 随机生成0到1的小数,包括0,不包括1 {代码…} Math.ceil() 返回大于参数值的最小整数(天花板值),遇到小数向上取整 {代码…} Math.floor() 返回小于参数值的最大整数(地板值),遇到小数向…
前端架构之node jwt认证前言：这次使用node express jwt实现一个小小的认证，数据库之类的慢慢在添加上去，先跑通整个流程，基本上是可以使用到项目里面的了。这次就不用gulp编译了，添加了log4.js一个错误日志，还稍微做了一下压测。就不详细展开了，有兴趣的可以下载来看：
深入理解ES6笔记（五）解构当你使用解构赋值语句时，如果所指定的本地变量在对象中没有找到同名属性，那么该变量会被赋值为 undefined 。
React Native 项目整合 CodePush 完全指南作者 | 钱凯杏仁移动开发工程师，前嵌入式工程师，关注大前端技术新潮流。本文使用的环境： React@16.3.1 React Native@0.55.4 react-native-code-push@5.3.4 Android SDK@23 A…
Github上发布一天Star数破4K的项目了解一下随着时间的推移，我们大家最熟悉的Windows操作系统不断发展。现在Windows已经发展到了Windows10版本。可能大家和我一样，真正使用Windows操作系统也不过是从Windows7开始。对于老系统，也只是从课本、老师或者其…
vue生命周期（五）每个Vue实例在被创建之前都要经过一系列的初始化过程,这个过程就是vue的生命周期一、生命周期钩子函数 beforeCreate created beforeMount mounted beforeUpdate updated beforeDestroy destroyed var vm = new Vue({ el: ‘#app’, data: { message: ‘Vue的生命周期’ }, bef…
React 源码全方位剖析第一章－前置知识当时在各种前端框架或库充斥市场的情况下，出现了大量优秀的框架，比如 Backbone、Angular、Knockout、Ember 这些框架大都采用了 MV* 的理念，把数据与视图分离。而就在这样纷繁复杂的时期，React 诞生于 Faceboo…
《小程序开发实践总结》前前后后也开发了四五个小程序了。总觉得要留下点什么，既是记录那些年我们踩过的坑，也是希望大家别再掉坑。（by Darko）
前端项目框架搭建随笔—Webpack踩坑记只知道Webpack怎么拼怎么用的我。。被领导委托搭建移动端项目框架。。。此时的我：咱虽然对Webpack一窍不通，也得保持风度“那个大哥，咱这边移动端用啥UI框架？”“得过几天想想。。搞不好咱们自己手写一套”这时候我的动力来了：UI框架？做UI框架不是我一直
由一篇ES6继承文章引发对于super关键字的思考子类中存在constructor方法的时候，需要调用super方法，并且需要在使用this关键字之前调用
vue监听对象及对象属性监听整个对象，使用watch就行 {代码…} 监听对象中具体属性的变化，需要使用watch配合computed {代码…}
HTTP 缓存的那些事儿原文出自 https://www.pandashen.com 前言 HTTP 缓存机制作为 Web 应用性能优化的重要手段，对于从事 Web 开发的同学们来说，应该是知识体系的基础环节，也是想要成为前端架构的必备技能。缓存的作用我们为什么使用缓存，是因