前端考题：二期

[aototo]

1.Js如何实现继承？

js通过构造函数来类，因为js没有类, 通过原型链实现继承，或者通过复制属性

//创建一个Dog的构造函数, 构造函数大写开头。
function Dog() {
}
// 通过注入prototype属性，来实现对象需要共享的属性和方法
Dog.prototype.call = function() {
    alert("汪")
}
//创建哈士奇，继承狗
function Husky(name) {
   this.name = name;
}

Husky.prototype = new Dog(); //这里是原型链矫正

Husky.prototype.variety = "哈士奇";

var variety1 = new Husky("小哈")

---

2.浏览器缓存

具体的内容太多了，推荐一篇文章讲的很棒 浅谈浏览器http的缓存机制

---

3.margin重叠的现象，如何解决？

上下相邻的普通元素，上下margin边距取其中较大的边距值。 比如：

div.top {
   margin-bottom: 30px;
} 
div.bottom {
   margin-top: 30px;
} 
// 此时它们之间还是只有30px。

第一种： 触发BFC就可以解决margin重叠的现象，可以通过以下触发BFC：

• 浮动元素，float 除 none 以外的值
• 绝对定位元素，position（absolute，fixed）
• display 为以下其中之一的值 inline-blocks，table-cells，table-captions
• overflow 除了 visible 以外的值（hidden，auto，scroll）

关于BFC可以看这篇文章，BFC详说

第二种： 解决margin重叠的可以用padding代替margin

---

4.解释下浮动和它的工作原理？清除浮动的技巧

在浮动布局中，元素首先按照普通流的位置出现，然后根据浮动的方向尽可能的向左边或右边偏移，其效果与印刷排版中的文本环绕相似。浮动元素脱离文档流，不占据空间。

清除浮动可以让元素实现BFC来解决，overflow: hidden 或 overflow: auto 触发浮动元素父元素的 BFC 特性，从而可以包含浮动元素，闭合浮动。

清除浮动的技巧：

1.使用空标签清除浮动，定义css clear:both. 问题增加了无意义标签。

2.浮动元素的父标签添加css属性overflow:auto; zoom:1; zoom:1用于兼容IE6。

3.使用after伪对象清除浮动。代码如下

.clearfix {
    zoom: 1;
}

.clearfix:after {
     visibility: hidden;
     display: block;
     font-size: 0;
     content: " ";
     clear: both;
     height: 0;
 }

---

5.利用函数编程思想写一个add(1)(1,2,3)()

利用函数编程的惰性求值， 下面是我写的

function add() {
  //把arguments转成array对象
  var _args = Array.prototype.slice.apply(arguments);

  return function() {
    if ( arguments.length > 0 ) {
      var newArgs = Array.prototype.slice.apply(arguments);
      _args = _args.concat(newArgs);
      return add.apply(null, _args)
    }

    return _args.reduce(function(a, b) {
      return a + b;
    })
  }
}

var a = add(1,2,3)(2)

[qixiuss]

有几道题描述的不太清楚，稍微提下

1. 第一题并没有继承，而是简单用 构造函数 + 原型 模拟类的实现
2. 第三题的本质都是构造BFC，让盒子彼此独立，互不影响，从而解决margin折叠的问题
3. 第四题并没有说出浮动的原理，清理浮动的办法主要两种：clear和BFC

[aototo]

@qixiuss 谢谢提醒，BFC确实是解决这些问题，如何触发 BFC的方法就是上面提供的，在回答的时候确实回答不够专业详细，第一题模拟类的实现，却没有接下去写类的继承！谢谢提醒。