20170815 前端开发日报

JavaScript 闭包，只学这篇就够了

闭包不是魔法 这篇文章使用一些简单的代码例子来解释 JavaScript 闭包的概念，即使新手也可以轻松参透闭包的含义。 其实只要理解了核心概念，闭包并不是那么的难于理解。但是，网上充斥了太多学术性的文章，对于新...

谈谈 JS 中的高级函数

该文章详细阐述了 JS 中常用的若干个高级函数，讲述了它们的原理以及实现细节，并通过例子演示了它们的用法

转变思维，更好地理解 js 程序设计

从事前端开发很久了，有幸在刚开始时就认识了一个教我面向对象思维的人，这种思维方式一直受用到今天。所以很想写一篇关于这方面的一点感受。对于一个码农来说，这样的文章不太好写，没有生动的图片，没有代码展示。但我觉得很重要，所以很想写出来。js 中

跨域那点事，JSONP 的秘密

如果你是一个 WEB 开发人员，你肯定遇到过跨域的问题。什么是跨域？我先假装你们不知道(^..^嘻嘻)，域名你们都知道，比如 www.baidu.com ，www.jd.com 等都属于域名，如果我想在京东的页面中通过一个关键字来请求百度获取搜索结果，这就是一个跨域请求。 举个例子：民间一位姓陈的人家有一手上好的酿酒本事。他们家立下规矩...

使用 vue 构建移动应用

在移动应用中很多功能都是必不可少的，使用 vue 构建移动应用自然也就需要实现这些功能。之所以写这篇文章，是希望大家能更多的将注意力放在项目的核心业务上，而不是过多的关注通用功能。

date-fns —— 轻量级的 JavaScript 日期库

在 JavaScript 中处理日期是一件非常让人头疼的事情。原生的日期方法往往是冗长且不一致的，这给开发人员带来很大的困惑。但现在，好消息来了。现在已经有不少库，能让处理日期变得不再那么痛苦。这些库之于 JavaScript 原生的日期方法，就好比 jQuery 之于原生 DOM API。 举个例子。这是一个对 S

Vue 组件通信实践记录

组件通信 几乎所有的 mvvm 框架中都要涉及组件通信的功能（吐槽一下 knockout,毕竟是鼻祖就先不说它了）。而且目前的前端形式来看，组件化是一个项目的基础。所以选好一个合适的框架后，随着组件的不断增加，业务的复杂度提升，组件之间的通信变得尤为重要。 实践方法

Express 实战（二）：Node.js 基础

在上一篇文章中，我们简单的介绍了 Node.js 。了解到它基于 JavaScript、天生异步、拥有大量的第三方类库。本文将会在之前的基础上，对 Node.js 进行更深入的介绍。其中主要内容包括：Node 的安装 如何使用第三方模块生态 第三方模块的安装 一些简单的使用示例 开发过程中的一些建议和技巧 在...

探索 vue-spa 全家桶项目,解析配置,目录结构,路由以及状态管理的实现,附源码

1.简介 项目是一个简单的权限管理页面,分为 3 个页面,首页,账户中心,登录页通过 vue-router 对于路由做权限控制,首页无需登录,跳转账户中心会自动检索是否登录,登录之后首页的登录按钮变为退出按钮,页面之间的的状态管理全部通过 vuex 进行管理 项目演 1.简介 项目是一个简单的权限管理页面,分为 3 个页面,首

一个移动微应用，让你掌握 React 开发核心理念

基于 react + redux + react-router 构建的移动端单页微应用，适合于 react、redux、react-router 核心概念的理解与掌握。

重温 vue 双向绑定原理解析

摘要：因为项目刚开始用的 vue 框架，所以早期也研究了一下他的代码看过相关文章的解析，说说也能说个七七八八。不过今天再去看以前的 demo 的时候，发现忽然一知半解了，说明当时可能也没有理解透，所以写篇文章让自己理解的更深一些。 本篇文章大多数知识点实在学习了这篇 摘要：因为项目刚开始用的 vue 框架，所以早期也研究了一下他的代码看过相关文章的解析，说说也能说个七七八八。不过今

编写自己的代码库(css3 常用动画的实现)

1.前言 在月初的时候，发了 CSS3 热身实战--过渡与动画（实现炫酷下拉，手风琴，无缝滚动）。js 的代码库也发过两次，两篇文章。之前也写了 css3 的热身实战，既然热身完了，是时候开始封装 css3 的代码库了，相比起 js 的...

页面滚动时自动显示隐藏导航效果（ jQuery ）

介绍一个简单的导航效果，当用户向下滚动页面时自动隐藏导航，在用户向上滚动页面时自动显示导航。 支持 IE9+，Chrome，Safari，FireFox … 自动显示隐藏导航这种交互出现已经有一段时间了，特别是在移动设备上。 这种 UX 模式背后的想法简单而有效：我们

2017 JS 开发指南

过去几年可能你一直在写接口。也许一直在优化你们公司数据的搜索速度，也可能在为微波炉写嵌入式程序。是否记得那时你摆弄 Prototype.js ，已经过去好长一段时间了。现在你决定是时候提升自己的前端技能了，这时你将看到这样一幅风景: 当然你不是在里面寻找某人，而且随机寻找 25 个人，你甚至都不知道他们的名字...

React Web 动画的 5 种创建方式，每一种都不简单

以前一直投入在 React Native 中，写动画的时候不是用 CSS 中的 transitions / animations，就是依赖像 GreenSock 这样的库，最近转向 Web，在 Tweet 得到很多大佬关于 React Web 动画 的回应，于是决定分享给大...

学习 React.js 比你想象的要简单

原文地址：Learning React.js is easier than you think 原文作者：Samer Buna 译文出自：掘金翻译计划 本文永久链接：github.com/xitu/gold-m … 译者：Cherry 校对者：LeviDing、 原文地址：Learning React.js is easier than you think

JS 面向对象程序设计

面向对象(Object-Oriented, OO)的语言有一个标志，那就是都有类的概念，通过类可以创建任意多个具有相同属性和方法的对象。而 ECMA-262 把对象定义为：“无序属性的集合，其属性可以包含基本值、对象或函数”。其对象的创建主要有两种方式，对象字面量 面向对象(Object-Oriented, OO)的语言有一个标志，那就是都有类的概念，通过类可以创建任意多个具有

浅谈 Vue 组件传递数据与通信

对于使用 Vue 的新手来说，组件之间的数据传递一直是一个比较头疼的问题，在实际开发中我也踩了些坑，简单的做一个总结： 父子组件之间的数据传递

ES6 变量声明与赋值：值传递、浅拷贝与深拷贝详解

ES6 变量声明与赋值：值传递、浅拷贝与深拷贝详解归纳于笔者的现代 JavaScript 开发：语法基础与实践技巧系列文章。本文首先介绍 ES6 中常用的三种变量声明方式，然后讨论了 JavaScript 按值传递的特性，最后介绍...

** [ js 基础 ] Javascript “继承”**

是时候写一写 “继承”了，为什么加引号，因为当你阅读完这篇文章，你会知道，说是 继承 其实是不准确的。 一、类 1、传统的面向类的语言中的类： 类／继承 描述了一种代码的组织结构形式。举个例子： “汽车”可以被看作是“交通工具”的一种特例。 我们可以定义一个 Vehicle 类和一个 Car 类来对这种关系进行描述...

前端每周清单第 26 期：Node.js 微服务实践，Vue.js 与 GraphQL，Angular 组件技巧，HeadlessChrome 攻防

作者：王下邀月熊 编辑：徐川 前端每周清单专注前端领域内容，以对外文资料的搜集为主，帮助开发者了解一周前端热点；分为新闻热点、开发教程、工程实践、深度阅读、开源项目、巅峰人生等栏目。欢迎关注 [前端之巅] 微信公众号（ ID：frontshow ），及时获取

All About React Router 4

My intentions for this article aren ’ t to rehash the already well-written documentation for React Router 4. I will cover the most c

快速理解 JavaScript 中的 LHS 和 RHS 查询

简述编译原理 JavaScript 程序中的一段源代码在执行之前会经历三个步骤，统称为 编译 分词 /词法分析 解析 /语法分析 代码生成 先看原书对一个赋值操作的拆解说明： 变量的赋值操作会执行两个动作，首先编译器会在当前作用域中声明一个变量（如果之前没有声明过），然...

深入浅出 JavaScript 的 Array.prototype.sort 排序算法

本文要解决的问题 1、找出 Array.prototype.sort 使用的什么排序算法 2、用一种直观的方式展示 Array.prototype.sort 的时间复杂度，看看它有多快？ 3、实际开发中要注意的问题 Array.prototype.sort 各浏览器的...

使用 Node.js 搭建一个 API 网关

原文地址：Building an API Gateway using Node.js 原文作者：Péter Márton 译文出自：掘金翻译计划 本文永久链接：github.com/xitu/gold-m … 译者：MuYunyun 校对者：jasonxia23

使用 offline-plugin 搭配 webpack 轻松实现 PWA

谈起 PWA，许多人可能还只停留在“了解”的层面，比较少在实践中真正地尝试过，更多的仅仅是对着网上的教程和例子大概玩过。然而，网络上的例子多是简单的 demo，鲜有与真正的开发相结合，例如和 webpack 的工程化结合。这篇文章将会从一个 webpack plugin

浅谈 redux-form 在项目中的运用

redux-form 的使用心得

使用 Yeoman 定制前端脚手架

首先附上 Yeoman 官网：yeoman.io/ 我制作的前端脚手架：generator-jake-front 以及我在前端同学的分享会上的分享 ppt：yeoman.key 如果想快速制作一个脚手架，并且不需要实现特别复杂的定制化，看完这篇文章足够，如果想要实现

Css Grid 高亮 | Chrome 插件

How to install Download repo Extract zip file Drag 'n drop folder -> Chrome Extensions (chrome://e

20 条实用的 git 命令

个人总结出的一些实用的 git 命令，分享给大家。git config --global color.ui true 让 git 命令默认使用彩色输出。 这条命令在 git 2 之后已经成为默认配置，但如果你还在用比较老的版本（例如 CentOS 上的默认...

来自官方博客：Bootstrap 4 Beta 发布

本文翻译自 Boostrap 开发团队官方博客。 经过两年的开发，我们终于发布了第一个 beta 版本的 Bootstrap 4。在此之间，我们一共把代码彻彻底底搞砸了至少 27 次，提交了将近 5,000 个 commit，修改了 650+ 个文件，添加了

JavaScript 机器学习库：DeepLearn.js

详见：DeepLearn.js 是由谷歌开源的可实现硬件加速的 JS 机器学习库，它旨在提供高效的机器学习构建模块，使我们能够在浏览器中训练神经网络，并在推断模式中运行预训练模型。

** [干货] vue 源代码简单解析**

最近饶有兴致的又把最新版 Vue.js 的源码学习了一下，觉得真心不错，个人觉得 Vue.js 的代码非常之优雅而且精辟，作者本身可能无 (bu) 意 (xie) 提及这些。那么，就让我来吧：） 程序结构梳理 Vue 程序结构 Vue.j...

原文：https://mp.weixin.qq.com/s/r9Mha_23CNVFuzEGKN_6sA

前端开发博客

——————————————————

领略前端技术 阅读前端开发博客

扫描二维码，关注前端开发博客

▼