拼多多笔试总结

走过了拼多多的面试，又重新走向了笔试。顺便记录一下有意思的题目。

题目是这样的：设计一个函数mul，要你实现以下功能console.log(mul(1)(2)(3))//6 ;
console.log(mul(2)(3)(4))//24;

需要实现的功能就是输入三个参数，使三个参数相乘。
关键就在于每次都要return一个函数，代码见下：

var mul = function(a){
    return function(b){
        return function(c){
            return a*b*c;
        };
    };
};

当然，如果每次都传入不一样个数的参数的话，就不可能一直用这样一个调用，不然会造成回调地狱啦~方法当然是有的，详细见代码：

这种就是类似于执行一个函数返回函数自身值：

function mul(x) {
    var product= x;
    var tmp = function (y) {
        product = product * y;
        return tmp;
    };
    tmp.toString = function () {
        return product ;
    };
    return tmp;
}
console.log(mul(1)(2)(3));  //6
console.log(mul(1)(2)(3)(4));   //24

---

总结一下HTTP 2.0的一些新特性

HTTP2.0的标准总体目标是为了改善用户在使用web时候的速度体验(这些改进都是HTTP1.1中的痛点或者说是所遇到的瓶颈)。实现上主要是有7项技术：多路复用，流量控制，客户拖拽，服务器推送，WebSocket以及协商和TLS义务化。不过具体到平时的使用体验上，体现在如下几个方面:

与HTTP 1.1相比，主要区别包括

1. HTTP/2采用二进制格式而非文本格式
2. HTTP/2是完全多路复用的，而非有序并阻塞的——只需一个连接即可实现并行
3. 使用报头压缩，HTTP/2降低了开销
4. HTTP/2让服务器可以将响应主动“推送”到客户端缓存中

HTTP/2为什么是二进制？

比起像HTTP/1.x这样的文本协议，二进制协议解析起来更高效、“线上”更紧凑，更重要的是错误更少。

为什么 HTTP/2 需要多路传输?

HTTP/1.x 有个问题叫线端阻塞(head-of-line blocking), 它是指一个连接(connection)一次只提交一个请求的效率比较高, 多了就会变慢。 HTTP/1.1 试过用流水线(pipelining)来解决这个问题, 但是效果并不理想(数据量较大或者速度较慢的响应, 会阻碍排在他后面的请求). 此外, 由于网络媒介(intermediary )和服务器不能很好的支持流水线, 导致部署起来困难重重。而多路传输(Multiplexing)能很好的解决这些问题, 因为它能同时处理多个消息的请求和响应; 甚至可以在传输过程中将一个消息跟另外一个掺杂在一起。所以客户端只需要一个连接就能加载一个页面。

消息头为什么需要压缩?

假定一个页面有80个资源需要加载（这个数量对于今天的Web而言还是挺保守的）, 而每一次请求都有1400字节的消息头（着同样也并不少见，因为Cookie和引用等东西的存在）, 至少要7到8个来回去“在线”获得这些消息头。这还不包括响应时间——那只是从客户端那里获取到它们所花的时间而已。这全都由于TCP的慢启动机制，它会基于对已知有多少个包，来确定还要来回去获取哪些包 – 这很明显的限制了最初的几个来回可以发送的数据包的数量。相比之下，即使是头部轻微的压缩也可以是让那些请求只需一个来回就能搞定——有时候甚至一个包就可以了。这种开销是可以被节省下来的，特别是当你考虑移动客户端应用的时候，即使是良好条件下，一般也会看到几百毫秒的来回延迟。

服务器推送的好处是什么？

当浏览器请求一个网页时，服务器将会发回HTML，在服务器开始发送JavaScript、图片和CSS前，服务器需要等待浏览器解析HTML和发送所有内嵌资源的请求。服务器推送服务通过“推送”那些它认为客户端将会需要的内容到客户端的缓存中，以此来避免往返的延迟。

HTTP2.0性能增强的核心：二进制分帧

HTTP 2.0最大的特点： 不会改动HTTP 的语义，HTTP 方法、状态码、URI 及首部字段，等等这些核心概念上一如往常，却能致力于突破上一代标准的性能限制，改进传输性能，实现低延迟和高吞吐量。而之所以叫2.0，是在于新增的二进制分帧层。
既然又要保证HTTP的各种动词，方法，首部都不受影响，那就需要在应用层(HTTP2.0)和传输层(TCP or UDP)之间增加一个二进制分帧层。
在二进制分帧层上， HTTP 2.0 会将所有传输的信息分割为更小的消息和帧,并对它们采用二进制格式的编码 ，其中HTTP1.x的首部信息会被封装到Headers帧，而我们的request body则封装到Data帧里面。
HTTP 2.0 通信都在一个连接上完成，这个连接可以承载任意数量的双向数据流。相应地，每个数据流以消息的形式发送，而消息由一或多个帧组成，这些帧可以乱序发送，然后再根据每个帧首部的流标识符重新组装。

HTTP2.0 首部压缩

HTTP 2.0 在客户端和服务器端使用“首部表”来跟踪和存储之前发送的键-值对，对于相同的数据，不再通过每次请求和响应发送;通信期间几乎不会改变的通用键-值对(用户代理、可接受的媒体类型,等等)只 需发送一次。事实上,如果请求中不包含首部(例如对同一资源的轮询请求),那么 首部开销就是零字节。此时所有首部都自动使用之前请求发送的首部。

如果首部发生变化了，那么只需要发送变化了数据在Headers帧里面，新增或修改的首部帧会被追加到“首部表”。首部表在 HTTP 2.0 的连接存续期内始终存在,由客户端和服务器共同渐进地更新 。

所有的HTTP2.0的请求都在一个TCP链接上

HTTP 2.0 把 HTTP 协议通信的基本单位缩小为一个一个的帧，这些帧对应 着逻辑流中的消息。并行地在同一个 TCP 连接上双向交换消息。就好比，我请求一个页面http://www.qq.com。页面上所有的资源请求都是客户端与服务器上的一条TCP上请求和响应的！

有关注TCP性能的同学就会知道，HTTP性能瓶颈关键在于低延迟而不是高带宽！大多数HTTP 连接的时间都很短，而且是突发性的，但TCP 只在长时间连接传输大块数据时效率才最高。HTTP 2.0 通过让所有数据流共用同一个连接，可以更有效地使用TCP 连接，让高带宽也能真正的服务于HTTP的性能提升。

同时，单链接多资源的方式，使到至上而下的层面都得到了好处：
1. 可以减少服务链接压力,内存占用少了,连接吞吐量大了
2. 由于 TCP 连接减少而使网络拥塞状况得以改观;
3. 慢启动时间减少,拥塞和丢包恢复速度更快。

也就是说，“资源合并减少请求”的优化手段对于HTTP2.0来说是没有效果的，只会增大无用的工作量而已。

并行双向字节流的请求和响应

在HTTP2.0上，客户端和服务器可以把HTTP 消息分解为互不依赖的帧，然后乱序发送，最后再在另一端把它们重新组合起来。注意，同一链接上有多个不同方向的数据流在传输。客户端可以一边乱序发送stream，也可以一边接收服务器的响应，而服务器那端同理。
把 HTTP 消息分解为独立的帧,交错发送,然后在另一端重新组装是 HTTP 2.0 最 重要的一项增强。事实上,这个机制会在整个 Web 技术栈中引发一系列连锁反应, 从而带来巨大的性能提升,因为:

可以并行交错地发送请求,请求之间互不影响;
可以并行交错地发送响应,响应之间互不干扰;
只使用一个连接即可并行发送多个请求和响应;
消除不必要的延迟,从而减少页面加载的时间;
那么也就是说“域名分区”这种优化手段对于HTTP2.0是无用的，因为资源都是并行交错发送，且没有限制，不需要额外的多域名并行下载。

HTTP2.0的请求优先级

每个HTTP2.0流里面有个优先值，这个优先值确定着客户端和服务器处理不同的流采取不同的优先级策略，高优先级的流都应该优先发送，但又不会绝对的。绝对地准守，可能又会引入首队阻塞的问题：高优先级的请求慢导致阻塞其他资源交付。分配处理资源和客户端与服务器间的带宽，不同优先级的混合也是必须的。

HTTP2.0的服务器推送

HTTP 2.0 新增的一个强大的新功能，就是服务器可以对一个客户端请求发送多个响应。换句话说，服务器除了对最初请求的响应外，还可以额外向客户端推送资源，而无需客户端明确地请求。
当浏览器请求一个html，服务器其实大概知道你是接下来要请求资源了，而不需要等待浏览器得到html后解析页面再发送资源请求。我们常用的内嵌图片也可以理解为一种强制的服务器推送：我请求html，却内嵌了张图。
有了HTTP2.0的服务器推送，HTTP1.x时代的内嵌资源的优化手段也变得没有意义了。而且使用服务器推送的资源的方式更加高效，因为客户端还可以缓存起来，甚至可以由不同的页面共享（依旧遵循同源策略）。当然，浏览器是可以决绝服务器推送的资源的。

---

假如页面有一个input，给这个input绑定四个事件，绑定如下：
input.onmousedown=function(){
    console.log('mousedown');
}
input.onmouseup=function(){
    console.log('mouseup');
}
input.onclick=function(){
    console.log('click');
}
input.onfocus=function(){
    console.log('focus');
}

当点击input按钮，触发的顺序是mousedown–>focus–>up–>click

---

创建日期对象没有兼容性问题的是

new Date(year,month,day,hour,minutes,seconds)

---

一些代码题

var a={};
b={key:'b'};
c={key:'c'};
a[b]=123;
a[c]=456;
console.log(a[b]);//456

global.name='tester';
var test={
    name:'Chris Dai',
    getName:function(){
        return this.name;
    }
};
var tester=test.getName;
console.log(tester());//tester

console.log(test.getName());//Chris Dai

(function () {var a=b=3;})();
console.log(typeof a!=='undefined');//false
console.log(typeof b!=='undefined');//true

console.log(1+'2'+'2');//122
console.log(1+ +'2'+'2');//32
console.log(1+ -'1'+'2');//02
console.log(+'1'+'1'+'2');//112
console.log('A'-'B'+'2');//NaN2
console.log('A'-'B'+2);//NaN
console.log(NaN==NaN);//false

var a1=111;
console.log(a1);//111
console.log(a2);//undefined
console.log(a3);//报错
var a2=222;
a3=333;

var i=1;
(function () {
    var start=new Date().getTime();
    var si=setInterval(function () {
        var now=new Date().getTime();
        if(now<(start+100)){
            i++;
        } else {
            console.log(i);
            clearInterval(si);
        }
    },10);
})();
//setInterval不能保证程序从什么时候开始执行。因此本题答案中的8,9,10是都可以出现的。