金山2016.04.11广州站笔试题

题目

1.console.log(typeof NaN),打印出是什么

2.sum(2,3)=>5,sum(2)(3)=>5,请实现sum函数

3.现有整型变量a,b，如何不定义临时变量，实现整型a,b的值的交换

4.写出两种以上异步加载js的方案思路

5.实现image的水平和垂直居中，请写出html和css

6.HTTP/2有哪些优化网络的请求

下面给出开放化答案

1.console.log(typeof NaN),打印出是什么

number//(NaN,即非数值（Not is Number）是一个特殊的数值，这个数值用于表示一个本来要返回的数值的才作数未返回数值的情况（这样就不会抛出错误了），在ECMAScript中，任何数值除与0会返回NaN);

alert(NaN==NaN);   //false(NaN与任何值都不相等，包括NaN本身)
isNaN() //函数会帮我们确定这个参数是否“不是数值”
isNaN(10) //false

2.sum(2,3)=>5,sum(2)(3)=>5,请实现sum函数

function sum(){
    for(var i in arguments){
        if(isNaN(arguments[i])){
        return;
        }
        switch(arguments.length){
            case 1:
                var a=arguments[0];
                return function(){
                    return a+arguments[0];
                }
                break;
            case 2:
                return arguments[0]+arguments[1];
        }
    }
}

或者这样写：

1
2
3

function sum(a,b){
    return b===undefined?function(c){ return a+c;}:a+b
}

其实就是判断b是否为空，若是，则就返回一个函数，该函数的传参是3.

3.现有整型变量a,b，如何不定义临时变量，实现整型a,b的值的交换

a=a-b;
b=a+b;
a=a+b;
b=b-a;

顺序不能变，然后这里并不考虑变量溢出，假如a,b的数特别大或者特别小，就会出现溢出问题

4.写出两种以上异步加载js的方案思路

(1) defer,只支持IE
defer属性规定是否对脚本进行延迟，直到页面加载为止，有的javascript脚本document.write方法来创建当前的文档内容，其他的脚本就不一定是了
如果你的脚本不会改变文档的内容，可以将defer属性加入到script标签中，以便加快处理文档的速度。因为浏览器知道它将能够安全的读取文档的剩余部分而不用执行脚本，它将推迟对脚本的解释，直到文档已经显示给用户为止

1
2
3

<script type="text/javascript" defer="defer">
    alert(document.getElementById("p1").firstChild.nodeValue);
</script>

(2)async
1.async 的定义和用法
2.async 属性规定一旦脚本可用，则会异步执行
3.async属性仅适用外部脚本（只有在使用src属性时）
4.如果 async=”async”：脚本相对于页面的其余部分异步地执行（当页面继续进行解析时，脚本将被执行）
5.如果不使用 async 且 defer=”defer”：脚本将在页面完成解析时执行
6.如果既不使用 async 也不使用 defer：在浏览器继续解析页面之前，立即读取并执行脚本

1	<script type="text/javascript" src="demo_async.js" async="async"></script>

(3)创建script,插入到DOM中

 
function loadScript(url, callback){ 
var script = document.createElement_x("script") 
script.type = "text/javascript"; 
if (script.readyState){ //IE 
script.onreadystatechange = function(){ 
if (script.readyState == "loaded" || 
script.readyState == "complete"){ 
script.onreadystatechange = null; 
callback(); 
} 
}; 
} else { //Others: Firefox, Safari, Chrome, and Opera 
script.onload = function(){ 
callback(); 
}; 
} 
script.src = url; 
document.body.appendChild(script); 
}

这种方法是在页面中script标签内，用 js 创建一个 script 元素并插入到 document 中。这样就做到了非阻塞的下载 js 代码。

参考这个博客，写同步加载和异步加载比较详细页面加载–js异步加载

5.实现image的水平和垂直居中，请写出html和css

/*1.假如知道其父元素div .container的宽高,同时知道它本身的宽高*/
.container{
    width:100px;
    height:100px;
    position:relative;
}
.container img{
    display:block;
    position:asolute;
    width:50px;
    height:50px;
    top:50%;
    left:50%;
    margin-top:-25px;
    margin-left:-25px;
}
/*2.假如知道其父元素div .container的宽高，不知道它本身的宽高*/
.container{
    width:100px;
    height:100px;
    text-align:center;
    line-height:100px;/*行内元素垂直居中*/
}
.container img{
}
    /或者以下，css3属性有兼容问题/
.container{
    width:100px;
    height:100px;
    position:relative;
}
.container img{
    display:block;
    position:asolute;
    top:50%;
    left:50%;
    transform:translate3d(-50%，-50%，0)/*相对于其本身进行偏移*/;
    -webkit-transform:translate3d(-50%，-50%，0);
    -moz-transform:translate3d(-50%，-50%，0);
    -o-transform:translate3d(-50%，-50%，0);
    
/*3.假如知道其父元素的宽高，其本身的宽高也不知道，用css3中的流式盒布局*/
.container{
    width:100%;
    height:100%;/*这两个一般不知道它的宽高，就继承它的父元素~*/
    display:box;
    display:-moz-box;
    display:-webkit-box;
    box-align:center;
    -moz-box-align:center;
    -webkit-box-align:center;
    box-pack:center;
    -webkit-box-pack:center;
    -moz-box-pack:center;
}
.container img{}

/*4.其父元素的宽高不知，它本身宽高不知，答案目前也不知~*/

6.HTTP/2有哪些优化网络的请求

1.HTTP/2引入“服务端推”（server push）的概念，它允许服务端在客户端需要数据之前就主动地将数据发送到客户端缓存中，从而提高性能
2.HTTP/2提供更多的加密支持
3.它增加了头压缩（header compression）因此即使非常小的请求，其请求和响应的header都会占用很小比例的带宽。