2020面试题目

1、判断js类型的方式

解:atypeof (可以判断出'string','number','boolean','undefined','symbol',但判断 typeof(null) 时值为 'object'; 判断数组和对象时值均为 'object');binstanceof var str=new string‘hello’);console.log(str instanceof String); // true)。

2ES5 ES6 分别几种方式声明变量

解:aES5有俩种:var  functionbES6 有六种:增加四种,letconstclass  import

3、闭包概念?闭包的优缺点?

解:概念:闭包就是能读取其他函数内部变量的函数。

优点:

a避免全局变量的污染

b希望一个变量长期存储在内存中(缓存变量)

缺点:

a内存泄露(消耗)

b常驻内存,增加内存使用量

4、深拷贝和浅拷贝

解:含义:假设B复制了A,当修改A时,看B是否会发生变化,如果B也跟着变了,说明这是浅拷贝;拿人手短,如果B没变,那就是深拷贝。

浅拷贝:

let a=[0,1,2,3,4],

     b=a;

console.log(a===b);   //true

a[0]=1;

console.log(a,b);  1,1,2,3,4

深拷贝:

let a=[0,1,2,3,4],

     b=a.slice();

a[0]=2;

console.log(a,b);  // a:2,2,3,4  b:1,2,3,4

function deepClone(obj){

let objClone = Array.isArray(obj)?[]:{};

    if(obj && typeof obj==="object"){

        for(key in obj){

            if(obj.hasOwnProperty(key)){

                //判断ojb子元素是否为对象,如果是,递归复制

                if(obj[key]&&typeof obj[key] ==="object"){

                    objClone[key] = deepClone(obj[key]);

                }else{

                    //如果不是,简单复制

                    objClone[key] = obj[key];

                }

            }

        }

    }

    return objClone;

}    

let a=[1,2,3,4],

b=deepClone(a);

a[0]=2;

console.log(a,b);// [2,2,3,4]  [1,2,3,4]

5、数组去重方法

解:

f1:.ES6 的 Set:

let arr = [1,1,2,3,4,5,5,6]

let arr2 = [...new Set(arr)] // [1,2,3,4,5,6]

f2:reduce:

let arr = [1,1,2,3,4,5,5,6]

let arr2 = arr.reduce(function(ar,cur) {

   if(!ar.includes(cur)) {

     ar.push(cur)

   }

   return ar

},[])

f3:filter:

// 这种方法会有一个问题:[1,'1']会被当做相同元素,最终输入[1]

let arr = [1,1,2,3,4,5,5,6]

let arr2 = arr.filter(function(item,index) {

  // indexOf() 方法可返回某个指定的 字符串值 在字符串中首次出现的位置

  return arr.indexOf(item) === index

})

6、输入URL发生什么?

解:

a、DNS 域名解析(域名解析成ip地址,走UTP协议,因此不会有握手过程):浏览器将 URL 解析出相对应的服务器的 IP 地址(1. 本地浏览器的 DNS 缓存中查找 2. 再向系统DNS 缓存发送查询请求 3. 再向路由器DNS缓存 4. 网络运营商DNS缓存 5. 递归搜索),并 url 中解析出端口号;

b、浏览器与目标服务器建立一条 TCP 连接(三次握手);

c、浏览器向服务器发送一条 HTTP 请求报文;

d、服务器返回给浏览器一条 HTTP 响应报文;

e、浏览器进行渲染;

f、关闭 TCP 连接(四次挥手)。

2:

1.输入网址;

2.发送到DNS服务器,并获取域名对应的web服务器对应的ip地址;

3.web服务器建立TCP连接;

4.浏览器向web服务器发送http请求;

5.web服务器响应请求,并返回指定url的数据(或错误信息,或重定向的新的url地址);

6.浏览器下载web服务器返回的数据及解析html源文件;

7.生成DOM树,解析css和js,渲染页面,直至显示完成;

7、GET 和 POST 请求的区别

解:

GET 参数通过 url 传递,POST 放在 body 中;

GET 请求在 url 中传递的参数是有长度限制的,而 POST 没有;

GET 在浏览器回退时是无害的,而 POST 会再次提交请求;

GET 请求会被浏览器主动 cache,而 POST 不会,除非手动设置;

GET 比 POST 更不安全,因为参数直接暴露在 url 中,所以不能用来传递敏感信息对参数的数据类型,GET 只接受 ASCII字符,而 POST 没有限制;

GET 请求只能进行 url(x-www-form-urlencoded)编码,而 POST 支持多种编码方式;

GET 产生一个 TCP 数据包;POST 产生两个 TCP 数据包。对于 GET 方式的请求,浏览器会把 http 的 header 和 data 一并发送出去,服务器响应200(返回数据)。而对于 POST,浏览器先发送 header,服务器响应100 continue,浏览器再发送 data,服务器响应200 ok(返回数据)

8、HTTPS 与 HTTP 相比

解:

HTTPS协议需要到CA申请证书,一般免费证书很少,需要交费。

HTTP协议运行在TCP之上,所有传输的内容都是明文,HTTPS运行在SSL/TLS之上,SSL/TLS运行在TCP之上,所有传输的内容都经过加密的。

HTTP和HTTPS使用的是完全不同的连接方式,用的端口也不一样,前者是80,后者是443。

HTTPS可以有效的防止运营商劫持,解决了防劫持的一个大问题。

9、watch、methods 和 computed 的区别?

解:

a、watch 为了监听某个响应数据的变化。computed 是自动监听依赖值的变化,从而动态返回内容,主要目的是简化模板内的复杂运算。所以区别来源于用法,只是需要动态值,那就用 computed ;需要知道值的改变后执行业务逻辑,才用 watch。

b、methods是一个方法,它可以接受参数,而computed 不能,computed 是可以缓存的,methods 不会。computed 可以依赖其他 computed,甚至是其他组件的 data。

10、数组相关

解:

  1. push()从后面添加元素,返回值为添加完后的数组的长度
  2. pop()从后面删除元素,只能是一个,返回值是删除的元素
  3. shift()从前面删除元素,只能删除一个 返回值是删除的元素
  4. unshift()从前面添加元素, 返回值是添加完后的数组的长度
  5. concat()连接两个数组 返回值为连接后的新数组
  6. split(i,j)将字符串转化为数组i--分隔符,默认为所有的空字符,包括空格、换行(\n)、制表符(\t)等。j--分割次数。默认为-1, 即分隔所有
  7. sort()将数组进行排序,返回值是排好的数组,默认是按照最左边的数字进行排序,不是按照数字大小排序的
  8. reverse() 将数组反转,返回值是反转后的数组
  9. slice(start,end) 切去索引值start到索引值end的数组,不包含end索引的值,返回值是切出来的数组  
  10. forEach(callback) 遍历数组,无return     callback的参数: value --当前索引的值      index --索引     array --原数组
  11. map(callback)映射数组(遍历数组),有return 返回一个新数组    callback的参数: item--当前索引的值 index --索引 arr --原数组
  12. filter(callback)过滤数组,返回一个满足要求的数组
  13. join()方法用于把数组中的所有元素放入一个字符串。元素是通过指定的分隔符进行分隔的。默认为,;

13、Promise.all()用法

解:Promise.all()批量执行,Promise.all([p1, p2, p3])用于将多个promise实例,包装成一个新的Promise实例,返回的实例就是普通的promise

猜你喜欢

转载自www.cnblogs.com/zaijin-yang/p/12509930.html
今日推荐