已经面过的公司里面试官大都喜欢先从自己之前写过的项目切入,开启面试的第一步,所以项目无论是之前做过的还是现在正在做的,都要认真复盘准备
写几个当时没答好的几个题吧,供大家参考 :
问到了单页应用
单页应用 SEO差 页面切换慢快
单页应用:用vue写的项目是单页应用,刷新页面会请求一个HTML文件,切换页面的时候,并不会发起新的请求一个HTML文件,只是页面内容发生了变化
vue.js原理:JS感知URL变化,当URL发生变化后,使用JS动态把当前的页面内容清除掉,再把下一个页面的内容挂载到页面上。此时的路由就不是后端来做了,而是前端来做,判断页面到底显示哪一个组件,再把以前的组件清除掉使用新的组件。就不会每一次跳转都请求HTML文件。
多页面应用 SEO(搜索引擎排名)效果好 页面切换慢慢
每次页面跳转,后台都会返回一个新的HTML文档,就是多页面应用。
Es5的constructor和Es6的class
ES5构造函数中,使用this调用公有属性,这里的this指向是实例化对象;方法一般被定义在函数的prototype属性中是为了让使用同一构造函数生成的实例化对象都是相同方法
ES6的话直接在class内部定义方法,不需要定义在prototype中
ES6中定义的class类,不是function函数,不会被js程序预解析,所以是不能被提前调用的,但class中定义的方法在class内部虽然没有写function,但js会自动补足,所以是可以在class内部提前调用的
Ajax,axios,fetch的区别
三者都用于网络请求,但是不同维度
-
Ajax,一种技术统称
-
Fetch,一个具体的api
-
浏览器原生API,用于网络请求
-
和XMLHttpRequest一个级别
-
Fetch语法更加简洁,易用,支持Promise
-
function ajax2(url){ return fetch(url).then(res => res.json()) }
-
-
Axios,是一个第三方库
- 最常用的网络请求lib(library – 库)
- 内部可用XMLHttpRequest和Fetch来实现
- Axios,第三方库
服务端渲染和客户端渲染的区别
服务器端渲染
优点:对SEO友好,因为我们经过服务器端渲染的页面,在网络中传输的时候,传输的是一个真实的页面。因此,爬虫客户端,当爬到我们的页面后,会分析系我们给他提供的这个页面,此时,我们页面中的关键数据就会被爬虫给收录了。
缺点: 服务器端渲染,对服务器压力比较大,可以使用服务器端的页面缓存技术,减轻服务器的渲染压力;不适合前后端分离开发。
客户端渲染
每当用户要请求某个页面了,
第一步,用户需要先把这个页面请求到客户端,此时用户拿到的页面只是一个模板页面。
第二步,浏览器在解析模板页面的时候,会发起art-template的二次资源请求,同时要发送Ajax请求,去服务器获取数据
第三步,在客户端调用art-template 渲染HTML结构,并把渲染厚的htmlStr append 到页面指定的容器中;
缺点: 对SEO相当不友好
优点: 减轻了服务器端的渲染压力;同时,最大的好处就是:能够实现前后端分离开发;
各自应用的场景:
1、当不需要对SEO友好的时候,推荐使用客户端渲染;
2、当需要对 SEO友好的时候,推荐使用服务器端渲染
参考资料 :
- https://zhuanlan.zhihu.com/p/79409388