前端面试题七

1. slot的作用，何时会用到它

用法:<slot name="ddd"></slot>放置你需要插入内容的地方
场景：组件中插入内容，如果不使用<slot>则组件中不会显示插入的内容

2. ES6 module和commonjs的区别

CommonJS

1. 对于基本数据类型，属于复制。即会被模块缓存。同时，在另一个模块可以对该模块输出的变量重新赋值。
2. 对于复杂数据类型，属于浅拷贝。由于两个模块引用的对象指向同一个内存空间，因此对该模块的值做修改时会影响另一个模块。
3. 当使用require命令加载某个模块时，就会运行整个模块的代码。
4. 当使用require命令加载同一个模块时，不会再执行该模块，而是取到缓存之中的值。也就是说，CommonJS模块无论加载多少次，都只会在第一次加载时运行一次，以后再加载，就返回第一次运行的结果，除非手动清除系统缓存。
5. 循环加载时，属于加载时执行。即脚本代码在require的时候，就会全部执行。一旦出现某个模块被"循环加载"，就只输出已经执行的部分，还未执行的部分不会输出。

ES6模块

1. ES6模块中的值属于【动态只读引用】。
2. 对于只读来说，即不允许修改引入变量的值，import的变量是只读的，不论是基本数据类型还是复杂数据类型。当模块遇到import命令时，就会生成一个只读引用。等到脚本真正执行时，再根据这个只读引用，到被加载的那个模块里面去取值。
3. 对于动态来说，原始值发生变化，import加载的值也会发生变化。不论是基本数据类型还是复杂数据类型。
4. 循环加载时，ES6模块是动态引用。只要两个模块之间存在某个引用，代码就能够执行。

3. vue.$nextTick作用

应用场景：常用的场景是在进行获取数据后，需要对新视图进行下一步操作或者其他操作时，发现获取不到dom。因为赋值操作只完成了数据模型的改变并没有完成视图更新。

在created()钩子函数执行的时候DOM 其实并未进行任何渲染，而此时进行DOM操作无异于徒劳，所以此处一定要将DOM操作的js代码放进Vue.nextTick()的回调函数中。

与之对应的就是mounted()钩子函数，因为该钩子函数执行时所有的DOM挂载和渲染都已完成，此时在该钩子函数中进行任何DOM操作都不会有问题 。

在数据变化后要执行的某个操作，而这个操作需要使用随数据改变而改变的DOM结构的时候，这个操作都应该放进Vue.nextTick()的回调函数中。

4. 前端前沿知识

5. vue的diff算法，具体是如何比较新旧vnode的，以及节点的比较是深度优先还是广度优先

6. 实现String.prototype.indexOf，以及优化

function indexOf(tar){
  for(let i=0;i<str.length;i++){
        if(str[i]==tar)
            return i
    }
    if(i>=str.length)
         return -1
}   

7. WecSocket应用场景

WebSocket：它是HTML5一种新的协议。它实现了浏览器和服务器之间的全双工通信，能够更好的节省服务器资源和带宽并达到实时通讯，同HTTP一样通过TCP来传输数据，但是它和HTTP最大的不同是：

• WebSocket是一种双向通信协议，在建立连接后，WebSocket服务器和Browser/Client Agent 都能主动向对方发送或接受数据，就像Socket一样。
• WebSocket需要类似TCP客户端和服务端通过握手连接，连接成功后才能相互通信。

在 WebSocket API 中，浏览器和服务器只需要做一个握手的动作，然后，浏览器和服务器之间就形成了一条快速通道。两者之间就直接可以数据互相传送。

其他特点包括：

1.建立在 TCP 协议之上，服务器端的实现比较容易。
2.与 HTTP 协议有着良好的兼容性。默认端口也是80和443，并且握手阶段采用 HTTP 协议，因此握手时不容易屏蔽，能通过各种 HTTP 代理服务器。
3.数据格式比较轻量，性能开销小，通信高效。
4.可以发送文本，也可以发送二进制数据。
5.没有同源限制，客户端可以与任意服务器通信。
6.协议标识符是ws（如果加密，则为wss），服务器网址就是 URL。

 

 应用场景：

社交聊天、弹幕、多玩家游戏、协同编辑、股票基金实时报价、体育实况更新、视频会议/聊天、基于位置的应用、在线教育

8. 递归和迭代的区别，两者可以相互转换吗

递归（recursion）：递归常被用来描述以自相似方法重复事物的过程，在数学和计算机科学中，指的是在函数定义中使用函数自身的方法。（A调用A）

迭代（iteration）：重复反馈过程的活动，每一次迭代的结果会作为下一次迭代的初始值。（A重复调用B）

理论上递归和迭代可以相互转换，但实际从算法结构来说，递归声明的结构并不总能转换为迭代结构（原因有待研究）。迭代可以转换为递归，但递归不一定能转换为迭代。

9. webpack相关，提取common chunk，tree shaking是如何实现的　　

10. 对称加密和非对称加密的区别

对称加密：对称加密指的就是加密和解密使用同一个秘钥，所以叫做对称加密。对称加密只有一个秘钥，作为私钥。

常见的对称加密算法：DES，AES，3DES等等。

非对称加密指的是：加密和解密使用不同的秘钥，一把作为公开的公钥，另一把作为私钥。公钥加密的信息，只有私钥才能解密。私钥加密的信息，只有公钥才能解密。

常见的非对称加密算法：RSA，ECC

（1）对称加密算法相比非对称加密算法来说，加解密的效率要高得多。但是缺陷在于对于秘钥的管理上，以及在非安全信道中通讯时，密钥交换的安全性不能保障。所以在实际的网络环境中，会将两者混合使用.

（2）对称加密：加密解密用同一个密钥，被黑客拦截不安全

（3）非对称加密：公钥加密，私钥解密；公钥可以公开给别人进行加密，私钥永远在自己手里，非常安全，黑客拦截也没用，因为私钥未公开。著名的RSA加密算法用的就是非对称加密。

11. 进程和线程的区别

根本区别：进程是操作系统资源分配的基本单位，而线程是任务调度和执行的基本单位

在开销方面：每个进程都有独立的代码和数据空间（程序上下文），程序之间的切换会有较大的开销；线程可以看做轻量级的进程，同一类线程共享代码和数据空间，每个线程都有自己独立的运行栈和程序计数器（PC），线程之间切换的开销小。

所处环境：在操作系统中能同时运行多个进程（程序）；而在同一个进程（程序）中有多个线程同时执行（通过CPU调度，在每个时间片中只有一个线程执行）

内存分配方面：系统在运行的时候会为每个进程分配不同的内存空间；而对线程而言，除了CPU外，系统不会为线程分配内存（线程所使用的资源来自其所属进程的资源），线程组之间只能共享资源。

包含关系：没有线程的进程可以看做是单线程的，如果一个进程内有多个线程，则执行过程不是一条线的，而是多条线（线程）共同完成的；线程是进程的一部分，所以线程也被称为轻权进程或者轻量级进程。

12. 数组和链表的区别是什么

数组：数组存储的时候需要一个连续的空间，数组要预留空间，在使用前要申请占内存的大小，可能会浪费空间。

　　　插入数据和删除数据效率低，插入数据时，这个位置后面的数据在内存中都要后移。

　　　随机读取的效率很高。因为数组是连续的，知道每一个数据的内存地址，可以直接找到给数据的地址。

　　　并且不利于扩展，数组空间不够时，还要重新定义数组。

链表：在内存中可以存在任何地方，不需要空间连续。

　　　每一个数据都保存了下一个数据的地址，通过这个地址找到下一个数据。

　　　增加数据和删除数据很容易。

　　　查找数据时效率低。

　　　不指定大小，扩展方便。