JavaScript 面试题（未完待续）

1. ECMAScrit 中数组的大小

   如题:

    var array = new Array();
    array[0] = 0;
    array[1] = 1;
    array[2] = 2;
    array[5] = 5;
    console.log(array.length); // 6

解析：
    
    ECMAScript 中数组的大小是可以动态调整的，既可以随着数据的添加自动增长以容纳新增的数据。
    当把一个值放在超出当前数组大小的位置上时，数组就会重新计算长度值，
    即长度值等于最后一项的索引加一，前面的值都将被自动赋值为 undefined。

2. RegExp 对象的方法

   如题:下面选项中不是 RegExp 对象的方法的是 ：

   A. test B. match C. exec D. compile

  正确答案选择 B.

解析：

    JavaScript RegExp 对象有 3 个方法：test()、 exec()、compile()。
    
    1. test() 方法用于检测一个字符串是否匹配某个正则表达式，如果匹配，返回 true ，否则返回 false;
    2. exec() 方法用来检测字符串中的正则表达式匹配的值，exec() 方法返回一个数组，其中存放匹配的结果。
    如果未找到匹配的值，则返回 null;
    3.compile() 方法可以在脚本执行过程中编译正则表达式，也可以改变已有的表达式。

3. 下面哪些方法可以用于 JavaScript 的异步编程

   A. 回调函数 B. 事件监听 C. 监听/订阅 D. Promise 对象

  正确答案选择 A,B,C,D.

解析：

  回调函数是异步编程的基础。
  
  事件监听，另一种思路是采用事件驱动模式。任务的执行不取决于代码的顺序，而是取决于事件是否发生。
  
  监听/订阅，上一节的“事件”可以理解为“型号”。
  
  Promise 对象，是 CommonJS 工作组提出的一种规范，目的是为异步编程提供统一接口

4. w3c 为 JavaScript 定制的标准事件模型，以下正确的顺序和描述是

• A. 事件捕获 -> 事件冒泡
• B. 事件捕获 -> 事件处理 -> 事件冒泡
• C. 事件冒泡 -> 事件处理
• D. 事件冒泡 -> 事件处理 -> 事件捕获
• E. 事件处理 -> 事件捕获 -> 事件冒泡

  正确答案选择 B.

解析：
    
    先事件捕获从 windows > document 往下级直到特定的事件节点，然后进行事件处理，再事件冒泡，
    从特定节点往上级,这个完整的过程。

5. 下面关于 DNS 说法正取的是

• A. DNS 的作用是域名与 IP 地址的相互映射
• B. DNS 协议 运行在 UDP 协议之上
• C. DNS 协议的端口号是 53
• D. DNS 默认缓存时间为 1 小时

  正确答案选择 B,C.

解析：
    
    DNS（Domain Name System，域名系统），因特网上作为域名与 IP 地址的相互映射的一个分布式数据库，能够使用户更方便的使用互联网，
    而不用去记住能够被机器直接读取的 IP 数串。
    通过主机名，最终得到该主机名对应的 IP 地址的过程叫做域名解析（或主机名解析）。
    DNS 协议运行在 UDP 协议之上，使用端口号为 52。

6. 编写获取 Url 参数值的代码，以键值对返回。

  例：
url = "https://cn.bing.com/search?q=LeetCode&qs=n"

  返回结果 { q: "LeetCode", qs: "n" }

  实现代码：

• 使用截取字符串的方式实现

    /**
     * 通过截取字符串获取 url 参数
     * @param {*} requestUrl 
     */
    function queryURLParameter(requestUrl) {
        const obj = {};
        let index = 0;
        // 判断 url 地址是否有参数
        if ((index = requestUrl.indexOf('?')) > 0) {
            // 截取 ? 后的字符串
            requestUrl = requestUrl.substr(index + 1);
            // 切分 & 符号后的参数
            requestUrl.split('&').forEach(item => {
                const param = item.split('=');
                obj[param[0]] = param[1];
            });
        }
        return obj;
    }

• 使用正则表达式的方式实现

    /**
     * 通过正则表达式来获取 url 参数
     * @param {*} requestUrl 
     */
    function queryURLParameter(requestUrl) {
        // 编写获取 url 参数的正则表达式
        let reg = /([^?&=]+)=([^?&=]+)/g;
        const obj = {};
        // 通过配置正则获取数值
        requestUrl.replace(reg, (...arg)=>{
            obj[arg[1]] = arg[2];
        });
        return obj;
    }

7. 以下代码的输出结果。

    var a = 4;
    function b(x, y, a){
        console.log(a);
        arguments[2] = 10;
        console.log(a);
    }
    a = b(1, 2, 3);
    console.log(a);

• A. 3 3 4
• B. 3 10 4
• C. 3 10 10
• D. 3 10 undefined

  正确答案选择 D.

解析：
    
    在 JavaScript 的非严格模式下，函数的实参集合与形参变量存在“映射”关系：无论其中谁发生改变，另一个也会跟着改变；
    
    在 JavaScript 的严格模式下，arguments 和形参变量的映射关系被切断，互相之间互不干扰。

8. 请分别说出下列代码中 a、b、c 输出的值

    function fun(n, o) {
        console.log(o);
        return function (m) {
            return fun(m, n);
        };
    };
    
    const a = fun(0);
    a(1);
    a(2);
    a(3);
    
    const b = fun(0)(1)(2)(3);
    
    const c = fun(0)(1);
    c(2);
    c(3);

  正确答案：

    a 输出结果： undefined,0,0,0
    
    b 输出结果： undefined,0,1,2
    
    c 输出结果： undefined,0,1,1

解析：
    a 的运行中，第一次 fun(0) 所调用的是第一层函数，由于参数 o 并未传值，此时 o = undefined;
    a(1) 是在调用前一个 fun(0) 的返回值也就是 function(m){ return fun(m,n) };并内部调用 fun(m,n)，此时内部 fun(m,n) 中的 n 闭包了外层 fun(n,o) 中的 n，由于第一次调用 n = 0;即 m = 1,n = 0;
    同理 a(2) 中调用的是前一个 a(1) 的返回值，即 fun(m,n)，所以还是闭包了第一次 n 的值，即 m = 2, n = 0;
    以此类推
    
    b 的运行中，第一次 fun(0) 所调用的是第一层函数，由于参数 o 并未传值，此时 o = undefined;
    b(1) 是在调用前一个 fun(0) 的返回值也就是 function(m){ return fun(m,n) };并内部调用 fun(m,n)，此时内部 fun(m,n) 中的 n 闭包了外层 fun(n,o) 中的 n，由于第一次调用 n = 0;即 m = 1,n = 0;
    b(1)(2) 此时调用的并不是上一层返回的值，而是直接调用的上一层返回值的内部函数，即 fun(m,n)；由于 fun(m,n) 中的 n 闭包了外层 fun(n,o) 中的 n，即 b(1)，因此 n = 1;
    以此类推
    
    c 的运行中，c(0)(1) 与 b(1)(2) 的推断相似，只不过此时的 fun(m,n) 中的 n 闭包了外层 fun(n,o) 中的 n，即 c(0)，因此 n = 0;
    c(2) 与 a(1) 的推断相似，只不过 只不过此时的 fun(m,n) 中的 n 闭包了外层 fun(n,o) 中的 n，即 c(1)，因此 n = 1;
    以此类推

9. 以下哪一项不属于浏览器 Response Headers 字段

• A. Referer
• B. Connection
• C. Content-Type
• D. Server

  正确答案选择 A.

解析：
    
    常见的请求头部和响应头部
    
    请求(客户端 -> 服务端[request])
    
        GET(请求的方式) /newcoder/hello.html(请求的目标资源) HTTP/1.1(请求采用的协议和版本号) 
        Accept: */*(客户端能接收的资源类型) 
        Accept-Language: en-us(客户端接收的语言类型) 
        Connection: Keep-Alive(维护客户端和服务端的连接关系)
        Host: localhost:8080(连接的目标主机和端口号)
        Referer: http://localhost/links.asp(告诉服务器我来自于哪里)
        User-Agent: Mozilla/4.0(客户端版本号的名字)
        Accept-Encoding: gzip, deflate(客户端能接收的压缩数据的类型) 
        If-Modified-Since: Tue, 11 Jul 2000 18:23:51 GMT(缓存时间)  
        Cookie(客户端暂存服务端的信息) 
        Date: Tue, 11 Jul 2000 18:23:51 GMT(客户端请求服务端的时间)
        
    响应(服务端->客户端[response])
    
        HTTP/1.1(响应采用的协议和版本号) 200(状态码) OK(描述信息)
        Location: http://www.baidu.com(服务端需要客户端访问的页面路径)
        Server:apache tomcat(服务端的Web服务端名)
        Content-Encoding: gzip(服务端能够发送压缩编码类型) Content-Length: 80(服务端发送的压缩数据的长度) 
        Content-Language: zh-cn(服务端发送的语言类型) 
        Content-Type: text/html; charset=GB2312(服务端发送的类型及采用的编码方式)
        Last-Modified: Tue, 11 Jul 2000 18:23:51 GMT(服务端对该资源最后修改的时间)
        Refresh: 1;url=http://www.it315.org(服务端要求客户端1秒钟后，刷新，然后访问指定的页面路径)
        Content-Disposition: attachment; filename=aaa.zip(服务端要求客户端以下载文件的方式打开该文件)
        Transfer-Encoding: chunked(分块传递数据到客户端）
        Set-Cookie:SS=Q0=5Lb_nQ; path=/search(服务端发送到客户端的暂存数据)
        Expires: -1//3种(服务端禁止客户端缓存页面数据)
        Cache-Control: no-cache(服务端禁止客户端缓存页面数据)  
        Pragma: no-cache(服务端禁止客户端缓存页面数据) 
        Connection: close(1.0)/(1.1)Keep-Alive(维护客户端和服务端的连接关系)  
        Date: Tue, 11 Jul 2000 18:23:51 GMT(服务端响应客户端的时间)
        
    在服务器响应客户端的时候，带上Access-Control-Allow-Origin头信息，解决跨域的一种方法。
        

10. 对任意给定的 32 位整数，转换二进制并统计 1 出现的个数

  实现代码：

    num.toString(2).match(new RegExp('1','g')).length;

11. 根据包名，在指定空间中创建对象

例：

    输入：namespace({a: {test: 1, b: 2}}, 'a.b.c.d')
    
    输出：{a: {test: 1, b: {c: {d: {}}}}}

  实现代码：

    function namespace(oNamespace, sPackage) {
        var keys = sPackage.split('.');
        var tempSpace = oNamespace;
        keys.forEach(function(key){
            if(!(tempSpace[key] instanceof Object)){
                tempSpace[key] = {};
            }
            tempSpace = tempSpace[key];
        });
        return oNamespace;
    }

12. 为 Array 对象添加一个去除重复项的方法

例：

    输入：[false, true, undefined, null, NaN, 0, 1, {}, {}, 'a', 'a', NaN]
    
    输出：[false, true, undefined, null, NaN, 0, 1, {}, {}, 'a']

解析：
    
    在 indexOf 判断中，NaN 和空对象 {} 均返回 -1，因此要判断 NaN 实现对其去重。
    
    由于空对象 {} 所指向的内存地址不一致，因此可以不对其考虑。
    
    在 JavaScript 中存在 6 个假值：flase, 0, null, "", undefined, NaN。
    
    前 5 个的判断可直接使用严格相等 “===” 判断，而 NaN 特殊性在于不等于其自身。

  ES5 实现代码：

    Array.prototype.uniq = function(){
        return this.filter(function(item,index){
            return item != item ? this.flag = this.flag === undefined : this.indexOf(item) === index;
        },this);
    }

  ES6 实现代码：

    Array.prototype.uniq = function(){
        [...new Set(this)]
    }

  文章原文地址 https://github.com/SilenceHVK/blog/issues/18，欢迎 Star、Watch