前端面试题02

1 javascript垃圾回收方法

① 标记清除 

这是js最常见的垃圾回收方式,当变量进入执行环境的时候,比如函数中声明一个变量,垃圾回收器将其标记为“进入环境”,当变量离开环境的时候(函数执行结束)将其标记为“离开环境”

垃圾回收期会在运行的时候给存储在内存中的所有变量加上标记,然后去掉环境中的变量以及被环境中的变量所引用的变量(闭包),在这些完后曾之后仍存在标记的就是要删除的变量了。

② 引用计数

引用计数的策略就是跟踪记录每个值别使用的次数,当声明了一个变量,并将一个引用类型赋值给该变量的时候,这个值的引用次数就加1,如果该变量的变为另一个,则这个值的引用次数减1,当这个值达到引用次数变为0的时候,说明没哟变量在使用,这个值就没法被访问了,因此可以将其占用的空间收掉,这样垃圾回收器会在运行的时候清理掉引用次数为0的值占用的空间。

2 vue有哪几种状态和属性

有五种,分别是State,Getter,Mutation,Action,Module

3 vue生命周期

① beforeCreate 创建实例之前执行的钩子事件

② created 实例创建完成之后执行的钩子

③ beforeMount 将编译完成的HTML挂载到对应虚拟dom时触发的钩子,此时页面没有内容

④ mounted 编译好的HTML挂载到页面完成后执行的钩子事件,此时钩子函数中一般会做一些ajax请求获取数据

⑤ beforeUpdate 更新之前的钩子

⑥ updated 更新之后的钩子

⑦ beforeDestory 实例销毁之前执行的钩子

⑧ destoryed 实例销毁之后执行的钩子

⑨ actived 组件激活时执行的钩子

⑩ deactivated 组件不激活执行的钩子

⑪ errorCapured 当子孙组件报错时,会调用这个钩子函数

4 created和mounted的区别

created:在模板渲染成html前调用,通常是初始化某些属性值,然后再渲染成视图

mounted:在模板渲染成html后调用,通常是初始化页面完成后,再对html的dom节点进行一些需要的操作

5 vue-router和location.href的用法区别

① vue-router使用pushState进行路由更新,静态跳转,页面不会重新加载,location.href会触发浏览器,页面重新加载一次

② vue-router使用diff算法,实现按需加载,减少dom操作

③ vue-router是路由跳转或同一个页面跳转,location.href是不同页面间跳转

④ vue-router是异步加载this.$nextTick(()=>{}),localtion.href是同步加载

6 vue封装组件过程

① 将模板抽离出来成一个单独文件

② 暴露出一个install方法,在里面用Vue.component()方法注册组件

③ 在main.js中引入Vue.use()然后就可以直接使用了。

7 call、apply、bind的异同

相同点:都可以改变函数的this指向

区别:apply和call的区别在于call传递多个参数的时候要一个一个穿,而apply传递多个参数的时候传递一个数组。apply、call和bind的区别在于前者立即执行,而后者在需要的时候执行。

8 请你谈一谈http

① http:是互联网上应用最为广泛的一种网络协议,是一个客户端和服务器端请求和应答的标准,用于www服务器传输超文本到本地浏览器的传输协议,它可以使浏览器更加高效,使网络传输减少

② http特点:

1)无连接,传输速度快,减少不必要的连接,但也意味着每一次的访问都要建立一次连接,效率降低。

2)无状态,对于事物处理没有记忆能力,每一次请求都是独立的,不记录客户端任何行为,解放服务器,但可能每次请求会传输大量重复的内容

3)简单灵活可以传输任何类型的数据

③ 对于http请求的方式可能会涉及到增删改查的请求方式,用的最多的可能是get和post,而发送get和post请求的区别大致如下

1)get请求的数据小,请求的地址展示在url地址栏,数据相对不安全

2)post请求,数据的长度比get请求大,请求的数据在发送的http请求体当中,数据先对安全

上述两点可能发现get请求方式缺点居多,而在工作中又经常使用的更多可能是get请求数据效率比较快。

9 vue和jquery对比

① jQuery是使用$选取DOM对象,对其进行赋值、取值等操作和原生js的区别在于可以更方便的选取和操作DOM对象,而数据和页面是在一起的

② Vue是通过Vue对象将数据和View完全分离开了,对数据进行操作不需要引用相对应的DOM对象,可以说数据和视图是分离的

10 css3新增伪类

:first-of-type li:first-of-type 选择li父元素第一个li子元素

:last-of-type li:last-of-type 选择li父元素最后一个li子元素

:only-of-type li:only-of-type 选择li父元素只有一个li子元素的元素

:first-child li:first-child 选择父元素下第一个元素为li的元素

:only-child p:only-child 选择属于其父元素的唯一子元素的每个

元素

:nth-child(n) 选择属于其父元素的第n个子元素的每个

元素。

:nth-last-child  选择属于其父元素的倒数第n个子元素的每个

元素。

:nth-last-child(n) 选择属于其父元素倒数第n个

元素的每个

元素。

:last-child 选择属于其父元素最后一个子元素的每个元素。

:empty 选择没有子元素的每个

元素(包括文本节点)

:target 选择当前活动的

元素

:nth(p) 选择非

元素的每个元素。

:enabled 控制表单控件的可用状态。

:disabled 控制表单控件的禁用状态。

:checked 单选框或复选框被选中。

11 新增伪类

:hover 将样式添加到鼠标悬浮的袁术

:active 将样式添加到被激活的元素

:focus 将样式添加到获得焦点的元素

:link 将样式添加到未被访问过的链接

:visited 将样式添加到被访问过的链接

:lang 定义元素中使用的语言

12 rem布局和flex布局区别

① rem布局是根据根元素字体大小来等比例缩放,主要用来解决页面在不同设备的适配的问题,

② flex布局:弹性盒子 设置了flex的元素,他的子元素自动成为容器成员,宽度等比例,高度固定。

13 响应式布局的原理

用media动态根据当前屏幕的宽度,自动改变页面中盒子的宽度,盒子的显示与隐藏

14 promise原理

15 async和await 以及对比Generator的优势

16 ajax和axios的区别

axios是通过promise实现对ajax技术的一种封装,就像ajax是通过jquery来封装一样

也就是说jQuery 将请求技术进行了封装,变成了 ajax , 而 通过 promise 又把 ajax 进行封装就成了 axios。

17 git常用的命令行

① git clone XXXXXXX      -----clone一个项目

② git pull      -----更新线上最新文件

③ git add .     -----添加本地缓存

④ git commit -m '描述'      -----提交备注

⑤ git push origin XXXXX      -----提交到远程分支或主干  例:git push origin  branches  这个就是提交到远程branches这个分支

⑥ git checkout XXXX      -----切到分支 例:git checkout master    这个就是切换到主干

⑦ git checkout -b XXXXX      -----创建新的分支 

⑧ git merge XXXXX      -----合并到主支 例:git merge master  这个是合并到主干

⑨ git log      -----查看提交了哪几个版本,会显示相应的版本号

18 new的时候会执行哪些操作

① 创建一个空对象:并且将this变量引入该对象,同时还继承了函数的原型

② 设置原型链:将空对象指向构造函数的原型对象

③ 执行函数体:修改构造函数this指针指向空对象,并执行函数体

④ 判断返回值:返回一个对象就用该对象,没有的话就创建一个对象

19 v-show 和 v-if 指令的共同点和不同点

① 相同点:

v-show 和v-if 都能控制元素的显示和隐藏。

② 不同点

1)实现本质方法不同 v-show 本质就是通过设置 css 中的 display 设置为 none,控制隐藏 v-if 是动态的向 DOM 树内添加或者删除 DOM 元素

2)编译的区别 v-show 其实就是在控制 css,v-if 切换有一个局部编译/卸载的过程,切换过程中合适地销毁和重建内部的事件监听和子组件

3)编译的条件 v-show 都会编译,初始值为 false,只是将 display 设为 none,但它也编译了 v-if 初始值为 false,就不会编译了

4)v-show 只编译一次,后面其实就是控制 css,而 v-if 不停的销毁和创建,故 v-show 性能更好一

③ 因为 v-show 实际是操作 display:" "或者 none,当 css 本身有 display:none时,v-show 无法让显示

④ 总结(适用场景):

如果要频繁切换某节点时,使用 v-show(无论true 或者false 初始都会进行渲染,此后通过 css 来控制显示隐藏,因此切换开销比较小,初始开销较大),如果不需要频繁切换某节点时,使用 v-if(因为懒加载,初始为 false 时,不会渲染,但是因为它是通过添加和删除 dom 元素来控制显示和隐藏的,因此初始渲染开销较小,切换开销比较大)

20 ajax的使用

① 得到XMLHttpRequest对象,注意ie6不兼容

② 得到XMLHttpRequest对象的open方法,注意参数问题

③ Ajax的回调函数,服务器响应之后,得到数据的处理

④ 发送请求send方法。

你可能感兴趣的:(前端面试题02)