02 2017 档案
摘要：一. 输入url后的加载过程 从输入 URL 到页面加载完成的过程中都发生了什么 计算机网络体系结构 应用层(HTTP、SMTP、FTP、POP3) 运输层(TCP、UDP) 网络层(IP(路由器)) 数据链路层(网桥(CSMA/CD、PPP)) 物理层(集线器) 1. 查找域名对应IP地址 这一步
阅读全文
摘要：原题来自: http://javascript-puzzlers.herokuapp.com/ 读者可以先去做一下感受感受. 当初笔者的成绩是 21/44... 当初笔者做这套题的时候不仅怀疑智商, 连人生都开始怀疑了.... 不过, 对于基础知识的理解是深入编程的前提. 让我们一起来看看这些变态题
阅读全文
摘要：曾几何时为了兼容IE低版本浏览器而头痛，以为到Mobile时代可以跟这些麻烦说拜拜。可没想到到了移动时代，为了处理各终端的适配而乱了手脚。对于混迹各社区的偶，时常发现大家拿手机淘宝的H5页面做讨论——手淘的H5页面是如何实现多终端的适配？ 那么趁此Amfe阿里无线前端团队双11技术连载之际，用一个实
阅读全文
摘要：2.在开发移动端页面的时候，我们需要兼容各种机型，iphone的机型相对来说比较少，但是android的机型却是多种多样，如果按照以前pc上开发页面的经验使用px来开发，肯定会遇到各种兼容问题。虽然可以用media query来适配，但是这种适配将是一个非常繁琐的事情。那有没有更好的解决办法呢？当然
阅读全文
摘要：原文链接：http://caibaojian.com/mobile-web-bug.html 第一篇是外观表现： 字体设置建议： body { font-family: "Helvetica Neue", Helvetica, STHeiTi, sans-serif; } 字体设置· iOS 4.0
阅读全文
摘要：1.前言 最近有很多朋友问我有没有相关的书籍推荐，希望能够自学一下前端。 正好最近在查阅文章的时候，发现有朋友已经进行过总结。 经过沟通和“行贿”😁，终于取得转载权利，在此感谢晚晴幽草的大力帮助。 作者将原素材文章进行了新内容的添加和重新排列，但是因为文章链接过多，难免会出现原始内容失效等问题，请
阅读全文
摘要：No1.语法和类型 1.声明定义 变量类型：var，定义变量；let，定义块域(scope)本地变量；const，定义只读常量。变量格式：以字母、下划线“_”或者$符号开头，大小写敏感。变量赋值：声明但未赋值的变量在使用时值为undefined，未声明的变量直接使用会抛异常。未赋值变量作计算：结果为
阅读全文
摘要：参考链接 官方文件 ECMAScript® 2015 Language Specification: ECMAScript 2015规格 ECMAScript® 2016 Language Specification: ECMAScript 2016规格 ECMAScript® 2017 Langu
阅读全文
摘要：SIMD 概述 SIMD（发音/sim-dee/）是“Single Instruction/Multiple Data”的缩写，意为“单指令，多数据”。它是 JavaScript 操作 CPU 对应指令的接口，你可以看做这是一种不同的运算执行模式。与它相对的是 SISD（“Single Instru
阅读全文
摘要：二进制数组 二进制数组（ArrayBuffer对象、TypedArray视图和DataView视图）是 JavaScript 操作二进制数据的一个接口。这些对象早就存在，属于独立的规格（2011年2月发布），ES6 将它们纳入了 ECMAScript 规格，并且增加了新的方法。 这个接口的原始设计目
阅读全文
摘要：读懂 ECMAScript 规格 概述 规格文件是计算机语言的官方标准，详细描述语法规则和实现方法。 一般来说，没有必要阅读规格，除非你要写编译器。因为规格写得非常抽象和精炼，又缺乏实例，不容易理解，而且对于解决实际的应用问题，帮助不大。但是，如果你遇到疑难的语法问题，实在找不到答案，这时可以去查看
阅读全文
摘要：编程风格 本章探讨如何将ES6的新语法，运用到编码实践之中，与传统的JavaScript语法结合在一起，写出合理的、易于阅读和维护的代码。 多家公司和组织已经公开了它们的风格规范，具体可参阅jscs.info，下面的内容主要参考了Airbnb的JavaScript风格规范。 块级作用域 （1）let
阅读全文
摘要：Module 的加载实现 上一章介绍了模块的语法，本章介绍如何在浏览器和 Node 之中加载 ES6 模块，以及实际开发中经常遇到的一些问题（比如循环加载）。 浏览器加载 传统方法 在 HTML 网页中，浏览器通过<script>标签加载 JavaScript 脚本。 上面代码中，由于浏览器脚本的默
阅读全文
摘要：Module 的语法 概述 历史上，JavaScript 一直没有模块（module）体系，无法将一个大程序拆分成互相依赖的小文件，再用简单的方法拼装起来。其他语言都有这项功能，比如 Ruby 的require、Python 的import，甚至就连 CSS 都有@import，但是 JavaScr
阅读全文
摘要：修饰器 类的修饰 修饰器（Decorator）是一个函数，用来修改类的行为。这是ES7的一个提案，目前Babel转码器已经支持。 修饰器对类的行为的改变，是代码编译时发生的，而不是在运行时。这意味着，修饰器能在编译阶段运行代码。 上面代码中，@testable就是一个修饰器。它修改了MyTestab
阅读全文
摘要：Class Class基本语法 概述 JavaScript语言的传统方法是通过构造函数，定义并生成新对象。下面是一个例子。 上面这种写法跟传统的面向对象语言（比如C++和Java）差异很大，很容易让新学习这门语言的程序员感到困惑。 ES6提供了更接近传统语言的写法，引入了Class（类）这个概念，作
阅读全文
摘要：async 函数 含义 ES2017 标准引入了 async 函数，使得异步操作变得更加方便。 async 函数是什么？一句话，它就是 Generator 函数的语法糖。 前文有一个 Generator 函数，依次读取两个文件。 写成async函数，就是下面这样。 一比较就会发现，async函数就是
阅读全文
摘要：Promise 对象 Promise 的含义 Promise 是异步编程的一种解决方案，比传统的解决方案——回调函数和事件——更合理和更强大。它由社区最早提出和实现，ES6将其写进了语言标准，统一了用法，原生提供了Promise对象。 所谓Promise，简单说就是一个容器，里面保存着某个未来才会结
阅读全文
摘要：Iterator和for...of循环 Iterator（遍历器）的概念 JavaScript原有的表示“集合”的数据结构，主要是数组（Array）和对象（Object），ES6又添加了Map和Set。这样就有了四种数据集合，用户还可以组合使用它们，定义自己的数据结构，比如数组的成员是Map，Map
阅读全文
摘要：Reflect 概述 Reflect对象与Proxy对象一样，也是 ES6 为了操作对象而提供的新 API。Reflect对象的设计目的有这样几个。 （1） 将Object对象的一些明显属于语言内部的方法（比如Object.defineProperty），放到Reflect对象上。现阶段，某些方法同
阅读全文
摘要：Proxy 概述 Proxy 用于修改某些操作的默认行为，等同于在语言层面做出修改，所以属于一种“元编程”（meta programming），即对编程语言进行编程。 Proxy 可以理解成，在目标对象之前架设一层“拦截”，外界对该对象的访问，都必须先通过这层拦截，因此提供了一种机制，可以对外界的访
阅读全文
摘要：Symbol 概述 ES5的对象属性名都是字符串，这容易造成属性名的冲突。比如，你使用了一个他人提供的对象，但又想为这个对象添加新的方法（mixin模式），新方法的名字就有可能与现有方法产生冲突。如果有一种机制，保证每个属性的名字都是独一无二的就好了，这样就从根本上防止属性名的冲突。这就是ES6引入
阅读全文
摘要：Set和Map数据结构 Set 基本用法 ES6 提供了新的数据结构 Set。它类似于数组，但是成员的值都是唯一的，没有重复的值。 Set 本身是一个构造函数，用来生成 Set 数据结构。 上面代码通过add方法向 Set 结构加入成员，结果表明 Set 结构不会添加重复的值。 Set 函数可以接受
阅读全文
摘要：对象的扩展 属性的简洁表示法 ES6允许直接写入变量和函数，作为对象的属性和方法。这样的书写更加简洁。 上面代码表明，ES6 允许在对象之中，直接写变量。这时，属性名为变量名, 属性值为变量的值。下面是另一个例子。 除了属性简写，方法也可以简写。 下面是一个实际的例子。 这种写法用于函数的返回值，将
阅读全文
摘要：函数的扩展 函数参数的默认值 基本用法 在ES6之前，不能直接为函数的参数指定默认值，只能采用变通的方法。 上面代码检查函数log的参数y有没有赋值，如果没有，则指定默认值为World。这种写法的缺点在于，如果参数y赋值了，但是对应的布尔值为false，则该赋值不起作用。就像上面代码的最后一行，参数
阅读全文
摘要：数值的扩展 二进制和八进制表示法 ES6 提供了二进制和八进制数值的新的写法，分别用前缀0b（或0B）和0o（或0O）表示。 从 ES5 开始，在严格模式之中，八进制就不再允许使用前缀0表示，ES6 进一步明确，要使用前缀0o表示。 如果要将0b和0o前缀的字符串数值转为十进制，要使用Number方
阅读全文
摘要：数组的扩展 Array.from() Array.from方法用于将两类对象转为真正的数组：类似数组的对象（array-like object）和可遍历（iterable）的对象（包括ES6新增的数据结构Set和Map）。 下面是一个类似数组的对象，Array.from将它转为真正的数组。 实际应用
阅读全文
摘要：正则的扩展 RegExp构造函数 在ES5中，RegExp构造函数的参数有两种情况。 第一种情况是，参数是字符串，这时第二个参数表示正则表达式的修饰符（flag）。 第二种情况是，参数是一个正则表示式，这时会返回一个原有正则表达式的拷贝。 但是，ES5不允许此时使用第二个参数，添加修饰符，否则会报错
阅读全文
摘要：字符串的扩展 ES6加强了对Unicode的支持，并且扩展了字符串对象。 字符的Unicode表示法 JavaScript允许采用\uxxxx形式表示一个字符，其中“xxxx”表示字符的码点。 但是，这种表示法只限于\u0000——\uFFFF之间的字符。超出这个范围的字符，必须用两个双字节的形式表
阅读全文
摘要：数组的解构赋值 基本用法 ES6 允许按照一定模式，从数组和对象中提取值，对变量进行赋值，这被称为解构（Destructuring）。 以前，为变量赋值，只能直接指定值。 ES6允许写成下面这样。 上面代码表示，可以从数组中提取值，按照对应位置，对变量赋值。 本质上，这种写法属于“模式匹配”，只要等
阅读全文
摘要：let和const命令 let命令 基本用法 ES6新增了let命令，用来声明变量。它的用法类似于var，但是所声明的变量，只在let命令所在的代码块内有效。 上面代码在代码块之中，分别用let和var声明了两个变量。然后在代码块之外调用这两个变量，结果let声明的变量报错，var声明的变量返回了正
阅读全文
摘要：Generator 函数的异步应用 异步编程对 JavaScript 语言太重要。Javascript 语言的执行环境是“单线程”的，如果没有异步编程，根本没法用，非卡死不可。本章主要介绍 Generator 函数如何完成异步操作。 传统方法 ES6 诞生以前，异步编程的方法，大概有下面四种。 回调
阅读全文
摘要：Generator 函数的语法 简介 基本概念 Generator 函数是 ES6 提供的一种异步编程解决方案，语法行为与传统函数完全不同。本章详细介绍Generator 函数的语法和 API，它的异步编程应用请看《Generator 函数的异步应用》一章。 Generator 函数有多种理解角度。
阅读全文
摘要：补充：http://nokit.org/ https://thinkjs.org/zh-cn/doc/index.html Node.js 是一个基于Chrome JavaScript 运行时建立的一个平台， 用来方便地搭建快速的， 易于扩展的网络应用· Node.js 借助事件驱动， 非阻塞 I/
阅读全文
摘要：背景 上图是一个典型的采用 Node.js 开发 web 应用的前后端结构，下面介绍一下 Node 服务层在其中的作用以及使用 Node.js 的一些优劣。 Node 服务层作用： 请求代理 传统做法是后端提供 api 供前端直接调用，但后端逐渐趋于服务化，直接调用面临的问题有： 跨域 数据需要二次
阅读全文
摘要：一. 资源教程: 综合类 前端知识体系 前端知识结构 Web前端开发大系概览 Web前端开发大系概览-中文版 Web Front-end Stack v2.2 En类资源汇总 免费的编程中文书籍索引 前端书籍 前端免费书籍大全 免费的编程中文书籍索引 智能社 - 精通JavaScript开发 重新介
阅读全文
摘要：一、简单明快的早期时代 可称之为 Web 1.0 时代，非常适合创业型小项目，不分前后端，经常 3-5 人搞定所有开发。页面由 JSP、PHP 等工程师在服务端生成，浏览器负责展现。基本上是服务端给什么浏览器就展现什么，展现的控制在 Web Server 层。 这种模式的好处是：简单明快，本地起一个
阅读全文
摘要：ES6 http://es6.ruanyifeng.com/#docs/generator Javascript UI CSS HTML Angular React Vue Node Gulp 其他 分享功能 在线演示 富文本编辑器 Chrome 性能优化 CDN Git Sass&Less Mar
阅读全文
摘要：目录 一、写在前面 1、free-programming-books 2、oh-my-zsh 3、awesome 4、github-cheat-sheet 5、android-open-project 6、awesome-android-ui 7、Android_Data 8、AndroidInte
阅读全文
摘要：好东西不是随便收集下，发篇博文，骗些点赞的！积累了5年多的东西，是时候放出来跟大家见见面了。 或许有的园友在14年的时候收藏过我的一篇“工欲善其事、必先利其器”的博文，时隔3年，已经做了N多更新，那篇文章也已被我删除，迁移至GitHub，重新进行管理。 这篇文章，大家可以推荐、收藏，让更多的人在园内
阅读全文
摘要：前端开发规范 基本准则 符合web标准, 语义化html, 结构表现行为分离, 兼容性优良. 页面性能方面, 代码要求简洁明了有序, 尽可能的减小服务器负载, 保证最快的解析速度. 文件规范 1、 html, css, js, images文件均归档至<系统开发规范>约定的目录中; 2、 html文
阅读全文
摘要：前端工作思路及技巧 一．项目准备 1.以产品原型为基准对项目进行评审，对项目进行分析、思考，提出问题进行沟通 2.以设计图为基准进行评审，对设计图颜色、布局、交互效果进行讨论沟通 3.根据项目周期制定合理的开发任务，以天为单位 4.根据项目与团队沟通，选择运用的框架及技术进行部署 二．项目开发 1.
阅读全文
摘要：目录 任务 1: 学会基本的HTML(5)标签骨架以及基本服务器概念 任务 2: 学会HTML5新增元素及CSS核心技术 任务 3: 学会CSS常用布局技巧以及绘制特殊图形和动画 任务 4: 掌握HTML+CSS的基本核心技巧 任务 5: JavaScript入门和基础 任务 6: 掌握JavaSc
阅读全文
摘要：一：Git是什么？ Git是目前世界上最先进的分布式版本控制系统。 二：SVN与Git的最主要的区别？ SVN是集中式版本控制系统，版本库是集中放在中央服务器的，而干活的时候，用的都是自己的电脑，所以首先要从中央服务器哪里得到最新的版本，然后干活，干完后，需要把自己做完的活推送到中央服务器。集中式版
阅读全文
摘要：1. 单个页面内容不能过多 设计常用尺寸：7501334 / 6401134，包含了手机顶部信号栏的高度。 移动端H5活动页面常常需要能够分享到各种社交App中，常用的有微信、QQ等。 使用移动设备查看页面时会发现，在微信浏览器中有顶部导航栏，在qq内置浏览器里不止有顶部导航，底部也有操作栏（saf
阅读全文
摘要：目录 专业的技巧 支持情况 贡献准则 专业的技巧 使用CSS复位 CSS重置帮助实施用干净的石板为造型元素在不同的浏览器风格的一致性。您可以使用CSS复位库像Normalize等，也可以使用一个更简化的复位方法： * { box-sizing: border-box; margin: 0; padd
阅读全文
摘要：H5项目常见问题及注意事项 H5页面 PSD转h5 http://h5.baidu.com/user Meta基础知识： H5页面窗口自动调整到设备宽度，并禁止用户缩放页面 H5页面窗口自动调整到设备宽度，并禁止用户缩放页面 //一、HTML页面结构 <meta name="viewport" co
阅读全文
摘要：一、大小不固定，多行文字的垂直居中 ① 单行文字 可能很多人都知道如何让单行文字垂直居中显示，就是使用line-height，将line-height值与外部标签盒子的高度值设置成一致就可以了。例如： 单行文字居中显示测试，css样式为：height:3em; line-height:3em;……
阅读全文