前端随心记---------前海面试汇总

Posted 2020-12-01 hudunyu

　　react里面：state和prop的区别？setState为什么是异步的？组件传值有几种方式？

答：1.prop用于定义外部接口，state用于记录内部状态。2.prop的赋值在外部使用组件时，state的赋值在组建内部。3.组件不应该改变prop的值，但是state的存在目的是让组件来改变。

　　2.setState异步更新状态使得并发更新组件成为可能。

　　资料：https://segmentfault.com/a/1190000013040438?utm_source=tag-newest

 　　3.组件传值的方式：

 　　父组件向子组件传值（通过props）

　　子传父（回调函数）

　　跨级组件传值

　　没有嵌套关系的组件通信

　　参考：https://www.cnblogs.com/dhcn/p/11125448.html

 

　　vuex里面存储的数据，怎么处理页面刷新丢失的问题？

　　可以直接改为本地存储，session storage等。

　　资料：https://www.cnblogs.com/goloving/p/9074574.html

 

　　amd规范和cmd规范的区别？

　　amd规范推崇依赖就近，cmd规范推崇依赖前置。

　　对依赖模块amd是提前执行，cmd是延迟执行。

 

　　spa应用怎么做seo？

　　服务器端渲染ssr，预渲染。

 

　　百度权重的优化方法？

　　友情链接，关键字，网站功能多时可以设置网站导航地图。

 

　　简单描述一下ajax的过程？

　　1.先创建一个xmlhttprequest对象。

　　2.open（）

　　3.send（）

　　4.判断服务器响应的状态。

 

　　怎么中断ajax的发送？

　　　一种是设置超时时间让ajax自动断开，

　　　　另一种为手动去停止ajax请求，其核心是调用XMLHttpRequest对象上的abort方法

 

　　vue-router是基于什么来实现的？

　　1.hash   ----------（#hash）

　　2.浏览器的history

　　资料：https://blog.csdn.net/qq_27674439/article/details/99821474

 

　　创建对象有几种方式？

　　1.字面量方式

　　2.构造函数

　　资料：https://www.cnblogs.com/topsyuan/p/11260399.html

　用原生的方法监听对象的变化？如对象有个name属性，如果改变为张三就alert张三，如果改变为李四就alert李四？

 

 

　　什么情况下会引起重绘和回流？

 　　重绘：当更新render tree中某个元素属性时，而这些属性只是影响元素外观风格，不影响布局，称为重绘。

　　回流：当render tree的一部分因为元素规模尺寸，布局，隐藏等改变需要重新构建时，称为回流。当页面第一次加载时一定会发生回流。

　　区别：回流必将引起重绘，重绘不一定会引起回流。

 

　　怎么实现一个div（正方形）高度随宽度变化而变化？

　　使用js监听div.style.height，在赋值给div的宽。

 

　　call和apply的区别？

　　1 call的语法：函数名.call(obj,参数1,参数2,参数3……);

　　2 apply的语法：函数名.apply(obj,[参数1,参数2,参数3……]);

　　这两个东西功能相同，就是把一个函数里面的this设置为某个对象，区别就是后面的参数的语法。call需要使用逗号分隔列出所有参数，但是apply是把所有参数写在数组里面。需要注意的是即使只有一个参数，也必须写在数组里面。

 

　　移动端开发中遇到过哪些问题？

 　　例如：插件安装问题，请求跨域问题等。

 

　　vue为什么对这个数组和对象进行监听？

　　watch:{} 对象，可监听数据，数据发生变化， 处理函数

目的： watch虽可监听，但只是浅监听，只监听数据第一层或者第二层，watch监听不到。可以设置deep：true做深度监听。

　　对vue的数据双向绑定。

  

　　常见的状态码有哪一些？403代表什么？

　　403服务器拒绝访问。

　　一个radio标签能在安卓上面添加一个click事件吗？

　　能。

　　具体实现参考：　

方法（@click.native.prevent）：
 
<el-radio-group v-model="radio2">
  <el-radio @click.native.prevent="clickitem(3)" :label="3"> 备选项</el-radio>
  <el-radio @click.native.prevent="clickitem(6)" :label="6"> 备选项</el-radio>
  <el-radio @click.native.prevent="clickitem(9)" :label="9"> 备选项</el-radio>
</el-radio-group>
           
clickitem (e) { 
     e === this.radio2 ? this.radio2 = ‘‘ : this.radio2 = e
 },

 

　　动画的优化方式有哪些？

　　图形图像优化，声音文件优化，文件及库的优化，代码的优化。

 

　　vue中keep-alive的作用？

　　 keep-alive 是 Vue 内置的一个组件，可以使被包含的组件保留状态，或避免重新渲染。

　

　　跨域的几种解决方案？

　　四种：1.jsonp     2.cros      3.domain.xml配置    4.正向代理。

 

　　get和post请求的区别？

　　post安全性比get好，get的参数在url上，post请求文件中，get用于获取数据，post主要用于提交数据。

 

　　什么是内存泄露？什么操作会引发内存泄露？

　　内存泄露是指程序中已动态分配的堆内存由于某种原因程序未释放或者无法释放，造成系统内存的浪费，导致程序运行速度减慢甚至系统崩溃等严重后果。

　　闭包使用不当引发

 

　　ie盒模型和w3c盒模型有什么区别？

　　ie盒模型content部分包含了padding和border

　　w3c盒模型content不包含。

 

　　讲讲你前端性能优化会做的一些工作？

　　雪碧图技术，压缩代码，合并复用的js和css文件，懒加载技术，css放在head中，设置浏览器缓存等。

 

　　webpack的fileload跟urlload的区别？

　　答： url-loader封装了file-loader。url-loader不依赖于file-loader，例如：我们需要background样式用url引入一张背景图，我们都知道webpack会将各模块进行打包，因此用url的路径是html页面入口，而不是原始的css文件，会导致图片引入失败。而使用file-load，可以解析项目中的url引入，根据我们的配置，将图片拷贝到相应的路径，根据我们的配置，修改打包后文件引用路径，指向正确文件。

 

　　css3怎么实现一条线围绕这个中心点做一个旋转的动画？

  　　答：使用css3的transform属性。

 

　　jquery里面on和bind的区别？

　　都是事件绑定，

　　区别：事件委托。

 

　对象的继承有哪些方式？

 　　原型链继承，使用call或apply方法，extends继承等。

　　资料：https://www.cnblogs.com/EternalZH/p/10402593.html

　　

　文件上传怎么做一个断点续传？

　　资料：https://www.cnblogs.com/libin-1/p/5958791.html