实现一个LazyMan，可以按照以下方式调用：

LazyMan(“Hank”)

输出：Hi! This is Hank!

LazyMan(“Hank”).sleep(10).eat(“dinner”)

输出: Hi! This is Hank!

现在很少接触到太多的 CSS 问题了，多数情况下 flex 都是最佳的选择，慢慢也就对基础生疏了，今天来总结下常见的布局问题。示例中关于 flex 的布局都比较简单，不理解的需要重新补习 flex 基础。本文中的示例和代码都在 codepen 上，如果加载异常请先科学上网。

具有固定宽高的布局方式在实际需求中其实很少见，一般都会有自适应的区域，接下来就来看看常用的几种布局。

又到了新的一年，总结一下过去的 2016 。翻看年初所定的目标，虽说有些没有很好的完成，然而还是觉得能给这一年打 80 分。此时我刚刚踏入前端一年半，真正参加工程化的项目不足一年，但恰恰是今年让我系统的理解了前端，对工作也更加游刃有余。

在《JavaScript 高级程序设计》中提到使用 new 操作符会经历 4 个步骤：

(1) 创建一个新对象；

(2) 将构造函数的作用域赋给新对象（因此 this 就指向了这个新对象）；

(3) 执行构造函数中的代码（为这个新对象添加属性）；

(4) 返回新对象。

前些天恰好遇到用 jQuery 提交一个上传的文件一直出错，这里记录一下原因。

我们的项目本身是使用了 vue 的，但是历史原因同时也保留了 jQuery ，然后项目中用 Promise 重新封装了 jQuery 的 Ajax 方法。之前有一个共用的 upload 的上传组件，里面使用了原生 XHR ，没有遇到上传文件的问题，但是我在使用 jQuery 的 Ajax 时却怎么都办法上传，检查发现是 content-type 导致的问题。

在没有 HTML5 之前，前端的图片预览都是在用户选择图片后就发 Ajax 到服务端，然后由服务端再把图片的 URL 返还给前端来完成的。有了 HTML5 后，在 IE10 以上及代浏览器的版本中我们便无须发请求获得 URL 来完成预览了。这些将依靠 FileReader 来实现。

对于点击按钮就能复制一个链接或其他内容的操作，在很多网站都会有用到。使用原生的js方法 document.execCommand 即可实现，它能够对可以编辑的文档对象（设置contentEditable等）进行操作。

语法

它的基本语法如下：

1

bool = document.execCommand(aCommandName, aShowDefaultUI, aValueArgument)

在当前的前端时代，react，vue等框架配合ES6满足了日常的多数开发需求，但是了解jQuery的插件开发在我们开发一些小型项目中还是很有用处。我们可以打造自己的插件达到复用的效果。

去除select等标签默认浏览器样式的方式：

1
2
3
4
5
6
7
8
9
10

select {
	-webkit-appearance: none;  /* chrome */
	   -moz-appearance: none;  /* firefox */
	        appearance: none;
}

/* IE */
select::-ms-expand {
	display: none;
}

Flexible Box Layout

CSS 弹性框布局是 CSS 的模块之一，定义了一种针对用户界面设计而优化的 CSS 框模型。在弹性布局模型中，弹性容器的子元素可以在任何方向上排布，也可以“弹性伸缩”其尺寸，既可以增加尺寸以填满未使用的空间，也可以收缩尺寸以避免父元素溢出。子元素的水平对齐和垂直对齐都能很方便的进行操控。通过嵌套这些框（水平框在垂直框内，或垂直框在水平框内）可以在两个维度上构建布局。