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

JavaScript 中 8 个常见的陷阱；从 vue-router 看前端路由的两种实现；如何使用CSS创建巧妙的动画提示框；百度外卖如何做到前端开发配置化；高仿阴阳师官网轮播图—jQuery插件；Vuejs 技术栈从 CLI 到打包上线实战全解析；基于 Spring MVC 的 RESTful HTTP API 实践（服务端）；HTML编码规范

JavaScript 中 8 个常见的陷阱译者按: 漫漫编程路，总有一些坑让你泪流满面。原文: Who said javascript was easy ? 译者: Fundebug 为了保证可读性，本文采用意译而非直译。另外，本文版权归原作者所有，翻译仅用于学习。这里我们针对JavaScript初学者给出一些技巧和列出一些陷阱。如果你已经是一个砖家，也可以读一读…
从 vue-router 看前端路由的两种实现本文由浅入深观摩vue-router源码是如何通过hash与History interface两种方式实现前端路由，介绍了相关原理，并对比了两种方式的优缺点与注意事项。最后分析了如何实现可以直接从文件系统加载而不借助后端服务器的Vue单页应用。随着前端应用的业务功能越来越复杂、用户对于使用体验的要求越来越高，单页应…
如何使用CSS创建巧妙的动画提示框原文：https://webdesign.tutsplus.co…原作：Jase Smith翻译：Stypstive 当你的用户需要漂亮的图标给出额外的文字信息时，亦或是当他们在点击了按钮之后需要确认自己没点错时，又或是带图片和字幕的复活节彩蛋…
百度外卖如何做到前端开发配置化内容来源：2017年5月13日，徐辛承在“H5梦工场”进行《前端开发配置化方案》演讲分享。IT大咖说作为独家视频合作方，经主办方和讲者审阅授权发布。阅读字数：2017 | 9分钟阅读摘要前端开发的主要职能就是把网站的界面更好地呈现给用户，它涵盖的知识面
高仿阴阳师官网轮播图—jQuery插件高仿阴阳师官网轮播图效果的插件，利用CSS3属性实现轮播效果，对于ie9以下等不支持CSS3属性的浏览器不兼容。 —— 由弦云孤赫分享
Vuejs 技术栈从 CLI 到打包上线实战全解析 Vue 项目实践中的一些总结，针对 Vue2 及相关技术栈，实践中版本为 2.3.3。 —— 由nqxnl分享
基于 Spring MVC 的 RESTful HTTP API 实践（服务端）理解 REST REST（Representational State Transfer）,中文翻译叫“表述性状态转移”。是 Roy Thomas Fielding 在他2000年的博士论文中提出的。它与传统的 SOAP Web 服务区别在于，REST关注的是要处理的数据，而 SOAP 主要关注行为和处理。要理解好 REST，根据其首字母拆分出的英文更容易理解。表述性（Representat…
HTML编码规范这段时间在整理前端部分代码规范，初步想法是从HTML、CSS、Javascipt、项目文件目录四部分是整理。之前已经整理完了CSS编码规范，有兴趣可以了解下 1. 代码风格 1.1缩进与换行 [强制] 使用 4 个空格做为一个缩进…
深入理解 React 组件状态 React 的核心思想是组件化的思想，应用由组件搭建而成，而组件中最重要的概念是State（状态），State是一个组件的UI数据模型，是组件渲染时的数据依据。一. 如何定义State 定义一个合适的State，是正确创建组件的第一步。State必须能代表一个组件UI呈现的完整状态集，即组件的任何UI改变，都可以从State的变化中反映出…
TypeScript 2.4 发布 | 支持动态 import 此版本支持了 ES6 支持的 module import 来提高性能，并可以自动打包 bundle 文件；在 enum 里支持了 String Initializers 等 —— 由kalasoo分享
前端高亮功能实现复盘前端高亮功能实现复盘 “高亮”功能，个人觉得没必要再解释什么了。作为一名程序猿，天天都会接触高亮：写代码时的语法高亮；使用搜索引擎时的搜索结果高亮。作为一名前端，如果你做过与搜索相关的功能，那么你很有…
我所认识的 JavaScript 作用域链和原型链毕业也整整一年了，看着很多学弟都毕业了，忽然心中颇有感慨，时间一去不复还呀。记得从去年这个时候接触到JavaScript,从一开始就很喜欢这门语言，当时迷迷糊糊看完了《JavaScript高级程序设计》这本书，似懂非懂。这几天又再次回顾了这本书，之前很多不理解
前端性能测试必备工具清单前端性能测试，讲的还是很清晰的。 —— 由LeviDing分享
#CSS#【CSS 新的长度单位 fr是怎么用的？】css fr 单位是一个自适应单位，fr单位被用于在一系列长度值中分配剩余空间，如果多个已指定了多个部分，则剩下的空间根据各自的数字按比例分配。 #前端开发博客#
JS的平凡之路–模仿Vue写个简单的对象监听本篇实现的仅仅是对象监听，不包含数组。关于数组的下一篇会讲。一、用什么来监听对象? Vue给了我们很好的回答，那就是defineProperty。defineProperty方法有以下几个参数: obj: 你要设置属性的对象； p
了解CSS3位移时间属性 – 众成翻译 Understanding The CSS3 transition-timing-function Property。原文地址：https://www.smashingmagazine.com/2014/04/understanding-css-timing-functions/ —— 由AleCC分享
Webpack 的核心开发者 Sean Larkin 入驻 SegmentFault 了最近 Webpack 核心开发者 Sean 同学想跟中国的开发者有更多的交流，有不少社区的同学喊我邀请 Sean 也来 SegmentFault 入驻，跟开发者一起交流，谈笑风生。这我当然是支持的了。在 SF 社区大V @justjavac 同学的…
前端学习指南 Study guide and introduction to the modern front end stack. —— 由彷梓分享
Thrift前端上手实例这个项目用来帮助那些对thrift感兴趣的前端们上手thrift，你可以把它认为是一个简易的使用案例或是指南，毕竟thrift的官方文档真的很简单… —— 由runyuweng分享
必备的几个RxJS operator使用介绍, 拯救你的JavaScript RxJS起源于微软最早提出的ReactiveX范式，是一套异步框架处理规范(相当于promise是javascript对异步的统一规范), 也是作为promise超集的存在。使用RxJS主要是抽象了异步处理逻辑，从局部管理异步状态中解耦，让代码的可读性可维护性更高。 —— 由相学长分享
如何在非 React 项目中使用 Redux 本文作者：胡子大哈原文链接：https://scriptoj.com/topic/178/如何在非-react-项目中使用-redux 转载请注明出处，保留原文链接和作者信息。目录 1、前言 2、单纯使用 Redux 的问题 2.1、问题 1：代码
《React如何优雅地写单页面应用？》为了追求极致的用户体验，很多Web应用采用单页面方式呈现，然而单页面应用，往往对应着高复杂度，比如多层次路由配置、统一数据处理等，这需要项目有一个强大的技术架构和友好的构建环境来支撑。（by 张小龙）
Awe JavaScript [1] 基本概念 JavaScript 的基本知识点，包括语法、操作符、变量、语句和函数等。做了几个项目后，回来看看红宝书，看看知识点。 —— 由LeviDing分享
Chromium 新的弹窗机制以及 HTML 的 <dialog> 元素 – @justjavac – 掘金专栏自 1995 年 JavaScript 诞生之初，就包含了 3 个方法 alert()、confirm() 和 prompt()。在随后的 Chrome 版本中，Chrome 团队一直在修改原生弹窗的表现。但是这种阻断式的弹窗总被各种广告网站恶意使用，因为只
JavaScript匿名函数以及在循环中的匿名函数一历史 JavaScript其实是一门奇异的语言，TA的一大特性是没有块级作用域 {代码…} 大家猜测下值是多少？答案是 10，虽然我们在一个块内申明了变量，但i却是在全范围内起作用的，所以就引入了匿名函数 {代码……