前端笔试题

2018年9月14日的一次笔试题。

JS部分：

1，typeof [];  // "object"

2，[].constructor == Object; // false                            [].constructor == Array ; // true

3，请实现“<a id = "qqlink"  href = "http://www.qq.com">qq</a>”用户点击qq时不允许浏览器跳转到qq.com。

    答：event.preventDefault();

4，

var x = 10;
var foo = {
    x: 20,
    bar: function() {
        var x = 30;
        return this.x;
    }
};
console.log( foo.bar() );  //20
console.log( (foo.bar)() ); //20
console.log( (foo.bar = foo.bar)() ); //10
console.log( (foo.bar, foo.bar)() ); //10
console.log( foo.bar.call(window)); //10
console.log( foo.bar.call(foo) ); //20

5，请实现函数substring(beginIndex, endIndex)，不允许使用javascript标准的substring函数。

function substring (startIndex, endIndex) {
    var str = this;
    var strArr = str.split('').splice(startIndex, endIndex-startIndex).join('');
    return strArr;
}
var str = "hello world";
substring.call(str,1,4);   //"ell"

6，请实现一个函数unique(Array  arr )，功能是去除数组中重复的数据。

function unique(arr) {
    var len = arr.length;
    var res = [];
    for(var i = 0; i < len; i++){
        if(res.indexOf(arr[i]) == -1){
            res.push(arr[i]);
        }
    }
    return res;
}
var arr = ['1','2','3','1'];
unique(arr);   // ['1','2','3']

以上代码只能实现值的去重，无法去除数组中对象的重值。

7，var s = {1:1, 2:2, };  alert(s['1'])，在chrome、ff4、IE6下的运行结果各是什么？

    答：    1    1    报错

8，密码输入框的规则是：

        1，首位必须是字母且大写；

        2，由3-15位字母，数字或下划线组成

        请使用正则表达式描述此规则。

    答：/^[A-Z][A-Za-z0-9_]{3,15}/ 或者/^[A-Z]\w{3,15}/

9，写一个函数 revertInt( Number nb )功能是反转整数，输出为反转后的结果，符号保持不变。如输入123，输出321。

function revertInt( nb ) {
    var nbStr = nb.toString();
    var nbArr = nbStr.split('').reverse().join('');
    return Number(nbArr);
}
revertInt(123);   //321

10，写一个函数readInt(Number nb )，功能是读出整数，如输入123期望的输出是“一百二十三”。

CSS部分：

1，CSS中display:inline 与 block, inline-block三者有什么区别。

2，CSS中visibility:hidden 与 display:none 有什么区别。

3，划一条水平线，不允许使用<hr>，注意浏览器兼容性。

4，CSS定义中{margin: 0px  20px  10px}，margin-top, right, bottom, left各是多少。

5，CSS实现 3*3的表格，不用<table>。

综合题：

1，列举常用的网站优化的方法。

2，什么是js跨域，原因是什么，解决方法是什么。

3，列举html5包含的新特性。

4，列举http header并简要说明其作用。

5，什么是doctype，有什么作用。

面试：

1，cookie，sessionStorage和localStorage

2，http缓存机制

3，301、302、304状态码

4，XSS ,  XSRF

5，bootstrap网格原理，template.js原理

6，jquery和vue的区别