面试复盘（二）

五九59
143 阅读5分钟

1. 常见的http错误码有哪些？304和401的区别？

  • 404--（未找到） 服务器找不到请求的网页

  • 400-- 坏的请求（错误请求） 服务器不理解请求的语法

  • 500--（服务器内部错误） 服务器遇到错误，无法完成请求

  • 304-- 属于重定向。自上次请求后，请求的网页未修改过。服务器返回此响应时，不会返回网页内容。

  • 401-- 未授权。请求要求身份验证。 对于需要登录的网页，服务器可能返回此响应

2. 是否了解Web注入攻击，说下原理，及对常见的两种攻击（xss和CSRF）的了解程度？

参考：www.cnblogs.com/morethink/p…

3. 箭头函数与普通函数（function）的区别是什么

  1. 箭头函数是匿名函数，不能作为构造函数，不能使用new。
  2. 箭头函数不能绑定arguments，取而代之用rest参数解决。
  3. 箭头函数没有原型属性。
  4. 箭头函数的this永远指向其上下文的this，没有办法改变其指向，普通函数的this指向调用它的对象。
  5. 箭头函数不能绑定this，会捕获其所在的上下文的this值，作为自己的this值。

4. 请详细说下你对vue2.0生命周期的理解？

总共分为8个阶段：创建前/后，载入前/后，更新前/后，销毁前/后。

  • 创建前/后：在beforeCreated阶段，vue实例的挂载元素el和∗∗数据对象∗∗data都为undefined，还未初始化。在created阶段，vue实例的数据对象data有了，el和**数据对象**data都为undefined，还未初始化。在created阶段，vue实例的数据对象data有了，el还没有。
  • 载入前/后：在beforeMount阶段，vue实例的$el和data都初始化了，但还是挂载之前为虚拟的dom节点，data.message还未替换。在mounted阶段，vue实例挂载完成，data.message成功渲染。
  • 更新前/后：当data变化时，会触发beforeUpdate和updated方法。
  • 销毁前/后：在执行destory方法后，对data的改变不会再触发周期函数，说明此时vue实例已经解除了事件监听以及和dom的绑定，但是dom结构依然存在。

5. vue父组件、子组件之间有哪些传递数据的方式？

父亲提供数据通过属性props传给儿子；儿子通过on绑父亲的事件，再通过on绑父亲的事件，再通过emit触发自己的事件

6. 添加样式使得多行文字水平、垂直居中

<p style="height:100px;width:100px;>
    <span>假设这是一段会内容很长并且必定换行的文字内容</span>
</p>

p{
    display: flex;
    justify-content: center;
    align-items: center;
}

7. 说出下列代码打印顺序

const promise=new Promise((resolve,reject)=>{
    console.log(1);
    resolve();
    setTimeout(()=>{
        console.log(2);
    },0);
});
promise.then(()=>{
    console.log(3);
});
console.log(4);

结果：1432

参考：事件循环

8. 实现应该函数，去除输入字符串中的重复字符

function removeRepeat(str){
    return [...new Set(str)].join("");
}

removeRepeat('aabbcc')  //返回abc
removeRepeat('abc')  //返回abc
removeRepeat('abcabc')  //返回abc

9. 跨域怎么处理

  1. 通过jsonp跨域
  2. 跨域资源共享（CORS）
  3. nginx代理跨域

参考：www.jianshu.com/p/9f0ffb551… 或segmentfault.com/a/119000001…

10. 什么场景下用keep-alive？

keep-alive 是 Vue 内置的一个组件，可以使被包含的组件保留状态，避免重新渲染 ，其有以下特性：

一般结合路由和动态组件一起使用，用于缓存组件； 提供 include 和 exclude 属性，两者都支持字符串或正则表达式， include 表示只有名称匹配的组件会被缓存，exclude 表示任何名称匹配的组件都不会被缓存 ，其中 exclude 的优先级比 include 高； 对应两个钩子函数 activated 和 deactivated ，当组件被激活时，触发钩子函数 activated，当组件被移除时，触发钩子函数 deactivated。

11. 讲讲按需加载——路由懒加载。

vue-router实现路由懒加载（动态加载路由）

三种方式。 第一种：vue异步组件技术====异步加载，vue-router配置路由，使用vue的异步组件技术，可以实现按需加载，但是，这种情况下一个组件生成一个js文件。 第二种：路由懒加载（使用import）。 第三种：webpack提供的require.ensure()，vue-router配置路由，使用webpack的require.ensure技术，也可以实现按需加载。这种情况下，多个路由指定相同的chunkName，会合并打包成一个js文件。

12. 项目组件化。

参考：blog.csdn.net/weixin_4327…

13. watch，computed的区别

  • computed：当一个属性受多个属性影响的时候就需要用到。computed最典型的例子：购物车商品结算的时候
  • watch：当一条数据影响多条数据的时候就需要用。watch例子：搜索数据

区别：

  • 处理数据的场景不同，监听器适合一个数据影响多个数据，计算属性适合一个数据受多个数据影响
  • 计算属性有缓存性，计算所得的值如果没有变化不会重复执行，但是watch会重复执行
  • 监听器选项提供了更通用的方法，适合执行异步操作或较大开销操作的情况

14. vue solt

简单来说，假如父组件需要在子组件内放一些DOM，那么这些DOM是显示、不显示、在哪个地方显示、如何显示，就是slot分发负责的活

15. 你对项目做过哪些优化？

  • 使用路由懒加载
  • 打包优化
  • 使用cdn加载第三方模块
  • 图片懒加载
  • 第三方模块按需加载
  • 压缩代码

16. vuex的几种状态。

  • State：定义了应用状态的数据结构，可以在这里设置默认的初始状态。
  • Getter：允许组件从 Store 中获取数据，mapGetters 辅助函数仅仅是将 store 中的 getter 映射到局部计算属性。
  • Mutation：是唯一更改 store 中状态的方法，且必须是同步函数。
  • Action：用于提交 mutation，而不是直接变更状态，可以包含任意异步操作。
  • Module：允许将单一的 Store 拆分为多个 store 且同时保存在单一的状态树中。

17. 讲讲你的项目难点。

业务逻辑很复杂而且多变

avatar
文章
阅读
粉丝